我在另一个PartialView
的{{1}}中显示Bootbox
。然后PartialView
的数据将保存在数据库中。现在,在将其保存到数据库之前,我需要确保所有必填字段都具有正确的值(例如,非空)。
请查看以下代码。
要在Bootbox中显示的部分视图(对话框)
PartialView
}
使用PartialView显示Bootbox的脚本
@model WebSensoryMvc.Models.SampleData
@using (Html.BeginForm("Create", "SessionData", FormMethod.Post, new { id = "FormCreateSample", name = "FormCreateSample" }))
{
@Html.AntiForgeryToken()
<div class="container">
<div class="form-horizontal">
@Html.ValidationSummary(true, "", new { @class = "text-danger" })
<div class="row">
<div class="form-group">
@Html.LabelFor(model => model.GroupNo, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.GroupNo, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.GroupNo, "", new { @class = "text-danger" })
</div>
</div>
</div>
<div class="row">
<div class="form-group">
@Html.LabelFor(model => model.MaterialID, "Material", htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.DropDownList("MaterialID", null, htmlAttributes: new { @class = "form-control" })
@Html.ValidationMessageFor(model => model.MaterialID, "", new { @class = "text-danger" })
</div>
</div>
</div>
<div class="row">
<div class="form-group">
@Html.LabelFor(model => model.SampleCode, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.SampleCode, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.SampleCode, "", new { @class = "text-danger" })
</div>
</div>
</div>
<div class="row">
<div class="form-group">
@Html.LabelFor(model => model.BatchCode, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.BatchCode, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.BatchCode, "", new { @class = "text-danger" })
</div>
</div>
</div>
<div class="row">
<div class="form-group">
@Html.LabelFor(model => model.SizeID, "Size", htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.DropDownList("SizeID", null, htmlAttributes: new { @class = "form-control" })
@Html.ValidationMessageFor(model => model.SizeID, "", new { @class = "text-danger" })
</div>
</div>
</div>
<div class="row">
<div class="form-group">
@Html.LabelFor(model => model.AgeID, "Age", htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.DropDownList("AgeID", null, htmlAttributes: new { @class = "form-control" })
@Html.ValidationMessageFor(model => model.AgeID, "", new { @class = "text-danger" })
</div>
</div>
</div>
<div class="row">
<div class="form-group">
@Html.LabelFor(model => model.TemperatureID, "Temperature", htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.DropDownList("TemperatureID", null, htmlAttributes: new { @class = "form-control" })
@Html.ValidationMessageFor(model => model.TemperatureID, "", new { @class = "text-danger" })
</div>
</div>
</div>
<div class="row">
<div class="form-group">
@Html.LabelFor(model => model.PackagingTypeID, "Packaging Type", htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.DropDownList("PackagingTypeID", null, htmlAttributes: new { @class = "form-control" })
@Html.ValidationMessageFor(model => model.PackagingTypeID, "", new { @class = "text-danger" })
</div>
</div>
</div>
<div class="row">
<div class="form-group">
@Html.LabelFor(model => model.Spike, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
<div class="checkbox">
@Html.EditorFor(model => model.Spike)
@Html.ValidationMessageFor(model => model.Spike, "", new { @class = "text-danger" })
</div>
</div>
</div>
</div>
<div class="row">
<div class="form-group">
@Html.LabelFor(model => model.SampleType, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.SampleType, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.SampleType, "", new { @class = "text-danger" })
</div>
</div>
</div>
<div class="row">
<div class="form-group">
@Html.LabelFor(model => model.Remarks, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.Remarks, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.Remarks, "", new { @class = "text-danger" })
</div>
</div>
</div>
@*<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Create" class="btn btn-default" />
</div>
</div>*@
</div>
</div>
以下是目前我当前页面的示例片段。用户点击保存按钮后,应在显示弹出窗口中触发验证。
我现在的问题是如何在<script>
$(document).ready(function () {
$("#modalCreateSample").on('click', function () {
$.ajax({
url: "/SessionData/Create",
type: 'GET',
success: function (data) {
bootbox.dialog({
title: "Create Session",
message: data,
buttons: {
success: {
label: "Save",
className: "btn-success",
callback: function () {
$.ajax({
url: "/SessionData/Create",
data: $("#FormCreateSample").serialize(),
type: "POST",
success: function (data) {
alert('success');
return true;
},
error: function (error) {
alert('error');
return false;
}
});
}
}
}
});
},
error: function (error) {
alert("Error: Please try again.");
}
});
});
});
</script>
和PartialView
中实施验证?有什么建议吗? TIA
****************************更新#1 **************** ************
我最终使用Bootbox
而不是Bootstrap Modal
。我现在可以使用@Stephen Muecke提供的代码验证我的表单。
我正在跟进此事。调用Bootbox
方法时,POST
方法返回空?使用我的旧代码返回正确的serialize()
数据。