Thursday, May 29, 2014

Manipulating the Asp.Net Textbox with Custom Inputs using JQuery

Manipulating the Asp.Net Textbox with Custom Inputs using JQuery

Step 1:- Add this Source tag in the top
<script src="js/jquery-1.4.1.js" type="text/javascript"></script>

For jquery-1.4.1.js  this file follow below link

Step 2:- Write this code below

Put Client ID Mode Static in the Top ClientIDMode="Static" %>

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="TextBoxManipulationUsingJavascript.aspx.cs"
    Inherits="SampleTestingCodes.TextBoxManipulationUsingJavascript" ClientIDMode="Static" %>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="js/jquery-1.4.1.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $('#TextBox1').keyup(function (e) {
                var message = $("#TextBox1").val();
                var length = message.length;
                if (message.charAt(0) == "A") {
                    if (message.charAt(1) == "A") {
                        for (var i = 2; i < length; i++) {
                            if (message.charAt(i) >= 0 || message.charAt(i) <= 9) { }
                            else
                            { $("#TextBox1").val(message.slice(0, i)); }
                            if (length > 12)
                                $("#TextBox1").val(message.slice(0, 12));
                        }
                    }
                    else { $("#TextBox1").val(message.slice(0, 1)); }
                }
                else { $("#TextBox1").val(''); }
            });
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>//////AA0123456789
    </div>
    </form>
</body>
</html>


Output:-

This Code textbox only allows

AA0123456789




For any clarifications or queries please don’t hesitate to call or Email 

Phone :- + 91-9492179390


Email :- lannam@technobrainltd.com (or) lokeshtec@gmail.com 



No comments:

Post a Comment