在MVC3局部视图不工作的jquery客户端验证(jquery client side valida

2019-07-17 19:06发布

我似乎无法获得客户端验证工作具有以下局部视图。 这种观点在里面父视图divTSettings股利。 试过很多来自计算器和其他网站的事情,似乎没有任何工作。 有任何想法吗?

<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>

Answer 1:

有任何想法吗?

是的,你应该做的第一件事就是要摆脱所有的<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.BeginForm和Ajax.ActionLink助手为你做的工作,你将需要订阅在AjaxOptions中的onSuccess回调,并把这个代码在那里。



Answer 2:

如果你想在全球范围内解决那么这应该帮助。 我在_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;
                            }
                        }
                    }
                });
            });


文章来源: jquery client side validation not working in MVC3 partial view