CODEWITHSUNDEEP
javascriptpassword-checker
Matthew
Matthew

Reputation: 51

Password Checker pure js. How to check against the rules in Password Checker

Hi I have a password checker but I don't know what code I should use for my program. I need my program to check against the rules but I don't know how to do that. I was hoping someone would know how to do that or at least help me in doing so. These are the specks of my program.

The user types in their desired password, and based on a series of checks, the system tells them if their password is a strong password or not. For a password to be considered strong, it must pass the following tests: A password must contain at least 1 capital letter A password must contain at least 1 lower-case letter A password must contain at least 1 number A password must contain at least 1 of the following chars: ! @ # $ % ^ & A password must be at least 8 chars long As the user types, they should be given feedback on the strength of their password. You will need to check each letter so see if the password matches these rules.

This is my HTML.

<div style="text-align: center;" style="font-weight:bold;"> 
<h1> Password Strength Checker</h1>
<br/>
The most secure passwords will have a very strong rating.
<br/>
The ratings scale range from: Weak (0), Good (25) , Medium (50), Strong (75) and Very Strong (100).
<br/>
<br/>
RULES:
<br/>
1. Your password must contain at least 1 number.
<br/>
2. Your password must be at least 8 characters long.
<br/>
3. Your password must contain at least 1 capital letter.
<br/>
4. Your password must contain at least 1 lowercase letter.
<br/>
5. Your password must contain at least 1 of the following characters:
<br/>! @ + # $ % ^ & * , ? _ ~ - ( )  
<br/>
Spaces are not allowed.
<br/>
<br/>
<input type="text" id="password" size="30" name="password" autocomplete="off" onkeydown="passwordStrength(this.value);"><span id="passwordStrength" class="strength0"><span id = "passwordDescription"><br/>
Please Enter Password <br/>

This is my JavaScript.

 function passwordStrength(password) {
 var rating = [
 0, "<font color='black'> Weak </font>",
 25, "<font color='red'> Good </font>",
 50, "<font color='yellow'> Medium </font>",
 75, "<font color='blue'> Strong </font>",
 100, "<font color='green'> Very Strong </font>"];

 var score = 0;
 var pass = "";

 if (password.length > 8) {
     score += 25;
 }      
 if ((password.match(/[a-z]/)) && (password.match(/[A-Z]/))) {
     score += 25
 }
 if (password.match(/.[,!,@,#,$,%,^,&,*,?,_,~,-,(,)]/)) {
     score += 25;
 }
 if (password.match(/[0-9]/)) {
     score += 25
 }
 if (password.match(/d+/)) {
     score += 10;}

 for (var i = rating.length - 1; i >= 0; i -= 1) {
     if (score >= rating[i]) {
         pass = rating[i +1];
         break;
     }
 }
 document.getElementById("passwordDescription").innerHTML = "<b>" + pass + score + "</font></b>"
 document.getElementById("passwordStrength").className = "strength" + score;
 }

This is my jsfiddle. http://jsfiddle.net/jYcBT/138/

Upvotes: 0

Views: 2312

Answers (1)

Yooz
Yooz

Reputation: 2518

Not sure what is your question?

However, I just fixed your special characters regular expression

password.match(/[\!\@\#\$\%\^\&\*\?\_\~\-\(\)]+/)

Remove the extra 10 points that you had, not sure why you added this?

change the event from onkeydown to onchange.

It works fine as far as i understand your flow.

http://jsfiddle.net/jYcBT/140/

Upvotes: 1

Related Questions