Skip to main content

Jquery valiadtion

This is a pretty good link about Jquery validation:

http://www.javascript-coder.com/form-validation/jquery-form-validation-guide.phtml#rules_dynamic

Add a rule dynamically:
$(selector).rules('add',{max:50});

Remove a rule:
 $(selector).rules('remove','max');

Create a new rule: (For example, password policy that uses regular expression for validation)
1. Inside $(document).ready(), add following line of code:
        $.validator.addMethod(
                "passwordpolicy",
                function (value, element, regexp) {
                    var re = new RegExp(regexp);
                    return this.optional(element) || re.test(value);
                },
                "Password must contain at least one letter and one digit"
        );
2. In the HTML markup where you need to use this validation rule, add data-rule attribute data-rule-passwordpolicy and provide the regular expression as the value. The passwordpolicy
is the first parameter in the $.validator.addMethod() method.
                            <input id="tbxPassword" name="tbxPassword" type="password" class="form-control" data-rule-required="true" data-rule-passwordpolicy="^(?=.*[a-zA-Z])(?=.*[0-9]).{8,20}$" data-rule-minlength="8" data-rule-maxlength="20" data-bind="value: Password" />

Note: before adding or removing rule, you may need to call $("form").validate() first. Otherwise, you may get a TypeError error message.

Also this link talks about using Jquery validation with HTML data attribute. It is pretty neat solution for validation:

http://johnnycode.com/2014/03/27/using-jquery-validate-plugin-html5-data-attribute-rules/

Valid rule list:
  • data-rule-required="true"
  • data-rule-email="true"
  • data-rule-url="true"
  • data-rule-date="true"
  • data-rule-dateISO="true"
  • data-rule-number="true"
  • data-rule-digits="true"
  • data-rule-creditcard="true"
  • data-rule-minlength="6"
  • data-rule-maxlength="24"
  • data-rule-rangelength="5,10"
  • data-rule-min="5"
  • data-rule-max="10"
  • data-rule-range="5,10"
  • data-rule-equalto="#password"
  • data-rule-remote="custom-validatation-endpoint.aspx"
  • data-rule-accept=""
  • data-rule-bankaccountNL="true"
  • data-rule-bankorgiroaccountNL="true"
  • data-rule-bic=""
  • data-rule-cifES=""
  • data-rule-creditcardtypes=""
  • data-rule-currency=""
  • data-rule-dateITA=""
  • data-rule-dateNL=""
  • data-rule-extension=""
  • data-rule-giroaccountNL=""
  • data-rule-iban=""
  • data-rule-integer="true"
  • data-rule-ipv4="true"
  • data-rule-ipv6="true"
  • data-rule-mobileNL=""
  • data-rule-mobileUK=""
  • data-rule-lettersonly="true"
  • data-rule-nieES=""
  • data-rule-nifES=""
  • data-rule-nowhitespace="true"
  • data-rule-pattern="" (does not work)
  • data-rule-phoneNL="true"
  • data-rule-phoneUK="true"
  • data-rule-phoneUS="true"
  • data-rule-phonesUK="true"
  • data-rule-postalcodeNL="true"
  • data-rule-postcodeUK="true"
  • data-rule-require_from_group=""
  • data-rule-skip_or_fill_minimum=""
  • data-rule-strippedminlength=""
  • data-rule-time=""
  • data-rule-time12h=""
  • data-rule-url2=""
  • data-rule-vinUS=""
  • data-rule-zipcodeUS="true"
  • data-rule-ziprange=""
data-rule-equalto will compare the value in one input to another. The value of this attribute is the HTML element selector. For example, you can use #password to specify to compare against the input with id equals to 'password'. However, when the id contains square bracket, e.g., choices[0].ChoiceValue, the data-rule-equalto will not work if you use:
 data-rule-equalto="#choices[0].ChoiceValue". 
You can use different selector to achive the goal:
 data-rule-equalto="input[id='choices[0].ChoiceValue']". 

Comments

Post a Comment

Popular posts from this blog

X509Certificate2: The system cannot find the file specified.

When I use the new X509Certificate2(fileName, password, X509KeyStorageFlags.DefaultKeySet) to create certificate from certificate file containing private key in my web application, I got following error message: System . Security . Cryptography . CryptographicException : The system cannot find the file specified . at System . Security . Cryptography . CryptographicException . ThrowCryptogaphicException ( Int32 hr ) at System . Security . Cryptography . X509Certificates . X509Utils . _LoadCertFromBlob ( Byte [] rawData , IntPtr password , UInt32 dwFlags , Boolean persistKeySet , SafeCertContextHandle & pCertCtx ) at System . Security . Cryptography . X509Certificates . X509Certificate . LoadCertificateFromBlob ( Byte [] rawData , Object password , X509KeyStorageFlags keyStorageFlags ) at System . Security . Cryptography . X509Certificates . X509Certificate2 .. ctor ( Byte [] rawData , String password , X509KeyStorageFlags keyStorageFlags ) In orde...
10 comments
Read more

Forms authentication ReturnUrl strange behavior and fix

When working with .NET forms authentication, I have found a strange behavior: For example, we have a web site using form based authentication. There are only two pages in the site: login.aspx and default.aspx. Default.aspx is the protected page. Without login to the site, if you type directly the URL to the default.aspx page with ReturnUrl as QueryString like this: http://localhost/YourWebApp/Default.aspx?ReturnUrl=Default.aspx Instead of redirect you to the login.aspx page, you will directly get http unauthorized error (401.2). However, if you remove the ReturnUrl query string or change it to something else, you will get expected behavior: redirect to login.aspx page. It seems .NET has some special treatment to ReturnUrl parameter. In order to fix this, we need to intercept the 401 response before it sends to client and redirect user to login.aspx page. In global.asax page, we need to add this event handler:         protected void Applica...
Post a Comment
Read more

Manage IIS 7 remotely using PowerShell and AppCmd

We can use  Windows PowerShell remoting features  to manage IIS 7 websites remotely.  Currently, remoting is supported on Windows Vista with Service Pack 1 or later, Windows 7, Windows Server 2008, and Windows Server 2008 Release 2.  Start Windows PowerShell as an administrator by right-clicking the Windows PowerShell shortcut and selecting Run As Administrator .  Enable PowerShell Remoting with Enable-PSRemoting -Force Starting a Remote Session using:  Enter-PSSession -ComputerName <COMPUTER> -Credential <USER> Now the PowerShell connected to the remote server. Any commands issued with work against the remote server. We can use the Appcmd.exe command line tool to manage remote server just as what we do locally. For example, to add an application pool: c:\windows\system32\inetsrv\appcmd add apppool /name:"Contoso" /managedPipelineMode:Integrated /managedRuntimeVersion:"v4.0" /enable32BitAppOnWin64:true To change application p...
Post a Comment
Read more