On registration form, all jquery validation rules working properly (working onkeyup) but only confirm password validation working only after onclick on submit button
confirm password should also work on onkeyup, but not happening like others fields
All jquery validation rules working properly (working onkeyup) but only confirm password validation working only after onclick on submit button
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.10.0/jquery.validate.min.js"></script>
<script>
$(document).ready(function () {
$('#signup').validate({
rules: {
"first_name": {
required: {
depends:function(){
$(this).val($.trim($(this).val()));
return true;
}
}
},
"last_name": {
required: {
depends:function(){
$(this).val($.trim($(this).val()));
return true;
}
}
},
"mobile_no": {
required: {
depends:function(){
$(this).val($.trim($(this).val()));
return true;
}
},
minlength: 10,
maxlength: 10,
digits: true
},
"email": {
required: {
depends:function(){
$(this).val($.trim($(this).val()));
return true;
}
},
email: true
},
"password": {
required: true,
minlength: 4,
maxlength: 4,
digits: true
},
"conf_password": {
required: true,
equalTo: "#mainpassword"
}
},
messages: {
"first_name": {
required: "First Name is required"
},
"last_name": {
required: "Last Name is required"
},
"mobile_no": {
required: "Mobile No is required",
minlength: "Mobile No should be a 10-digit number",
maxlength: "Mobile No should be a 10-digit number",
digits: "Mobile No should contain only numbers"
},
"email": {
required: "Email is required",
email: "Invalid email Id"
},
"password": {
required: "Password is required",
minlength: "Password should be a 4-digit number",
maxlength: "Password should be a 4-digit number",
digits: "Password should contain only numbers"
},
"conf_password": {
required: "Confirm Password is required",
equalTo: "Password mismatch"
}
}
});
});
</script>
Some part of HTML code:
....
....
<div class="form-group">
<label for="password" class="col-sm-4 control-label">Password :</label>
<div class="col-sm-8">
<input type="password" class="form-control" name="password" id="mainpassword" placeholder="Enter Password" value="<?=set_value('password')?>">
</div>
</div>
<div class="form-group">
<label for="conf_password" class="col-sm-4 control-label">Confirm Password :</label>
<div class="col-sm-8">
<input type="Password" class="form-control" name="conf_password" id="conf_password" placeholder="Confirm Password" value="<?=set_value('conf_password')?>">
</div>
</div>
....
....
Thanks,
