Jquery验证插件提交无效表单
Jquery validation pulgin submitting invalid form
我正在使用jquery验证插件来验证我的表单..我有一个问题,在我的表单得到提交,即使有在点击提交按钮无效的字段..不确定我在哪里做错了..需要帮助..
jsp文件: <%@include file="././Header.jsp"%>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<c:set var="baseUrl" value="${pageContext.request.contextPath}" />
<script src="<c:url value="/js/smlibray/emailCommunicate.js"/>"></script>
<link href="<c:url value="/js/jquery-ui.css"/>" rel="stylesheet" />
<script src="<c:url value="/js/jquery-ui.js"/>"></script>
<script type="text/javascript" src="/siteMinderAppWeb/assets/js/jquery.validate.min.js"/></script>
<input type="hidden" name="applicationUrl" id="applicationUrl"
value="${pageContext.request.contextPath}">
<div class="container sec-container middle-sec">
<div class="form-fields row">
<div class="col-md-12 col-sm-12 col-xs-12">
<form:form class="form-horizontal policy-form" id="emailCommu-form" name="emailCommu-form" method="POST" modelAttribute="emailForm">
<div class="form-group">
<h1 class="email-header">SiteMidner Email Notification</h1>
<c:choose>
<c:when test="${not empty sMsg}">
<div class="email-Commu-SMsg">* ${sMsg}</div>
</c:when>
<c:otherwise>
<c:if test="${not empty eMsg}">
<div class="email-Commu-EMsg">* ${eMsg}</div>
</c:if>
</c:otherwise>
</c:choose>
<div class="form-emailCommu">
<label for="emailSub-txtArea" class="email-ContentHead">Enter
the Subject Line for the Email : </label>
<div class="email-sm-textDiv">
<form:textarea path="emailSubject" name="emailSubTxtArea" id="emailSubTxtArea"
placeholder="Email Subject"/>
</div>
</div>
<div class="form-emailCommu">
<label for="emailBod-txtArea" class="email-ContentHead">Enter
the Message Body for the Email : </label>
<div class="email-sm-textDiv">
<form:textarea path="emailMsg" name="emailBodyTxtArea" id="emailBodyTxtArea"
placeholder="Email Body"/>
</div>
</div>
<div class="email-sendButton">
<input type="submit" class="styled-button" value="Send Email"></input>
</div>
</div>
</form:form>
</div>
<!--form-fields close -->
</div>
</div>
js文件,有验证方法:-
$.validator.setDefaults({
errorClass: 'help-block',
highlight: function(element) {
$(element)
.closest('.form-group')
.addClass('has-error');
},
unhighlight: function(element) {
$(element)
.closest('.form-group')
.removeClass('has-error');
},
errorPlacement : function(error, element) {
error.insertAfter(element);
}
});
$("#emailCommu-form").submit(function(e){
e.preventDefault();
}).validate({
rules:{
emailSubTxtArea:{
required:true
},
emailBodyTxtArea: {
required:true
}
},
messages:{
emailSubTxtArea:{
required: 'Email Subject cannot be empty.'
},
emailBodyTxtArea: {
required: 'Email body msg cannot be empty.',
}
},
submitHandler:function(form){
//var jsonObj = getData();
if(confirm("You are about to send Email Communication, Click Ok if you want to proceed..?")){
form.submit();
}
}
});
谢谢…
我修复了这个问题,通过为path-name和html-name属性设置相同的名称,对于spring form标签,path是必选的,而id和name不是必选的…似乎spring表单标签会自动生成与路径字段同名的id和名称..所以用相同的路径名称替换我的html-name解决了这个问题..
<form:textarea path="emailSubject" name="emailSubject" id="emailSubTxtArea"
placeholder="Email Subject"/>
相关文章:
- Angularjs:提交后清除表单无效
- 如果字段具有无效值,请禁用表单提交
- 如何正确清除AngularJS控制器输入无效的表单
- 即使表单无效,也会调用HTML5表单提交处理程序
- Jquery验证器在引导表单无效时提交
- AngularJS-表单验证,如何滚动到第一个无效输入
- 捕获事件或异常“无效表单控件”
- 我们是否可以访问 UA 应该为 HTML5 表单 API 维护的无效控件列表
- Symfony2 动态表单修改 ajax jquery 无效的 CSRF 令牌
- 关注表单验证后的第一个无效文本字段
- 如果表单无效,是否调用提交
- Javascript 表单验证 - PHP 变量作为 VALUE - 无效输入
- 如何在表单无效时禁用 Angular 中的外部按钮
- 验证 HTML 表单输入 - 如果选项卡无效,则阻止选项卡
- asp.net 如果表单无效,则 MVC 禁用提交按钮
- 表单无效时禁用提交按钮
- jQuery 验证表单,突出显示无效输入
- 为什么在ajax表单中出现名为javascript的无效表单控件错误
- 如何在提交无效表单后保留到页面(CodeIgniter 3)
- Jquery验证插件提交无效表单