19

我似乎无法使用以下部分视图进行客户端验证工作。此视图位于父视图的 divTSettings div 内。从 stackoverflow 和其他网站尝试了很多东西,似乎没有任何效果。有任何想法吗?

<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script>


@using (Ajax.BeginForm("CreateT", "TAdmin", null,
        new AjaxOptions { HttpMethod = "Post", UpdateTargetId = "divTSettings"},
                       new { id = "CreateTForm" }))
{
    <div>
        <label>Name:</label>
        <input type="text" name="tName" id="tName"/>
        @Html.ValidationMessage("tName")
        <input type="submit" value="Submit"/>
    </div>
}

<script type="text/javascript">
$(function() {
    $('#CreateTForm').validate({
        rules: {
            tName: {
                required: true
            }
        },
        messages: {
            tName: {
                required: 'Name required'
            }
        }
    });
    $("#CreateTForm").removeData("validator");
    $("#CreateTForm").removeData("unobtrusiveValidation");
    $.validator.unobtrusive.parse("#CreateTForm");
});
</script>
4

2 回答 2

91

有任何想法吗?

是的,您应该做的第一件事就是<script>从您的局部视图中删除所有这些标签。部分视图不应包含任何脚本。部分视图应该只包含标记。我已经重复了很多次,但仍然看到人们将脚本放在那里。脚本应该在您的布局或渲染部分的主视图中注册,可能通过覆盖在您的布局中注册的一些脚本部分,以便所有脚本都插入到 HTML 文档的末尾,就在结束</body>标记之前。那是他们所属的地方。

好的,现在来解决实际问题:不显眼的验证在动态添加到 DOM 的元素时无法开箱即用 - 例如向服务器发送 AJAX 请求,该请求返回一个局部视图,而这个局部视图是然后注入到 DOM 中。

为了使其工作,您需要使用不显眼的验证框架注册这些新添加的元素。为此,您需要$.validator.unobtrusive.parse在新添加的元素上调用:

$("form").removeData("validator");
$("form").removeData("unobtrusiveValidation");
$.validator.unobtrusive.parse("form");

您应该将此代码放入将部分注入 DOM 的 AJAX 成功处理程序中。注入新元素后,只需调用此函数即可。

如果您不是使用 jQuery($.ajax、$.post、...)手动编写 AJAX 请求,而是依靠一些 Ajax.BeginForm 和 Ajax.ActionLink 助手为您完成这项工作,您需要订阅AjaxOptions 中的 OnSuccess 回调并将此代码放在那里。

于 2013-01-03T07:58:19.670 回答
0

如果您想在全球范围内进行修复,那么这应该会有所帮助。我在 _layout.cstml 使用过。

  $(document).ajaxStart(function () {
                $.ajaxSetup({
                    converters: {
                        "text html": function (textValue) {
                            if (textValue) {
                                // Some parsing logic here
                                var script = "<script type='text/javascript' language='javascript' > $.validator.unobtrusive.parse(\"form\");";
                                var scriptend = "\<\/script>";
                                return script + scriptend + " " + textValue;
                            } else {
                                // This will notify a parsererror for current request
                                throw exceptionObject;
                            }
                        }
                    }
                });
            });
于 2018-03-09T13:40:52.933 回答