0
AJAXに送信する前に、フォームでjQuery検証を実行したいとします。私のアプリケーションはのASP.NET Webフォームのマスタページが実装されており、すでにマスターページにrunat = "server"というフォームがあります。私のコンテンツページでASP.NETとAngularJSのjQuery検証
が、これは最終的に私はAJAXの提出を実行したいので、私はここにAngularJSディレクティブの多くを使用している、あなたが見ることができるようにフォームが
<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コントローラで
が、私はこのコードを持っている
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と角度は、2つの完全に異なるのJavaScriptフレームワークです。 Angularに独自の検証プラグインがある場合、なぜjQuery ValidateプラグインをAngularで使用するのですか？そして、あなたはASPの邪魔にならない検証機能を無効にしましたか？ – Sparky