我有一个非常奇怪的问题，当我单击“编辑”按钮打开模态partialview并从表中加载数据时，每行都有数据表和“编辑详细信息”按钮的主窗体，但是当我单击“保存”数据时，验证根本不起作用。当我单击“新建”按钮时，一切正常，我不知道出了什么问题。我加了
<script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>
在我的主视图中
@section scripts {
@Scripts.Render("~/bundles/jqueryval")
}
部分和结果相同
主视图
$(document).ready(function ()
{
dataTable = $('#userTable').DataTable({
"responsive": "true",
"ajax": {
"type" : "GET" ,
"url" : "@Url.Action("GetData","Customers")" ,
"datatype" : "json"
},
"columns":
[
{ "data": "FirstName"},
{
"data": "Id", "render": function (data) {
return '<a class="btn btn-danger" onclick="Details(\'' + data + '\')" style="margin-right: 12px"><span class="glyphicon glyphicon-th-list" style=" margin-right: 2px;"></span>Details</a><a data-toggle="modal" data-target="#myModal" class="btn btn-success" onclick="Edit(\'' + data + '\')" style="margin-right: 12px"><span class="glyphicon glyphicon-pencil" style=" margin-right: 2px;"></span>Edit</a>';
}
}
],
"language": {
"processing": "<img src='https://gph.is/2gESFHh' />",
"emptytable": "Няма данни за изжедане. Може да натиснете бутона <b> Нов </b>"
},
});
});
function Edit(Id) {
//if (confirm("Наистина ли искате да промените този запис?")) {
$.ajax({
type : 'Get' ,
url: '@Url.Action("AddOrEditPartial","Customers")/' + Id,
data: { Id: Id }
}).done(function(result) {
$('#modbody').html(result);
});
//}
}
</script>
}
<h2>Users</h2>
<div class="col-md-12" style="background-color: white; padding-top: 20px; padding-bottom: 20px; border-radius: 3px;">
<a data-toggle="modal" data-target="#myModal" class="btn btn-success" style="margin-bottom: 12px; margin-top:12px "><span class="glyphicon glyphicon-plus" aria-hidden="true"></span> Add New</a>
<table id="userTable" class="display" style="width: 100%;">
<thead>
<tr>
<th>
Name:
</th>
<th></th>
</tr>
</thead>
</table>
<div class="modal fade" id="myModal" role="dialog" style="margin-top: 100px;">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Users</h4>
</div>
<div class="modal-body" id="modbody">
@Html.Partial("AddOrEditPartial")
</div>
</div>
</div>
</div>
</div>
<table class="table" id="userTable">
</table>
PartialView
@model Sfuk1.Models.Customer
<div class="panel-group">
<div class="panel-default">
<div class="panel panel-success">
<div class="panel-body" id="panbody">
<div class="col-sm-10 col-sm-offset-1">
@using (Html.BeginForm("AddOrEditPartial", "Customers", FormMethod.Post, new { enctype = "multipart/for-data", id = "formsubmit" }))
{
@Html.AntiForgeryToken()
<div class="form-horizontal">
@Html.ValidationSummary(true, "", new { @class = "text-danger" })
<div class="form-group">
@Html.LabelFor(model => model.FirstName, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.FirstName, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.FirstName, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Save" class="btn btn-success" id="btnSubmit" onclick="Validation()" />
</div>
</div>
</div>
}
</div>
</div>
</div>
</div>
</div>
@section scripts {
@Scripts.Render("~/bundles/jqueryval")
}
<script>
var Validation = function () {
debugger
var data = $("formsubmit").serialize;
if (!$("formsubmit").valid()) {
console.log(false);
return false;
}
}
</script>
答案 0 :(得分：1)
@section scripts在局部视图中将无法在主视图中使用，因为页面已经呈现，因此您需要在主视图中使用@section脚本。
此外，您需要在主视图中引用非干扰性验证js文件，而不是在部分视图“ <script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>”中引用
考虑将所有JS代码放在主视图中。
多一点而不是使用HTML.BeginForm，请尝试使用Ajax.BeginForm
剃刀样本/ HTML代码（主视图）
@{
ViewBag.Title = "Create";
}
<button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">
Create Blog
</button>
<!-- Modal -->
@using (Ajax.BeginForm("SaveBlog", "Home", new AjaxOptions() { HttpMethod = "POST",UpdateTargetId = "frmEmp" }))
{
<div>
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
<h4 class="modal-title" id="myModalLabel">Create New Blog</h4>
</div>
<div class="modal-body" id="frmEmp">
@Html.Partial("_Blog")
</div>
<div class="modal-footer">
<input type="submit" class="btn btn-primary" value="Submit" />
</div>
</div>
</div>
</div>
</div>
}
部分视图；
@model BootstrapModalPopUp.Models.Blog
@Html.AntiForgeryToken()
@if (ViewBag.Message != null)
{
<span class="text-success">@ViewBag.Message</span>
}
<span class="alert-danger">
@Html.ValidationSummary()
</span>
<div class="form-group">
@Html.LabelFor(model => model.Name)
@Html.TextBoxFor(model => model.Name, new { @class = "form-control" })
</div>
<div class="form-group">
@Html.LabelFor(model => model.CategoryName)
@Html.TextBoxFor(model => model.CategoryName, new { @class = "form-control" })
</div>
主视图中必需的JS文件
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script src="~/Scripts/bootstrap.min.js"></script>
<script src="~/Scripts/jquery.validate.min.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>
<script src="~/Scripts/jquery.unobtrusive-ajax.min.js"></script>
来源：https://qawithexperts.com/article/asp.net/validate-pop-up-modal-using-ajaxbeginform-in-c-mvc/52 您也可以检查完整的工作样本或从上面的链接下载它。
答案 1 :(得分：0)
我安装了unobtrusive-ajax并将其添加到主脚本中