asked on

JQuery Custom Validator in ASP.NET Form

I have a snippet of JQuery I need to get running in an ASPX page. It is a custom validator of a number entered into a textbox.

Ideally the script would make a button active and display text on the button. eg Number Valid (button is active) else Number Invalid (Button Inactive). I would like to do this without C# as I am trying to move away from server side dependency.

I would like to run this as a piece of script in the head/form but have no worries about it being a seperate script.js.

jQuery.validator.addMethod(
'abn',
function(value, element) {
if (!value.length && this.optional(element))
return true;

if (value.length != 11 || isNaN(parseInt(value)))
return false;

var weighting = [10, 1, 3, 5, 7, 9, 11, 13, 15, 17, 19];
var tally = (parseInt(value.charAt(0)) – 1) * weighting[0];
for (var i = 1; i < value.length; i++) {
tally += (parseInt(value.charAt(i)) * weighting[i]);
}

return (tally % 89) == 0;
}, 'This ABN is not valid'
);

Open in new window

dj_alik

Elegant way to combine ASP.NET validation with JQuery
http://stackoverflow.com/questions/459871/elegant-way-to-combine-asp-net-validation-with-jquery

XGIS

ASKER

The link is OK but Jquery either works or not and does not provide much indication (any) that it is working or not. A sample ASPX page would help more.

dj_alik

Using jQuery with the ASP.NET CustomValidator Control
http://www.dotnetcurry.com/ShowArticle.aspx?ID=299

XGIS

ASKER

I have implemented this sample in code as follows, but it says ABN is undefined. Pls provide feedback on the code to resolve this problem.

<head runat="server">
    <title></title>
    <script src="App_Scripts/jquery-1.6.1.js" type="text/javascript"></script>
    <script type="text/javascript">
        function ABNValidator(value, element) 
        {
            element.IsValid = false;
            $(".txtABN").each(function () 
            {
                if (!value.length && this.optional(element))
                return true;

                if (value.length != 11 || isNaN(parseInt(value)))
                return false;

                var weighting = [10, 1, 3, 5, 7, 9, 11, 13, 15, 17, 19];
                var tally = (parseInt(value.charAt(0)) – 1) * weighting[0];
                    for (var i = 1; i < value.length; i++) 
                    {
                        tally += (parseInt(value.charAt(i)) * weighting[i]);
                    }

                return (tally % 89) == 0; 
                {
                    element.IsValid = true;
                }
            });
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:Label ID="Label1" runat="server" Text="Australian Business Number : "></asp:Label>
        <asp:TextBox ID="TextBox1" TextMode="SingleLine" runat="server" CssClass='txtABN'
            MaxLength="11" />
        <br />
        <asp:CustomValidator ID="CustomValidator1" runat="server" Display="Dynamic" ErrorMessage="Field cannot be blank<br/>Minimum 11, Maximum 11 chars allowed<br/>"
            ClientValidationFunction="ABNValidator" OnServerValidate="CustomValidator1_ServerValidate">
        </asp:CustomValidator>
        <br />
        <asp:Button ID="Button1" runat="server" Text="Validate ABN" />
    </div>
    </form>
</body>
</html>

Open in new window

XGIS

ASKER

The error message is ABNValidator is undefined

ASKER CERTIFIED SOLUTION