MVC3带有部分视图的Ajax表单验证无法工作

Question

我有一个奇怪的问题，就是在通过Ajax.ActionLink呈现的局部视图中，非侵入式验证不起作用。

这是该局部视图：

@model MyWeb.Models.PersonSkill
@using (Ajax.BeginForm("EditSkill", null, new AjaxOptions { UpdateTargetId = "skills" }, new { id = "EditSkillForm" }))
{
@Html.HiddenFor(model => model.Id)
<div class="editor-label">
@Html.LabelFor(model => model.Name)
</div>
<div class="editor-field">
    @Html.EditorFor(model => model.Name)
    @Html.ValidationMessageFor(model => model.Name)
</div>

<div class="editor-label">
    @Html.LabelFor(model => model.YearsOfExperience)
</div>
<div class="editor-field">
    @Html.EditorFor(model => model.YearsOfExperience)
    @Html.ValidationMessageFor(model => model.YearsOfExperience)
</div>

<p>
    <input type="submit" value="Save"/>
</p>
}

这个被称为：

@Ajax.ActionLink("Edit", "LoadEditSkill", new { id = item.Id }, new AjaxOptions() { UpdateTargetId = "editSkillDialog" }, new { @class = "editSkill" })

视图渲染正常。它向服务器提交数据，但是它只是没有验证。

- ncabral

---

https://dev59.com/BWox5IYBdhLWcg3w3X9S - Joe

Answer 1

非常感谢Joe Tuskan指引我正确的方向。

我通过添加一个OnSuccess订阅者来解决了这个问题：

@Ajax.ActionLink("Edit", "LoadEditSkill", new { id = item.Id }, new AjaxOptions() { UpdateTargetId = "editSkillDialog", OnSuccess = "onSuccess" }, new { @class = "editSkill" })

按照这里的说明，添加调用parse()：

var onSuccess = function () {
    // enable unobtrusive validation for the contents
    // that was injected into the <div id="result"></div> node
    $.validator.unobtrusive.parse($("#editSkillDialog"));
};

- ncabral

Answer 2

请务必确保您已经包含了必要的引用：

jquery.validate.min.js 和 jquery.validate.unobtrusive.min.js，当然还有主要的jquery库。这通常是最常见的问题，我可以看到在您的cshtml中它们也没有出现在您的页面上。

- Freeman

---

所有的JQuery js文件都存在。由于它是一个部分视图，您无法在cshtml中看到它们。 - ncabral