I have a login modal which lets user (by href ) activate another modal adduser. The validation works fine for login modal but not for adduser modal.
Here's how I am calling the modals,
<a data-toggle="modal" href="" data-target="#login">Login</a>
<div class="modal fade" id="login" tabindex="-1" role="dialog" aria-labelledby="login" aria-hidden="true">
<div class="modal fade" id="adduser" tabindex="-1" role="dialog" aria-labelledby="adduer" aria-hidden="true">
function AddUser()
{
$('#login').modal('hide');
$('#adduser').modal('show');
}
function BackToLogin()
{
$('#adduser').modal('hide');
$('#login').modal('show');
}
Validation code for login
$(document).ready(function() {
$('#login-form').validate({
rules: {
email: {
required: true,
email: true
},
agree: "required"
},
highlight: function(element) {
$(element).closest('.control-group').removeClass('success').addClass('error');
},
success: function(element) {
element.text('OK!').addClass('valid').closest('.control-group').removeClass('error').addClass('success');
}
});
});
Validation code for adduser
$(document).ready(function() {
$('#adduser-form').validate({
rules: {
email: {
required: true,
email: true
},
agree: "required"
},
highlight: function(element) {
$(element).closest('.control-group').removeClass('success').addClass('error');
},
success: function(element) {
element.text('OK!').addClass('valid').closest('.control-group').removeClass('error').addClass('success');
}
});
});
You have a typo on your adduser line. You have: <div class="modal fade" id="adduser" tabindex="-1" role="dialog" aria-labelledby="adduer" aria-hidden="true">
Which should probably be: <div class="modal fade" id="adduser" tabindex="-1" role="dialog" aria-labelledby="adduser" aria-hidden="true">
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.