Password Policy/Strength JQuery plug-in Validator

Policy

Policy properties are those that the password MUST confirm to.

Strength

Strength properties are used for determining the password strength.

StrengthCategories property is where the strength categories can be specified as below. This is mandatory for Strength determination.

var StrengthCategories="weak,medium,strong";

Then, other relevant properties need to be specified for determining the strength. For eg.

var MinNoOfLowerCaseCharsStrength="3,5,7";

means that 4 or less lower case chars is weak, 6 - 5 is medium and 7 or more is strong.

The Strength and Policy can be used independent of each other. Properties need not be specified if not required.

Note : It is good if the strength value of the lowest category is the same as the Min policy property if both Policy and Strength are being used.

Multi lingual validation

The property UnicodeCharSetRanges is used to specify the Unicode character set ranges of the desired language. If the language is case-sensitive then it is a comma separated list of the upper-case character set range/s followed by the lower-case char set range/s. The Unicode ranges shown below will work for French, German character sets.

var UnicodeCharSetRanges= "A-Z\u00C0-\u00DE,a-z\u00DF-\u00F6\u00F8-\u00FF";

If the language is Uni-case then there is only one range. The Unicode range shown below is for Japanese Hiragana range.

var UnicodeCharSetRanges = "\u3040-\u309F";

More information on Unicode character set ranges can be found in below Unicode Chart:

http://www.ssec.wisc.edu/~tomw/java/unicode.html

The properties MinNoOfLowerCaseChars and MinNoOfUpperCaseChars are only valid for case-sensitive languages while for Uni-case languages there is a property called MinNoOfUniCaseChars.

Using these properties, passwords in languages supported in Unicode can be validated. The Unicode ranges for different cultures can be stored in respective Resource files.

If the UnicodeCharSetRanges property is not specified, the validator defaults to English.

JQuery Validation Rule

The validation happens using a custom Rule for JQuery validation plug-in as shown below. This rule calls a javascript function which does the validation. The rule is attached to the change/focus events of the password input textbox. It is also attached to the form submit. You can change this function if you want the rule to be fired at different times.

Note : It is required to hook into the JQuery validation plug-in so that the error messages etc show up in the validation message elements.

function OnInit() {
$.ajaxSetup({ cache: false });

if (IsPolicySet) {
policyExpression = GetPolicyExpression(UnicodeCharSetRanges, MinPasswordLength, MinNoOfUpperCaseChars, MinNoOfLowerCaseChars,
MinNoOfUniCaseChars, MinNoOfNumbers, MinNoOfSymbols, MaxNoOfAllowedRepetitions, DisallowedChars);
}
$("#" + PasswordControlID).after('<label id="LabelValidatorContainer' + PasswordControlID + '" name="StrengthMessage" />');

$(document).ready(function() {
jQuery.validator.addMethod("passwordPolicyValidate", function(value, element) {
return PasswordPolicyValidator(PasswordControlID, UserNameControlID);
}, ErrorMessage);
});

$("#" + PasswordControlID).ready(function() {
$("#" + PasswordControlID).change(function() {
$('form').validate({
rules: {
'ChangeToPasswordInputID' : { passwordPolicyValidate: true }
}
});
});
$("#" + PasswordControlID).focus(function() {
$('form').validate({
rules: {
'ChangeToPasswordInputID': { passwordPolicyValidate: true }
}
});
});
});

$(document).submit(function() {
$('form').validate({
rules: {
'ChangeToPasswordInputID': { passwordPolicyValidate: true }
}
});
});
}

This validation plugin is included by the below

<script src="/Scripts/jquery.validate.js" type="text/javascript"></script>

script tag in the page.

Code snippets

The GetPolicyExpression () API generates a Regular Expression based on the supplied properties.


function GetPolicyExpression(UnicodeCharSetRanges, MinPasswordLength, MinNoOfUpperCaseChars, MinNoOfLowerCaseChars,
MinNoOfUniCaseChars, MinNoOfNumbers, MinNoOfSymbols, MaxNoOfAllowedRepetitions, DisallowedChars) {

if (DisallowedChars.length > 0)
{
DisallowedChars = DisallowedChars.replace(/\\/g, '\\\\');
}

var Unicase = (UnicodeCharSetRanges == '' || UnicodeCharSetRanges == null ? 'A-Z' : UnicodeCharSetRanges.split(',')[0]);
var Lowercase = (UnicodeCharSetRanges == '' || UnicodeCharSetRanges == null ? 'a-z' : UnicodeCharSetRanges.split(',')[1] != null ? UnicodeCharSetRanges.split(',')[1] : "");

return '^'
+ (MaxNoOfAllowedRepetitions > -1 ? '(?=^((.)(?!(.*?\\2){' + (MaxNoOfAllowedRepetitions + 1) + ',}))+$)' : '')
+ (MinPasswordLength > -1 ? '(?=.{' + MinPasswordLength + ',})' : '')
+ (MinNoOfNumbers > -1 ? '(?=([^0-9]*?\d){' + MinNoOfNumbers + ',})' : '')
+ (MinNoOfUniCaseChars > -1 ? '(?=([^' + Unicase + ']*?[' + Unicase + ']){' + MinNoOfUniCaseChars + ',})' : '')
+ (MinNoOfLowerCaseChars > -1 ? '(?=([^' + Lowercase + ']*?[' + Lowercase + ']){' + MinNoOfLowerCaseChars + ',})' : '')
+ (MinNoOfUpperCaseChars > -1 ? '(?=([^' + Unicase + ']*?[' + Unicase + ']){' + MinNoOfUpperCaseChars + ',})' : '')
+ (MinNoOfSymbols > -1 ? '(?=([' + Unicase + Lowercase + '0-9]*?[^' + Unicase + Lowercase + ']){' + MinNoOfSymbols + ',})' : '')
+ (DisallowedChars.length > 0 ? '(?=[^' + DisallowedChars + ']+$)' : '')
+ '.*$';
}

This Expression does the validation of the password entered by the user.

Concepts of

• Character sets (Unicode too)

• Look ahead (positive/negative)

• Grouping

• Back references

• Lazy/Greedy match

are used in the Regular Expression.

The Validator has been tested for ASP .NET MVC 2 and IE 7 and Firefox 3.6.8. It is available as a free download.
Sample Usage

Copy the PasswordPolicyValidator.js to any location in the project.

In an ASP .NET MVC project's View page add script tags pointing to the PasswordPolicyValidator.js file:

<script src="/Scripts/jquery-1.4.1.js" type="text/javascript"></script>
<script src="/Scripts/jquery.validate.js" type="text/javascript"></script>
<script src="/Scripts/PasswordPolicyValidator.js" type="text/javascript"></script>
<%= Html.TextBoxFor(m => m.UserName) %>
<%= Html.TextBoxFor(m => m.Password)%>
<%= Html.ValidationMessageFor(m => m.Password) %>

For the above example, in the PasswordPolicyValidator.js, in the Configuration section and in the OnInit() function, the 'ChangeToPasswordInputID' is set to 'Password'. And the 'ChangeToUserNameInputID' is set to 'UserName'.

Sample Screenshots