0
我是jquery的新手。我试图将表单验证放入引导模式框中。表单验证在点击发送消息按钮时不起作用。不知道什么问题。我会给下面的小提琴链接。提前致谢。Jquery表单验证不与引导模式工作
$(function() {
jQuery("#newsletterform").validate({
rules: {
firstname: {
required: true
},
lastname: {
required: true
},
phone: {
required: true
},
email: {
required: true,
email: true
},
message: {
required: true,
}
},
messages: {
s_up_email_name: {
required: "username is required",
remote: "Username already Exists"
},
s_up_email_add: {
required: "Email is required",
email: "Invalid email address",
remote: "Email ID already Exists"
},
s_up_pwd: {
required: "password is required",
minlength: "Enter atleast 6 characters"
}
}
});
});
<div class="modal fade" id="myModal" role="dialog">
<div class="modal-dialog modal-lg">
<!-- Modal content-->
<div class="modal-content">
<button type="button" class="close" data-dismiss="modal">×</button>
<div class="modal-header">
<h4 class="modal-title">contact us</h4>
</div>
<div class="modal-body">
<form name="registration" action="" id="newsletterform" method="post">
<div>
<div class="col-lg-6 col-md-6 col-sm-12 col-xs-12 frst_name">
<input type="text" class="box_txt" name="firstname" id="firstname" placeholder="FIRST NAME">
</div>
<div class="col-lg-6 col-md-6 col-sm-12 col-xs-12 last_name">
<input type="text" class="box_txt" name="lastname" id="lastname" placeholder="LAST NAME">
</div>
</div>
<div>
<div class="col-lg-6 col-md-6 col-sm-12 col-xs-12 email">
<input type="text" class="box_txt" name="email" id="email" placeholder="EMAIL">
</div>
<div class="col-lg-6 col-md-6 col-sm-12 col-xs-12 phone">
<input type="text" class="box_txt" id="phone" name="phone" placeholder="PHONE" onkeypress="return isNumber(event)">
</div>
</div>
<div>
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 message">
<!--<input type="text" class="box_txt" value="MESSAGE">-->
<textarea name="message" id="message" class="box_txt textarea" rows="8" cols="70">MESSAGE</textarea>
</div>
</div>
</form>
</div>
<div class="modal-footer">
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<!--<button type="submit">Register</button>-->
<input type="submit" class="btn btn_message" value="send message">
</div>
</div>
</div>
</div>
</div>
这里的fiddle
你拨弄需要加载验证插件,也jQuery的。更新:https://jsfiddle.net/okdcv0s6/1/ –
而这些消息不对应您的表单,但默认消息正在显示。例如尝试使用无效的电子邮件。 –
我已经加载了这个插件。但仍然有同样的结果 –