views:

483

answers:

2

Hi, I have problem while using jquery maskedinput with asp.net textbox. I have a check box that when I check will set a mask to the textbox and when uncheck it change the mask. the problem that when the focus is lost before the mask completed to be filled the text box will empty.

how can I fix the problem???

here is my code:

<html xmlns="http://www.w3.org/1999/xhtml"&gt;
<head runat="server">
    <title>Untitled Page</title>



    <script src="js/jquery-1.4.1.js" type="text/javascript"></script>


    <script src="js/jquery.maskedinput-1.2.2.js" type="text/javascript"></script>
    <script type="text/javascript">


         function mycheck() {

            if ($('#<%=chk.ClientID %>').is(':checked')) 

                {
                        $("#<%=txt.ClientID %>").unmask();
                        $("#<%=txt.ClientID %>").val("");
                        $("#<%=txt.ClientID %>").mask("999999999999");

                    } 
                    else
                     {
                        $("#<%=txt.ClientID %>").unmask();
                        $("#<%=txt.ClientID %>").val("");
                        $("#<%=txt.ClientID %>").mask("(999)999-9999");

                    }






        }
    </script>

    <style type="text/css">
        #form1
        {
            margin-top: 0px;
        }
    </style>

</head>
<body>
    <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server" />
        <div>

        <p>
            <asp:CheckBox ID="chk" runat="server" CssClass="kk" 
                onclick="mycheck()"  />
        </p>

         <p>
           <asp:TextBox ID="txt" runat="server" CssClass="tt"  ></asp:TextBox>

        </p>


        </div>
    </form>
</body>
</html>
A: 

there is a problem with plugin itself and I reported that.

Eyla
+2  A: 

This is by design. The default for my masked input plugin is to clear out the input if the mask isn't completely filled out. If you would like your mask to allow incomplete input, you may insert a '?' character where you would like optional characters to begin.

For example:

To mask a phone number with an optional extension $(selector).mask('(999) 999-9999 ?x99999');

To make a phone number where everything is optional $(selector).mask('?(999) 999-9999');

Josh Bush