ClientValidationFunction in Custom validator not firing

asp.net, customvalidator, javascript, jquery

Solution

Your Main problem is, the Textbox is empty, so any args are not assigned before the user types any values in Textbox, so the function does not get called. If you type any values in textbox, then the custom validator is working good, so you need a `RequiredFieldValidator`.

Try this instead of your code

 <script>
    function isPhoneNumberValid(sender, args) {
        alert("l");
        if (args.Value.length < 2)
            args.isValid = false;
    }
</script>

<h3>We suggest the following:</h3>
<asp:TextBox ID="txtPhoneNo" runat="server" CssClass="textbox3" size="60" 
             Width="350px" TabIndex="4"></asp:TextBox>
&nbsp;<span style="font-size: 12px;">(000-000-0000)</span>
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" 
     ValidationGroup="xxx" ControlToValidate="txtPhoneNo" Font-Size="9pt" 
     Display="Dynamic" ForeColor="Red" ErrorMessage="This field is Empty">
</asp:RequiredFieldValidator>
<asp:CustomValidator ID="CustomValidator1" runat="server" ErrorMessage=
     "Phone number is not valid" ClientValidationFunction="isPhoneNumberValid" 
     Font-Size="9pt" ForeColor="Red" ValidationGroup="xxx" Display="Dynamic" 
     ControlToValidate="txtPhoneNo">
</asp:CustomValidator>
<asp:Button ID="Button1" runat="server" Text="Button" ValidationGroup="xxx" />

You need first check the asp:RequiredFieldValidator, then use custom validator

<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" 
     ValidationGroup="xxx" ControlToValidate="txtPhoneNo" Font-Size="9pt" 
     Display="Dynamic" ForeColor="Red" ErrorMessage="This field is Empty">
</asp:RequiredFieldValidator>

Problem

`Google` is full of this kind of questions but I guess my problem is little bit different. What make is different is here I used `masked input` I included `jquery.maskedinput-1.2.2.js` and `jquery-1.7.2.min.js` to use `masked inputs`. Code for masking is ``` $(document).ready( function () { $("#txtPhoneNo").mask("?(999) 999-9999"); }); ``` but it is not validating length of input so I wrote `javascript` for that and used 'CustomValidator'as follows. ``` function isPhoneNumberValid(sender, args) {alert("l"); if (args.value.length < 2) args.isValid = false; } ``` `alert("l");` itself will tell you that I just want to see whether this `js function` fires or not. code for `textbox` and `CustomValidator` is as follow. ``` <asp:TextBox ID="txtPhoneNo" runat="server" CssClass="textbox3" size="60" Width="350px" TabIndex="4" ClientIDMode="Static"></asp:TextBox> &nbsp;<span style="font-size: 12px;">(000-000-0000)</span> <asp:CustomValidator ID="CustomValidator1" runat="server" ErrorMessage="Phone number is not valid" ClientValidationFunction="isPhoneNumberValid" Font-Size="9pt" ForeColor="Red" ControlToValidate="txtPhoneNo"></asp:CustomValidator> ``` NOTE Here in `textbox` `ClientIDMode="Static"` is used which may be problem. PROBLEM Problem is my `js function` is not firing at all. It must show alert if length of text is less than 2 but its not showing, instead making postback. Could anyone help me out. Thanks

Original source