Password Strength Validation - Graphical
"); $('#password_meter').css('background-color','#C61515'); $('#password_meter').css('width','25%'); $('#password_error_msg').parent().show(); }else{ var regex_simple = /^[a-z]$/; var regex_capital = /^[A-Z]$/; var regex_numbers = /^[0-9]$/; var simple_status = '0'; var capital_status = '0'; var number_status = '0'; var status_count = '0'; for(i=0;iExcellent
"); $('#password_meter').css('background-color','#eee'); $('#password_meter').css('width','25%'); $('#password_error_msg').parent().show(); break; case 1: $('#password_error_msg').html("
Good
"); $('#password_meter').css('background-color','#F9B7B7'); $('#password_meter').css('width','55%'); $('#password_error_msg').parent().show(); break; case 2: $('#password_error_msg').html("
Strong
"); $('#password_meter').css('background-color','#A8E65E'); $('#password_meter').css('width','75%'); $('#password_error_msg').parent().show(); break; case 3: $('#password_error_msg').html("
Excellent
"); $('#password_meter').css('background-color','#4DBA36'); $('#password_meter').css('width','100%'); $('#password_error_msg').parent().show(); break; } } }); $('#targets').submit(function() { var error=0; $('#password_error_msg').html('').parent().hide(); var password = $('#password').val(); if(password == ''){ error = 1; $('#password_error_msg').html("Password cannot be empty"); $('#password_error_msg').parent().show(); }else if(password.length < 6 ){ error = 1; $('#password_error_msg').html("Your Password is Weak"); $('#password_error_msg').parent().show(); } if(error){ return false; }else{ return true; } }); });
Jquery Code
$(document).ready(function(){
$('#password').keyup(function() {
    //$('#password_error_msg').html('').parent().hide();
    var password = $('#password').val();

    if(password.length < 6){
        $('#password_error_msg').html("
Weak
");
        $('#password_meter').css('background-color','#C61515');
        $('#password_meter').css('width','25%');
        $('#password_error_msg').parent().show();
    }else{
        var regex_simple = /^[a-z]$/;
        var regex_capital = /^[A-Z]$/;
        var regex_numbers = /^[0-9]$/;

        var simple_status  = '0';
        var capital_status = '0';
        var number_status  = '0';
        var status_count   = '0';

        for(i=0;i
Excellent
");
        $('#password_meter').css('background-color','#eee');
        $('#password_meter').css('width','25%');
        $('#password_error_msg').parent().show();
                break;
            case 1:

                $('#password_error_msg').html("
Good
");
        $('#password_meter').css('background-color','#F9B7B7');
        $('#password_meter').css('width','55%');
        $('#password_error_msg').parent().show();
                break;

                    case 2:
           $('#password_error_msg').html("
Strong
");
        $('#password_meter').css('background-color','#A8E65E');
        $('#password_meter').css('width','75%');
        $('#password_error_msg').parent().show();
                break;

                    case 3:
               $('#password_error_msg').html("
Excellent
");
        $('#password_meter').css('background-color','#4DBA36');
        $('#password_meter').css('width','100%');
        $('#password_error_msg').parent().show();
                break;
               }



    }
});


$('#targets').submit(function() {
  var error=0;

    $('#password_error_msg').html('').parent().hide();

    var password = $('#password').val();
    if(password == ''){
        error = 1;
        $('#password_error_msg').html("Password cannot be empty");
        $('#password_error_msg').parent().show();
    }else if(password.length < 6 ){
        error = 1;
        $('#password_error_msg').html("Your Password is Weak");
        $('#password_error_msg').parent().show();
    }

    if(error){
        return false;
    }else{
        return true;
    }
});

});
HTML Code
  • Password
  •  
     
  •  

Follow Me On Twitter

Advertise Here

Follow Us On Facebook