As I try and say before all of my questions - I'm new to this whole thing. With that being said. I'm working on some client side validation of passwords. I'm trying to make a script that will fill a span with an image if the passwords either don't match, or if either field is blank on blur. I have been unable to get it to show that passwords match, even when I know they do. Here is the relevant code:
html:
<div class="loginRow">
<div class="loginCell"><label for="r_password">Password:</label></div>
<div class="loginCell"><input type="password" name="r_password" id="r_password"></div>
<div class="loginCell"><span id="r_passwordFeedback"></span></div>
</div>
<div class="loginRow">
<div class="loginCell"><label for"r_vpassword">Verify Password</label></div>
<div class="loginCell"><input type="password" name="r_vpassword" id="r_vpassword"></div>
<div class="loginCell"><span id="r_vpasswordFeedback"></span></div>
</div>
jQuery:
$("#r_password").blur(function() {
if ($("#r_password").val() != $("#r_vpassword").val()) { $("#r_passwordFeedback").html(deleteImg + "Passwords do not match"); }
else if ($("#r_password").val() || $("#r_vpassword").val() === "") { $("#r_passwordFeedback").html(deleteImg + " Required"); }
else { $("#r_passwordFeedback").html(acceptImg); }
});
$("#r_vpassword").blur(function() {
if($("#r_password").val() != ("#r_vpassword").val()) { $("#r_passwordFeedback").html(deleteImg); }
else if($("#r_password").val() || $("#r_vpassword").val() === "") { $("#r_passwordFeedback").html(deleteImg); }
else { $("#r_passwordFeedback").html(acceptImg); }
});
Any help you might be able to shine on my little issue would be much appreciated. Thanks in advance.