这是我的观点:
@using (Html.BeginForm("SaveNewCustomer", "Dealer", FormMethod.Post, new { id = "myForm" }))
{
<div class="form-horizontal">
<div class="row">
<div class="form-group-1">
@Html.LabelFor(model => model.device.MotorType, htmlAttributes: new { @class = "control-label col-lg-4" })
@Html.EditorFor(model => model.device.MotorType, new { htmlAttributes = new { @class = "form-control required", placeholder = "Motor Type", required = "required" } })
</div>
<div class="form-group-1">
@Html.LabelFor(model => model.device.PowerRating, htmlAttributes: new { @class = "control-label col-lg-4" })
@Html.EditorFor(model => model.device.PowerRating, new { htmlAttributes = new { @class = "form-control required", placeholder = "Power Rating", required = "required" } })
</div>
<div class="form-group-1">
@Html.LabelFor(model => model.device.InstallationDate, htmlAttributes: new { @class = "control-label col-lg-4" })
@Html.EditorFor(model => model.device.InstallationDate, new { htmlAttributes = new { @class = "form-control datepicker required", placeholder = "Installation Date(MM/dd/yyyy)", required = "required" } })
</div>
<div class="form-group-1">
@Html.LabelFor(model => model.device.ActivationDate, htmlAttributes: new { @class = "control-label col-lg-4" })
@Html.EditorFor(model => model.device.ActivationDate, new { htmlAttributes = new { @class = "form-control datepicker required", placeholder = "Activation Date(MM/dd/yyyy)", required = "required" } })
</div>
<div class="form-group-1">
@Html.LabelFor(model => model.device.DataReceiveInterval, htmlAttributes: new { @class = "control-label col-lg-4" })
@Html.EditorFor(model => model.device.DataReceiveInterval, new { htmlAttributes = new { @class = "form-control required", placeholder = "Data receive Interval", required = "required" } })
</div>
<div class="form-group-1">
@Html.LabelFor(model => model.device.HasAMC, htmlAttributes: new { @class = "control-label col-lg-4" })
@Html.EditorFor(model => model.device.HasAMC, new { htmlAttributes = new { @class = "form-control required", @onchange = "OnChange();" } })
</div>
<div class="form-group-1" id="HasDate">
@Html.LabelFor(model => model.device.AMCExpiredDate, htmlAttributes: new { @class = "control-label col-lg-4" })
@Html.EditorFor(model => model.device.AMCExpiredDate, new { htmlAttributes = new { @class = "form-control required", placeholder = "AMCExpireDate(MM/dd/yyyy)", required = "required", title = "Enter AMC Expire Date" } })
</div>
<button style="margin-left:33%;" id="action" class="btn btn-sm btn-primary col-lg-2 " type="button" name="action" value="SaveDeviceInfo"><strong>Save</strong></button>
</div>
</div>
}
我的 JavaScript 脚本是
<script type="text/javascript">
$(document).ready(function () {
jQuery.validator.setDefaults({
debug: true,
success: "valid"
});
$( "#myForm" ).validate({
rules: {
"client.ContactNo": {
required: true
}
}
});
$("#action").click(function () {
if (!$("#myForm").validate()) { // Not Valid
return false;
} else {
Save();
}
});
function Save() {
var frm = $("#myForm").serialize();
$.ajax({
url: "/Dealer/SaveNewCustomer",
data: frm,
type: "POST",
success: function (result) {
if (result == "true") {
//alert(result);
window.location.href = "/Dealer/Customers?Success=true&Message=Customer updated successfully.";
}
else
toastr.error(result);
}
});
}
</script>
问题是验证而不是触发。在 If else 条件下显示 false 并直接将值存储在数据库中。请你帮助我好吗？ 我的代码有什么问题吗？请给我建议。 提前致谢。
最佳答案
.validate()只是初始化方法。.valid()is the method used for testing the form 。if (!$("#myForm").valid()) { ....
这是一个有争议的问题，因为 your .ajax() function belongs inside the submitHandler option of the plugin反正。 submitHandler回调仅在表单有效时触发，因此您可以完全消除整个 if/then click处理函数(但是您必须将 button 元素更改为 type="submit" )。
$(document).ready(function () {
jQuery.validator.setDefaults({
debug: true,
success: "valid"
});
$( "#myForm" ).validate({
rules: {
"client.ContactNo": {
required: true
}
},
submitHandler: function(form) { // only fires when form is valid
var frm = $(form).serialize();
$.ajax({
url: "/Dealer/SaveNewCustomer",
data: frm,
type: "POST",
success: function (result) {
if (result == "true") {
//alert(result);
window.location.href = "/Dealer/Customers?Success=true&Message=Customer updated successfully.";
}
else
toastr.error(result);
}
});
return false;
}
});
});
注意:如果您碰巧使用unobtrusive-validation ASP 框架中包含的插件，然后是 .validate()方法是自动构造和调用的。如果是这种情况，那么您可以调用.validate()将被忽略，并且您只能将任何插件选项放在 jQuery.validator.setDefaults() 内.
关于javascript - 在 jquery 中验证 Bootstrap 弹出窗口，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/37289883/