Trigger onChange Event in IE for radio buttons and check boxes

onChage event in IE doesn’t get triggered until the onBlur event is fired up. This can be easily fixed with the next code:

if ($.browser.msie) {  
  $(function() {  
    $('input:radio, input:checkbox').click(function() {  
      this.blur();  
      this.focus();  
    });  
  });  
}

This code will fire up both events (blur and focus) to each radio button and check box.

This workaround was taken from here

Advertisements

Password Strength Meter

This is an example of a password strenght meter.. It’s very simple and easy to use…

JavaScript Code:

function passwordStrength(password)
{        
var desc = new Array(); 
desc[0] = "Very Weak";
desc[1] = "Weak";
desc[2] = "Better";
desc[3] = "Medium";
desc[4] = "Strong";
desc[5] = "Strongest";
var score   = 0;

 //if password bigger than 6 give 1 point
 if (password.length > 6) score++;
 //if password has both lower and uppercase characters give 1 point
 if ( ( password.match(/[a-z]/) ) && ( password.match(/[A-Z]/) ) ) score++;
 //if password has at least one number give 1 point
 if (password.match(/\d+/)) score++;
 //if password has at least one special caracther give 1 point
 if ( password.match(/.[!,@,#,$,%,^,&,*,?,_,~,-,(,)]/) ) score++;
 //if password bigger than 12 give another 1 point
 if (password.length > 12) score++;
 document.getElementById("passwordDescription").innerHTML = desc[score];
 document.getElementById("passwordStrength").className = "strength" + score;
}

CSS Code:

#passwordStrength
{
        height:10px;
        display:block;
        float:left;
}

.strength0
{
        width:250px;
        background:#cccccc;
}

.strength1
{
        width:50px;
        background:#ff0000;
}

.strength2
{
        width:100px;    
        background:#ff5f5f;
}

.strength3
{
        width:150px;
        background:#56e500;
}

.strength4
{
        background:#4dcd00;
        width:200px;
}

.strength5
{
        background:#399800;
        width:250px;
}

HTML Use:

<label for="pass">Password</label>
<input type="password" name="pass" id="pass" onkeyup="passwordStrength(this.value)" />
<p>
      <label for="passwordStrength">Password strength</label>
      <div id="passwordDescription">Password not entered</div>
      <div id="passwordStrength" class="strength0"></div>
</p>

In some cases, the onkeyup won’t work.. I use: onkeypress…
Later…

Original Source:

How to make a password strength meter for your register form