Link for all dot net and sql server video tutorial playlists
Link for slides, code samples and text version of the video
In this video we will discuss how to implement a simple password strength checker using JavaScript.
As we type the password in the password TextBox, the strength of the password should be displayed in a label control.
The password strength is determined based on the following scoring criteria.
If the password contain atleast 8 characters – 20 Points
If the password contain atleast 1 lowercase letter – 20 Points
If the password contain atleast 1 uppercase letter – 20 Points
If the password contain atleast 1 number – 20 Points
If the password contain atleast 1 special character – 20 Points
The password strength is determined using the following scale.
Password Score – Password Strength
]= 100 – Strong
]= 80 – Medium
]= 60 – Weak
[ 60 – Very Weak
Example :
[asp:TextBox ID=”TextBox1″ runat=”server” TextMode=”Password”
onkeyup=”checkPasswordStrength()”]
[/asp:TextBox]
[asp:Label ID=”lblMessage” runat=”server”][/asp:Label]
[script type=”text/javascript”]
function checkPasswordStrength()
{
var passwordTextBox = document.getElementById(“TextBox1”);
var password = passwordTextBox.value;
var specialCharacters = “!£$%^&*_@#~?”;
var passwordScore = 0;
passwordTextBox.style.color = “white”;
// Contains special characters
for (var i = 0; i [ password.length; i++)
{
if (specialCharacters.indexOf(password.charAt(i)) ] -1)
{
passwordScore += 20;
break;
}
}
// Contains numbers
if (/d/.test(password))
passwordScore += 20;
// Contains lower case letter
if (/[a-z]/.test(password))
passwordScore += 20;
// Contains upper case letter
if (/[A-Z]/.test(password))
passwordScore += 20;
if (password.length ]= 8)
passwordScore += 20;
var strength = “”;
var backgroundColor = “red”;
if (passwordScore ]= 100)
{
strength = “Strong”;
backgroundColor = “green”;
}
else if (passwordScore ]= 80)
{
strength = “Medium”;
backgroundColor = “gray”;
}
else if (passwordScore ]= 60)
{
strength = “Weak”;
backgroundColor = “maroon”;
}
else
{
strength = “Very Weak”;
backgroundColor = “red”;
}
document.getElementById(“lblMessage”).innerHTML = strength;
passwordTextBox.style.backgroundColor = backgroundColor;
}
[/script]
