masked input with javascript on a textbox

Question

i am trying to mask input with jquery like this on my textbox but it is not doing anything:

 $(function() {
         $("#<%= received_dateTextbox.ClientID %>").mask("99/99/9999");
...
...

and i have also tried like this:

$('#received_dateTextbox').mask("99-9999999");

what am i doing wrong?

i have included this:

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

here is the html:

<body>
    <form id="form1" runat="server">
    <div>

        <table>
        <tr><td>Sample Received Date:</td>
            <td><asp:TextBox ID="received_dateTextbox" runat="server"></asp:TextBox></td><td></td><td></td><td></td>..........

here is the COMPLETE source:

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="LOMForm.aspx.cs" Inherits="EnterData.DataEntry.LOMForm" %>

<!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></title>
    <style type="text/css" media=screen>
    .TreeNodeOver 
{
 font-family: Tahoma;
 font-size: 8pt;
 color: black;
 text-decoration: underline; 
 cursor: pointer;
 cursor: hand;
 padding-left: 3px; 
}


<link rel="stylesheet" type="text/css" href="../jquery-ui-1.8.16.custom.css" />

</style>



          <script type="text/javascript" src="../jquery-ui-1.8.16.custom.min.js"></script>
<script type="text/javascript" src="../jquery-ui.js"></script>
<script type="text/javascript" src="../jquery.js"></script>
<script type="text/javascript" src="../jquery.maskedinput-1.2.2.js"></script>
<script type="text/javascript" src="../jquery.min.js"></script>
<script type="text/javascript" src="../jquery-1.6.2.min.js"></script>
<script type="text/javascript" src="../jquery.multiselect.js"></script>
<script type="text/javascript">







    $(function() {
         $("#<%= received_dateTextbox.ClientID %>").mask("99/99/9999");
        $('table input:checkbox').click(function() {
            if ($(this).prop('checked')) {
                var checkText = $(this).next('a').text();
                if (checkText.indexOf('Liquid Handler #:') != -1) {
                    var userInput = prompt("Liquid Handler #:", "Liquid Handler #:");
                    $(this).next('a').html('Liquid Handler #:' + '<font color="red">' + userInput + '</font>');
                }
                if (checkText.indexOf('Olympus #:') != -1) {
                    var userInput = prompt("Olympus #:", "Olympus #:");
                    $(this).next('a').html('Olympus #:' + '<font color="red">' + userInput + '</font>');
                }
                if (checkText.indexOf('LC-MS/MS #:') != -1) {
                    var userInput = prompt("LC-MS/MS #:", "LC-MS/MS #:");
                    $(this).next('a').html('LC-MS/MS #:' + '<font color="red">' + userInput + '</font>');

                }
                if (checkText.indexOf('Liquid Handler#:') != -1) {
                    var userInput = prompt("Liquid Handler#:", "Liquid Handler#:");
                    $(this).next('a').html('Liquid Handler#:' + '<font color="red">' + userInput + '</font>');

                }
                if (checkText.indexOf('Olympus#:') != -1) {
                    var userInput = prompt("Olympus#:", "Olympus#:");
                    $(this).next('a').html('Olympus#:' + '<font color="red">' + userInput + '</font>');

                }
                if (checkText.indexOf('LC-MS/MS#:') != -1) {
                    var userInput = prompt("LC-MS/MS#:", "LC-MS/MS#:");
                    $(this).next('a').html('LC-MS/MS#:' + '<font color="red">' + userInput + '</font>');

                }
                if (checkText.indexOf('Wrong Practice Code') != -1) {

                    var userInput = prompt("Do you want to check Report Sent to Wrong Location/Physician?", "y/n");
                    if (userInput.indexOf('y') != -1) {
                        var elNode = document.getElementById("TreeView1n66CheckBox");
                        $(elNode).prop("checked", true);
                    }
                }
                if (checkText.indexOf('Other:') != -1) {
                    var userInput = prompt("Other:", "Other:");
                    $(this).next('a').html('Other:' + '<font color="red">' + userInput + '</font>');
                }

            }
        });
    });



</script>
</head>
<body>
    <form id="form1" runat="server">
    <div>

        <table>
        <tr><td>Sample Received Date:</td>
            <td><asp:TextBox ID="received_dateTextbox" runat="server"></asp:TextBox></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>


    <tr><td>Site Of Occurrence:</td><td>
        <asp:TextBox ID="site_of_occurrenceTextBox" runat="server"></asp:TextBox></td><td>Occurrence Date:</td><td>
            <asp:TextBox ID="occurrence_dateTextBox" runat="server"></asp:TextBox></td><td>Report Date:</td>
                <td><asp:TextBox ID="report_dateTextBox" runat="server"></asp:TextBox></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>


    <tr><td>Specimen ID:</td><td>
        <asp:TextBox ID="spec_idTextBox" runat="server"></asp:TextBox></td><td>Batch ID:</td><td>
            <asp:TextBox ID="batch_idTextBox" runat="server"></asp:TextBox></td><td>Report Initiated By:</td>
                <td><asp:TextBox ID="report_byTextBox" runat="server"></asp:TextBox></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
    </table>
    <table>

    <tr><td>Problem Identified By:</td>
    <td>
            <asp:CheckBox ID="chkDESpec" runat="server" Text="DE/Spec Res"/></td>
            <td>
                <asp:CheckBox ID="chkLAB" runat="server" Text="LAB"/>
                    <asp:CheckBox ID="chkCLS" runat="server" Text="CLS"/>
                        <asp:CheckBox ID="chkPractice" runat="server" Text="Practice"/>
                            <asp:CheckBox ID="chkBilling" runat="server" Text="Billing"/>
                                <asp:CheckBox ID="chkSalesRep" runat="server" Text="Sales Rep"/>
                                    <asp:CheckBox ID="chkOther" runat="server" Text="Other:"/>

                                        <asp:TextBox ID="otherTextBox" runat="server"></asp:TextBox></td><td></td><td></td><td></td><td></td><td></td></tr>
       </table>



    </div>


    <asp:TreeView ID="TreeView1" runat="server" ShowLines="True" 
        onselectednodechanged="TreeView1_SelectedNodeChanged" 
        ontreenodecheckchanged="TreeView1_TreeNodeCheckChanged" CssClass="mytreeview"
        >
        <Nodes>
            <asp:TreeNode Text="PreAnalytical" Value="PreAnalytical" Expanded="False">
                <asp:TreeNode Text="Labels" Value="Labels" Expanded="False">
                    <asp:TreeNode Text="Specimen collection device mislabeled/unlabeled by practice" 
                        Value="Specimen collection device mislabeled/unlabeled by practice" 
                        ShowCheckBox="True">
                    </asp:TreeNode>
                    <asp:TreeNode Text="Specimen mislabeled: in-house error (Lab or DE)" 
                        Value="Specimen mislabeled: in-house error (Lab or DE)" 
                        ShowCheckBox="True"></asp:TreeNode>
                </asp:TreeNode>
                <asp:TreeNode Text="Test Requisitions" Value="Test Requisitions" 
                    Expanded="False">
                    <asp:TreeNode Text="Missing: no form sent with specimen" 
                        Value="Missing: no form sent with specimen" ShowCheckBox="True"></asp:TreeNode>
                    <asp:TreeNode Text="Wrong (i.e. OT instead of ORAL, sister practice)" 
                        Value="Wrong (i.e. OT instead of ORAL, sister practice)" 
                        ShowCheckBox="True"></asp:TreeNode>
                    <asp:TreeNode Text="Other: Non-ML" Value="Other: Non-ML" ShowCheckBox="True"></asp:TreeNode>
                    <asp:TreeNode Text="Copies Received: New ID/Req. assigned" 
                        Value="Copies Received: New ID/Req. assigned" ShowCheckBox="True"></asp:TreeNode>
                    <asp:TreeNode Text="Incomplete/Blank Requisition Form" 
                        Value="Incomplete/Blank Requisition Form" ShowCheckBox="True"></asp:TreeNode>
                    <asp:TreeNode Text="2 Specimens: 1 Req" Value="2 Specimens: 1 Req" 
                        ShowCheckBox="True">
                    </asp:TreeNode>
                    <asp:TreeNode Text="2 Reqs: 1 Specimen" Value="2 Reqs: 1 Specimen" 
                        ShowCheckBox="True">
                    </asp:TreeNode>
                </asp:TreeNode>
                <asp:TreeNode Text="Validity" Value="Need POC Results Confirmed" 
                    Expanded="False">
                    <asp:TreeNode Text="Need POC Results Confirmed" Value="New Node"></asp:TreeNode>
                    <asp:TreeNode Text="POC Results Marked Incorrectly" Value="New Node">
                    </asp:TreeNode>
                    <asp:TreeNode Text="No Tests Ordered" Value="New Node"></asp:TreeNode>
                    <asp:TreeNode Text="SEC A Unclear" Value="New Node"></asp:TreeNode>
                </asp:TreeNode>
                <asp:TreeNode Text="Sales" Value="Sales" Expanded="False">
                    <asp:TreeNode Text="Practice is not entered in database" Value="New Node">
                    </asp:TreeNode>
                    <asp:TreeNode Text="CP has not been updated" Value="New Node"></asp:TreeNode>
                </asp:TreeNode>
                <asp:TreeNode Text="Other" Value="Other" Expanded="False">
                    <asp:TreeNode Text="Other" Value="New Node"></asp:TreeNode>
                </asp:TreeNode>
            </asp:TreeNode>
            <asp:TreeNode Text="Analytical" Value="Analytical" Expanded="False">
                <asp:TreeNode Text="Reagent Problem" Value="Reagent Problem" Expanded="False">
                    <asp:TreeNode ShowCheckBox="True" Text="QC Failure" Value="QC Failure">
                    </asp:TreeNode>
                    <asp:TreeNode ShowCheckBox="True" Text="QC Contamination" 
                        Value="QC Contamination"></asp:TreeNode>
                    <asp:TreeNode ShowCheckBox="True" Text="Absence of INSTD" 
                        Value="Absence of INSTD"></asp:TreeNode>
                </asp:TreeNode>
                <asp:TreeNode Text="Instrument Problem/Failure" 
                    Value="Instrument Problem/Failure" Expanded="False">
                    <asp:TreeNode ShowCheckBox="True" Text="Liquid Handler #:" 
                        Value="Liquid Handler #:"></asp:TreeNode>
                    <asp:TreeNode ShowCheckBox="True" Text="Olympus #:" Value="Olympus #:">
                    </asp:TreeNode>
                    <asp:TreeNode ShowCheckBox="True" Text="LC-MS/MS #:" Value="LC-MS/MS #:">
                    </asp:TreeNode>
                </asp:TreeNode>
                <asp:TreeNode Text="Processing Problem" Value="Processing Problem" 
                    Expanded="False">
                    <asp:TreeNode ShowCheckBox="True" Text="Aliquoting/Sample Processing" 
                        Value="Aliquoting/Sample Processing"></asp:TreeNode>
                    <asp:TreeNode ShowCheckBox="True" Text="Specimen Contamination/Carryover" 
                        Value="Specimen Contamination/Carryover"></asp:TreeNode>
                    <asp:TreeNode ShowCheckBox="True" Text="Plate Contamination" 
                        Value="Plate Contamination"></asp:TreeNode>
                    <asp:TreeNode ShowCheckBox="True" Text="Blank Contamination" 
                        Value="Blank Contamination"></asp:TreeNode>
                </asp:TreeNode>
                <asp:TreeNode Text="Delay in Production" Value="Delay in Production" 
                    Expanded="False">
                    <asp:TreeNode ShowCheckBox="True" Text="Liquid Handler#:" 
                        Value="Liquid Handler#:"></asp:TreeNode>
                    <asp:TreeNode ShowCheckBox="True" Text="Olympus#:" Value="Olympus#:">
                    </asp:TreeNode>
                    <asp:TreeNode ShowCheckBox="True" Text="LC-MS/MS#:" Value="LC-MS/MS#:">
                    </asp:TreeNode>
                </asp:TreeNode>
                <asp:TreeNode ShowCheckBox="True" Text="Operator Error" Value="Operator Error">
                </asp:TreeNode>
            </asp:TreeNode>
            <asp:TreeNode Text="Post-Analytical" Value="Post-Analytical" Expanded="False">
                <asp:TreeNode Text="Data Entry" Value="Data Entry" Expanded="False">
                    <asp:TreeNode ShowCheckBox="True" Text="Medications" Value="Medications">
                    </asp:TreeNode>
                    <asp:TreeNode ShowCheckBox="True" Text="Tests" Value="Tests"></asp:TreeNode>
                    <asp:TreeNode ShowCheckBox="True" Text="Collection Date" 
                        Value="Collection Date"></asp:TreeNode>
                    <asp:TreeNode ShowCheckBox="True" Text="Patient Name" Value="Patient Name">
                    </asp:TreeNode>
                    <asp:TreeNode ShowCheckBox="True" Text="DOB" Value="DOB"></asp:TreeNode>
                    <asp:TreeNode ShowCheckBox="True" Text="SSN" Value="SSN"></asp:TreeNode>
                    <asp:TreeNode ShowCheckBox="True" Text="Requesting Physician" 
                        Value="Requesting Physician"></asp:TreeNode>
                    <asp:TreeNode ShowCheckBox="True" Text="Wrong Practice Code" 
                        Value="Wrong Practice Code"></asp:TreeNode>
                    <asp:TreeNode ShowCheckBox="True" 
                        Text="Corrected Report - patient name &amp; all demos wrong" 
                        Value="Corrected Report - patient name &amp; all demos wrong">
                    </asp:TreeNode>
                    <asp:TreeNode ShowCheckBox="True" Text="Other" Value="Other"></asp:TreeNode>
                </asp:TreeNode>
                <asp:TreeNode Text="Practice Error" Value="Practice Error" Expanded="False">
                    <asp:TreeNode ShowCheckBox="True" Text="Medications" Value="Medications">
                    </asp:TreeNode>
                    <asp:TreeNode ShowCheckBox="True" Text="Tests" Value="Tests"></asp:TreeNode>
                    <asp:TreeNode ShowCheckBox="True" Text="Demographics" Value="Demographics">
                    </asp:TreeNode>
                    <asp:TreeNode ShowCheckBox="True" Text="Other" Value="Other"></asp:TreeNode>
                </asp:TreeNode>
                <asp:TreeNode Text="Sales Support/Client" Value="Sales Support/Client" 
                    Expanded="False">
                    <asp:TreeNode ShowCheckBox="True" Text="Wrong Report Template" 
                        Value="Wrong Report Template"></asp:TreeNode>
                    <asp:TreeNode ShowCheckBox="True" Text="Typo Practice Name or Phyisician" 
                        Value="Typo Practice Name or Phyisician"></asp:TreeNode>
                    <asp:TreeNode ShowCheckBox="True" Text="E-mail Address" Value="E-mail Address">
                    </asp:TreeNode>
                    <asp:TreeNode ShowCheckBox="True" Text="Fax Number" Value="Fax Number">
                    </asp:TreeNode>
                    <asp:TreeNode ShowCheckBox="True" Text="Custom Profile entered incorrectly" 
                        Value="Custom Profile entered incorrectly"></asp:TreeNode>
                    <asp:TreeNode ShowCheckBox="True" Text="Other" Value="Other"></asp:TreeNode>
                </asp:TreeNode>
                <asp:TreeNode Text="Sales" Value="Sales" Expanded="False">
                    <asp:TreeNode ShowCheckBox="True" Text="CP Update Needed" 
                        Value="CP Update Needed"></asp:TreeNode>
                    <asp:TreeNode ShowCheckBox="True" Text="Client Education Needed" 
                        Value="Client Education Needed"></asp:TreeNode>
                    <asp:TreeNode ShowCheckBox="True" Text="Other" Value="Other"></asp:TreeNode>
                </asp:TreeNode>
                <asp:TreeNode Text="Operator Error" Value="Operator Error" Expanded="False">
                    <asp:TreeNode ShowCheckBox="True" 
                        Text="Report Sent to Wrong Location/Physician" 
                        Value="Report Sent to Wrong Location/Physician"></asp:TreeNode>
                    <asp:TreeNode ShowCheckBox="True" Text="Other" Value="Other"></asp:TreeNode>
                </asp:TreeNode>
                <asp:TreeNode Text="Laboratory" Value="Laboratory" Expanded="False">
                    <asp:TreeNode ShowCheckBox="True" Text="Corrected Report - reporting error" 
                        Value="Corrected Report - reporting error"></asp:TreeNode>
                    <asp:TreeNode ShowCheckBox="True" Text="Physician Requested Repeat" 
                        Value="Physician Requested Repeat"></asp:TreeNode>
                    <asp:TreeNode ShowCheckBox="True" Text="Other" Value="Other"></asp:TreeNode>
                </asp:TreeNode>
            </asp:TreeNode>
            <asp:TreeNode Text="Other" Value="Other" Expanded="False">
                <asp:TreeNode ShowCheckBox="True" Text="QuikLab/MLIS Problem" 
                    Value="QuikLab/MLIS Problem"></asp:TreeNode>
                <asp:TreeNode ShowCheckBox="True" Text="Practice Complaint" 
                    Value="Practice Complaint"></asp:TreeNode>
                <asp:TreeNode ShowCheckBox="True" Text="Shipping (FedEx, UPS)" 
                    Value="Shipping (FedEx, UPS)"></asp:TreeNode>
                <asp:TreeNode ShowCheckBox="True" Text="Billing" Value="Billing"></asp:TreeNode>
                <asp:TreeNode ShowCheckBox="True" Text="Other:" Value="Other:"></asp:TreeNode>
            </asp:TreeNode>
        </Nodes>
    </asp:TreeView>



    <asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Submit" />



    </form>
</body>
</html>

mask is not an out of the box jquery function. Which plugin are you using? — DevinB
– DevinB, Commented Oct 11, 2011 at 18:27
<script type="text/javascript" src="../jquery.maskedinput-1.2.2.js"></script> — Alex Gordon
– Alex Gordon, Commented Oct 11, 2011 at 18:28

airportyh · Accepted Answer · 2011-10-11 18:43:49Z

1

There's not enough information to answer this question. I would give the following suggestions:

Look for Javascript errors from the JS console and post it here(Firebug for Firefox or Chrome/Safari/IE dev tools).
Reduce your code to the bare minimum required to reproduce the problem and put it on jsFiddle and ask folks to look at it.

answered Oct 11, 2011 at 18:43

airportyh

22.8k13 gold badges61 silver badges75 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Germán Rodríguez · Accepted Answer · 2011-10-11 18:40:16Z

1

firebug or developer tools from google chrome, will always give you a good hint of what is happening, sintax problem or even debugging possibilities

answered Oct 11, 2011 at 18:40

Germán Rodríguez

4,2881 gold badge21 silver badges19 bronze badges

Collectives™ on Stack Overflow

masked input with javascript on a textbox

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related