不引人注目 JQuery 验证在弹出式 PartialViews 中不起作用

Question

我在 asp.net 5 mvc 6 项目 中有以下部分视图。部分视图显示为 jquery ui 对话框，并在用户单击父视图中的按钮时动态加载 page.The 问题是 Unobtrusive JQuery Validation 不在我输入无效的整体并单击提交后工作。

我已经完成了使 Unobtrusive JQuery 验证工作所需的所有程序，并且它在非局部视图中工作。

这是我的代码

我的局部视图名称EquipmentEditTemplate.cshtml

    @model MyProject.Models.EquipmentViewModel

@*<form role="form" name="FormPost" asp-controller="Asset" method="post" asp-action="SaveEq" data-ajax="true" id="FrmGrid_grdLocation1" class="FormGrid form-horizontal" style="width:477px;height:703px;">*@
    @*<form asp-controller="Asset" asp-action="SaveEq" method="post" style="width:600px;height:703px;" class="form-horizontal" >*@
    <div class="FormError bg-danger" style="display:none;"></div><div class="tinfo topinfo"></div><div class="modal-body">
        <div style="margin-left:15px;">

            <div class="form-group">
                <label asp-for="EquipmentID" class="col-sm-2 control-label">Equipment ID:</label>
                <div class="col-sm-10">
                    <input asp-for="EquipmentID" class="FormElement form-control" />
                    <span asp-validation-for="EquipmentID" class="text-danger"></span>
                </div>

            </div>

        <div class="form-group">
            <label asp-for="Email" class="col-sm-2 control-label">Email:</label>
            <div class="col-sm-10">
                <input asp-for="Email" class="FormElement form-control" />
            </div>
        </div>

        <div class="form-group">
            <label asp-for="Department" class="col-sm-2 control-label">Department:</label>

            <div class="col-sm-10">
                <input type="text" id="Department" name="Department" value="@Model.Department" role="textbox" class="FormElement form-control">
            </div>
        </div>

        <div class="form-group">
            <div class="col-sm-offset-2 col-sm-10">
                <button type="submit" class="btn btn-default">Sign in</button>
            </div>
        </div>

    </div>
</form>

我在主视图中有下面的代码，如图所示我在其中包含了验证脚本 equipment.cshtml

 @{
    ViewData["Title"] = "Equipment";
}
<h2>@ViewData["Title"].</h2>
<h3>@ViewData["Message"]</h3>

@section scripts{
 @{await Html.RenderPartialAsync("_ValidationScriptsPartial"); }
    <script src="~/js/equipment.js" type="text/javascript"></script>

}

我的模型class定义如下

public class EquipmentViewModel
    { 
        [Required]
        public int EquipmentID { get; set; }

        [EmailAddress]
        public string Email{ get; set; }

        public int Description{ get; set; }
    }
}

Answer 1

将表单动态加载到 DOM 后，在部分视图的末尾添加以下行。

$(document).ready(function() {

     $.validator.unobtrusive.parse($('#yourform'));
});

不引人注目 JQuery 验证在弹出式 PartialViews 中不起作用

Unobtrusive JQuery Validation not working in popup PartialViews

asp.net-mvc

unobtrusive-validation

asp.net-core-mvc