Posted By admin
Tags:
Change Password Form (With Validation)
Demo

soooo cooooooooooool,nice jobI just add this line on compare password section, because when clear the first password the icon of the second password not refresh.,if ($(“#password1”).val() != “” || $(“#password2”).val() != “”) { if ($(“#password1”).val() == $(“#password2”).val()) { …. …. …. }},best regards,Converted this to a prototype.js version for anyone working on legacy stuff.,$$(“input[type=password]”).invoke(‘observe’,’keyup’, function(){ var ucase = new RegExp(“[A-Z]+”); var lcase = new RegExp(“[a-z]+”); var num = new RegExp(“[0-9]+”);, if($$(“#field-UserPassword”)[0].value.length >= 8){ $$(“#8char”).invoke(“removeClassName”, “glyphicon-remove”); $$(“#8char”).invoke(“addClassName”, “glyphicon-ok”); $$(“#8char”).invoke(“setStyle”, {color: “#00A41E”}); }else{ $$(“#8char”).invoke(“removeClassName”, “glyphicon-ok”); $$(“#8char”).invoke(“addClassName”, “glyphicon-remove”); $$(“#8char”).invoke(“setStyle”, {color: “#FF0004”}); }, if(ucase.test($$(“#field-UserPassword”)[0].value)){ $$(“#ucase”).invoke(“removeClassName”, “glyphicon-remove”); $$(“#ucase”).invoke(“addClassName”, “glyphicon-ok”); $$(“#ucase”).invoke(“setStyle”, {color: “#00A41E”}); }else{ $$(“#ucase”).invoke(“removeClassName”, “glyphicon-ok”); $$(“#ucase”).invoke(“addClassName”, “glyphicon-remove”); $$(“#ucase”).invoke(“setStyle”, {color: “#FF0004”}); }, if(lcase.test($$(“#field-UserPassword”)[0].value)){ $$(“#lcase”).invoke(“removeClassName”, “glyphicon-remove”); $$(“#lcase”).invoke(“addClassName”, “glyphicon-ok”); $$(“#lcase”).invoke(“setStyle”, {color: “#00A41E”}); }else{ $$(“#lcase”).invoke(“removeClassName”, “glyphicon-ok”); $$(“#lcase”).invoke(“addClassName”, “glyphicon-remove”); $$(“#lcase”).invoke(“setStyle”, {color: “#FF0004”}); }, if(num.test($$(“#field-UserPassword”)[0].value)){ $$(“#num”).invoke(“removeClassName”, “glyphicon-remove”); $$(“#num”).invoke(“addClassName”, “glyphicon-ok”); $$(“#num”).invoke(“setStyle”, {color: “#00A41E”}); }else{ $$(“#num”).invoke(“removeClassName”, “glyphicon-ok”); $$(“#num”).invoke(“addClassName”, “glyphicon-remove”); $$(“#num”).invoke(“setStyle”, {color: “#FF0004”}); }, if($$(“#field-UserPassword”)[0].value == $$(“#field-UserPasswordConf”)[0].value && $$(“#field-UserPassword”)[0].value !== “”){ $$(“#pwmatch”).invoke(“removeClassName”, “glyphicon-remove”); $$(“#pwmatch”).invoke(“addClassName”, “glyphicon-ok”); $$(“#pwmatch”).invoke(“setStyle”, {color: “#00A41E”}); }else{ $$(“#pwmatch”).invoke(“removeClassName”, “glyphicon-ok”); $$(“#pwmatch”).invoke(“addClassName”, “glyphicon-remove”); $$(“#pwmatch”).invoke(“setStyle”, {color: “#FF0004”}); }, if ($$(‘span.glyphicon-remove’).length != 0) { $$(‘input[type=submit]’).disable(); } else { $$(‘input[type=submit]’).enable(); }, });,I was having problems making it work. What worked for me was wrapping the entire .js like this:,$(document).ready(function(){, $(“input[type=password]”).keyup(function(){ … //THE REST OF THE .JS FILE … $(“#pwmatch”).css(“color”,”#FF0004″); };});,});,Hope it helps someone :).,This helped me,Is there any css?,The CSS is from default Bootstrap (you can get it at getbootstrap.com),Thanks alot great job,same problem. dont work.,try to put this line first and all the script inside$(function () {, $(“input[type=password]”).keyup(function () { var ucase = new RegExp(“[A-Z]+”); var lcase = new RegExp(“[a-z]+”); var num = new RegExp(“[0-9]+”);, … … … ….,});// end class,include jquery in your page before the javascript,is der any error in this code?i tired but its not working.,nice work :),The author is jasonsyko

1 Star2 Stars3 Stars4 Stars5 Stars (No Ratings Yet)
Loading...

Related Snippets

Leave a comment

Your email address will not be published. Required fields are marked *