Welcome to WebmasterWorld Guest from 54.147.20.131

Forum Moderators: open

Message Too Old, No Replies

Access a value in a different script

     

dowzer

2:26 pm on Mar 10, 2011 (gmt 0)

5+ Year Member



I am using Javascript for basic form validation on a PHP form - I have a function called change_password() called from onsubmit which is in a file called validation.js which checks if the required fields are filled in before the form is submitted. This works great.

I have now added a password strength meter by "ajaxorised" to dynamically display password strength while typing and gives a value between 0 and 32. This is done in a file called password_strength.js and this piece works fine.

Howeverm, I would also like to check the strength of the password before the user tries to submit it as part of the validation and have no idea how to pass the variable from password_strength.js to validation.js so it can do a calculation on it.

How can I check to make sure the password strength is than x as well as the three required fields being filled in?

validation.js

//Change password
function change_password() {

var themessage = "You are required to complete the following fields: \n";

if (document.form.current.value=="") {
themessage = themessage + " \n Current password";
}
if (document.form.new1.value=="") {
themessage = themessage + " \n New password";
}
if (document.form.new2.value=="") {
themessage = themessage + " \n New password (confirm)";
}

//alert if fields are empty and cancel form submit
if (themessage == "You are required to complete the following fields: \n") {
document.form.submit();
}
else {
alert(themessage);
return false;
}
}




password_strength.js

var updateStrength = function(pw) {
var strength = getStrength(pw);
var width = (100/32)*strength;
new Effect.Morph('psStrength', {style:'width:'+width+'px', duration:'0.4'});
}

var getStrength = function(passwd) {
intScore = 0;
if (passwd.match(/[a-z]/)) // [verified] at least one lower case letter
{
intScore = (intScore+1)
} if (passwd.match(/[A-Z]/)) // [verified] at least one upper case letter
{
intScore = (intScore+5)
} // NUMBERS
if (passwd.match(/\d+/)) // [verified] at least one number
{
intScore = (intScore+5)
} if (passwd.match(/(\d.*\d.*\d)/)) // [verified] at least three numbers
{
intScore = (intScore+5)
} // SPECIAL CHAR
if (passwd.match(/[!,@#$%^&*?_~]/)) // [verified] at least one special character
{
intScore = (intScore+5)
} if (passwd.match(/([!,@#$%^&*?_~].*[!,@#$%^&*?_~])/)) // [verified] at least two special characters
{
intScore = (intScore+5)
} // COMBOS
if (passwd.match(/[a-z]/) && passwd.match(/[A-Z]/)) // [verified] both upper and lower case
{
intScore = (intScore+2)
} if (passwd.match(/\d/) && passwd.match(/\D/)) // [verified] both letters and numbers
{
intScore = (intScore+2)
} // [Verified] Upper Letters, Lower Letters, numbers and special characters
if (passwd.match(/[a-z]/) && passwd.match(/[A-Z]/) && passwd.match(/\d/) && passwd.match(/[!,@#$%^&*?_~]/))
{
intScore = (intScore+2)
}
intScore = (intScore+passwd.length) // Add the length of the password to the score
if (intScore > 32)
{
intScore = 32
}
return intScore;

}




Relevant parts of form

<p>
<label for="new1">New password: </label>
<input class="mf" name="new1" type="password" id="myinput" onKeyUp = "updateStrength(this.value)" value="" />
<span class="field_desc"></span><span class="validate_error">*</span>
</p>

<div id = "psContainer"><div id = "psStrength"></div></div>
<br><br>

</form>

<div id="button-left">
<a href="#" onClick="change_password();" alt="Confirm" title="Confirm" class="button"><span class="confirm">Confirm</a>
</div>

Fotiman

4:10 pm on Mar 10, 2011 (gmt 0)

WebmasterWorld Senior Member fotiman is a WebmasterWorld Top Contributor of All Time 5+ Year Member Top Contributors Of The Month



It looks like you could just call getStrength with the value of the password field from within your change_password method.

var strength = getStrength(document.form.new1.value);

That would give you the strength of the field.
 

Featured Threads

Hot Threads This Week

Hot Threads This Month