【发布时间】：2016-10-18 16:19:32
【问题描述】：
我想在提交到 AJAX 之前对表单执行 jQuery 验证。这里需要注意的一点是，我的应用程序位于 ASP.NET Web 窗体 中并实现了母版页，并且我的母版页中已经有一个带有 runat="server" 的表单。
在我的内容页面中，表单是这样的
<form class="form-horizontal form-bordered" id="PageForm">
<div class="form-group">
<label for="DesignationName" class="col-lg-4 col-sm-2 control-label">Designation Name</label>
<div class="col-lg-8">
<input id="DesignationName" ng-model="newDesignation.DesignationName" type = "text" class="form-control" placeholder="" >
</div>
</div>
<div class="form-group">
<label class="col-lg-4 col-sm-2 control-label">Designation Short Name</label>
<div class="col-lg-8">
<input id="DesignationShortName" ng-model="newDesignation.DesignationShortName" type = "text" class="form-control" placeholder="" >
</div>
</div>
<div class="form-group">
<label class="col-lg-4 col-sm-2 control-label">Designation Order</label>
<div class="col-lg-8">
<input id="DesignationOrder" ng-model="newDesignation.DesignationOrder" type = "text" class="form-control" placeholder="" >
</div>
</div>
<div class="form-group">
<label class="col-sm-4 control-label">Administrative Department</label>
<div class="col-sm-8">
<select class="form-control" id="DivisionId" data-ng-options="d.DivisionId as d.DivisionName for d in divisions" data-ng-model="newDesignation.DivisionId">
<option value="">Please select</option>
</select>
<span class="mandatoryFieldMarker">*</span>
</div>
</div>
<div class="btn-list" style="text-align: right; margin-right: 1.5%">
<button id="SaveBtn" type="submit" value="Save" class="btn btn-primary" data-ng-clickkk="save()"><i class="fa fa-check"></i> Save</button>
<a class="btn btn-danger" data-ng-click="cancel()"><i class="fa fa-trash-o"></i> Cancel</a>
</div>
</form>
如您所见，我在这里使用了很多 AngularJS 指令，因为最终我想执行 AJAX 提交。
在我的 AngularJS 控制器中，我有这段代码
jQuery(document).ready(function() {
jQuery("#SaveBtn").click(function (e) {
e.preventDefault();
alert(456);
jQuery("#PageForm").validate({
rules: {
DesignationName: {
required: true,
minlength: 5,
maxlength: 200
},
DesignationShortName: {
minlength: 1,
maxlength: 50
},
DesignationOrder: {
required: true,
digits: true,
min: 1,
max: 1000000
},
DivisionId: {
required: true
}
},
messages: {
DesignationName: {
required: "Please specify designation name",
minlength: "Designation name must be between 5 and 200 characters",
maxlength: "Designation name must be between 5 and 200 characters"
},
DesignationShortName: {
minlength: "Designation short name must be between 1 and 50 characters",
maxlength: "Designation short name must be between 1 and 50 characters"
},
DesignationOrder: {
required: "Please specify designation order",
digits: true,
min: "Designation order must be betwen 1 and 1000000",
max: "Designation order must be betwen 1 and 1000000"
},
DivisionId: {
required: "Please select administrative division"
}
},
submitHandler: function (form) {
/////////////
}
});
});
});
问题是，当我提交表单时，我收到警报 456，但没有触发 jQuery 验证，也没有保存数据（即提交处理程序也没有触发）
这是我第一次使用 jQuery 验证，所以我真的很困惑该怎么做。
【问题讨论】：
-
jQuery 和 Angular 是两个完全不同的 JavaScript 框架。当 Angular 有自己的验证插件时，为什么要在 Angular 中使用 jQuery Validate 插件？您是否禁用了 ASP 的内置非侵入式验证？
标签： jquery asp.net angularjs jquery-validate