Tuesday, March 5, 2013

Change Input to Upper Case using Java Script

In many web sites, you will have to see that when user types into text box then input text converts into Upper case automatically even if you type in lower case. Here I am going to show you a simple example how can we do this using java script.

In previous posts, I explained Calculate age using java scriptjQuery .toggleClass() example, jQuery Draggable Div Example in ASP.Net, jQuery Resizable Div Example in ASP.Net, Drag and drop HTML list item with in list using jQuery, jQuery Magnifier Example an other article related to jQuery and Java Script.

Here, I will show you a simple example of  converting the input value in to uppercase using jQuery in ASP.Net.

To implement this we need to write the code like as shown below
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="InputintoUpperCase._Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Change Input to Upper Case</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $("#txtTest").keyup(function () {
                this.value = this.value.toUpperCase();
            });
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:Label ID="lblText" runat="server" Text="Enter Text Value :" Font-Bold="true"></asp:Label>
        <asp:TextBox ID="txtTest" runat="server"></asp:TextBox>
    </div>
    </form>
</body>
</html>

Live Demo


2 comments:

  1. Hi Manish, Can you please help me in Javascript core to have a sliding recentg post widget for blogger?

    ReplyDelete
  2. Hi Aniruddh, Currently I have no idea but I will try to find out and let you know

    ReplyDelete

^ Scroll to Top