标签:gif closed 添加 input data- turn blank ide ref
非Core中的请参照:
MVC的验证 jquery.validate.unobtrusive
页面引入相关JS:
<script src="~/lib/jquery/dist/jquery.js"></script> <script src="~/lib/jquery-validation/dist/jquery.validate.js"></script> <script src="~/lib/jquery-validation-unobtrusive/jquery.validate.unobtrusive.js"></script> <script src="~/lib/jquery-ajax-unobtrusive/dist/jquery.unobtrusive-ajax.js"></script>
AddInfo.cshtml内容如下:
@model BasicFramework.Service.Implementation.Company_AddInfoRQ @{ Layout = "~/Views/Shared/_LayoutModal.cshtml"; } @section modalName{ @L["Add Info"] } <form asp-action="AddInfo" data-ajax="true" data-ajax-mode="replace" data-ajax-update="#Modal" data-ajax-success="reLoadModal" data-ajax-method="Post" class="form-horizontal"> <div class="toolbar"> @Html.Action("Index", "Toolbar") </div> <div asp-validation-summary="@ValidationSummary.All" style="color:red" id="validation_day" class="form-group"> <span style="color:blue">This is my message</span> </div> <div class="form-group"> <label asp-for="Code" class="control-label col-md-2"></label> <div class="col-md-10"> <input asp-for="Code" class="form-control required" /> <span asp-validation-for="Code" style="color:red"></span> </div> </div> <div class="form-group"> <label asp-for="Name" class="control-label col-md-2" style="color:blue"></label> <div class="col-md-10"> <input asp-for="Name" class="form-control" /> <span asp-validation-for="Name" style="color:red"></span> </div> </div> <div class="modal-footer"> <input type="submit" value="Create" class="btn btn-primary" /> </div> </form>
Index.cshtml调用页面代码:
function Add() { $.get({ url: "/Company/AddInfo", dataType: "html", error: function (jqXHR, textStatus, errorThrown) { alert(textStatus + ": Couldn‘t add form. " + errorThrown); }, success: function (r) { $("#Modal").html(r); //$("#Modal").find(".modal-dialog").addClass("modal-full"); var form = $("#Modal form"); //form.removeData("validator"); /* added by the raw jquery.validate plugin */ //form.removeData("unobtrusiveValidation"); /* added by the jquery unobtrusive plugin*/; $.validator.unobtrusive.parse(form); $("#Modal").modal(); } }); }
$.validator.unobtrusive.parse()
方法采用 jQuery 选择器作为它的一个参数。 此方法指示 jQuery 非介入式验证分析该选择器内表单的 data-
属性。 这些属性的值随后传递到 jQuery Validate 插件中,以便表单展示所需的客户端验证规则。
也可以在动态生成各个控件(比如 <input/>
和 <select/>
)时,更新表单上的验证规则。 不能将用于这些元素的选择器直接传递到 parse()
方法,因为周围表单已进行分析并且不会更新。 应当先删除现有的验证数据,然后重新分析整个表单,如下所示:
$.get({ url: "https://url/that/returns/a/control", dataType: "html", error: function(jqXHR, textStatus, errorThrown) { alert(textStatus + ": Couldn‘t add control. " + errorThrown); }, success: function(newInputHTML) { var form = document.getElementById("my-form"); form.insertAdjacentHTML("beforeend", newInputHTML); $(form).removeData("validator") // Added by jQuery Validate .removeData("unobtrusiveValidation"); // Added by jQuery Unobtrusive Validation $.validator.unobtrusive.parse(form); } })
标签:gif closed 添加 input data- turn blank ide ref
原文地址:https://www.cnblogs.com/ceci/p/9172616.html