MVC 3,(razor)加载部分验证

时间:2011-07-25 07:12:37

标签: asp.net asp.net-mvc

您好我正在使用MVC 3(剃刀)为ajax向导做准备。我注意到的一个奇怪的现象是,当您将部分视图返回到UpdateTargetId时会插入视图,但不会添加/应用Unobtrusive JavaScript。如果我在ajax块之外加载局部视图,例如

@Html.Partial("Company")

它完美无缺,所以我没有错过任何标准库和 我的网络配置都很好。

所以此刻我有点难过。

我的观点如下:

@using(Ajax.BeginForm("Step", "Origination", new AjaxOptions { UpdateTargetId = "stepArea" })){

    <div id="stepArea"></div>
   <input id="btnSubmit" type="submit" value="submit" />
}

控制器:

public ActionResult Step(FormCollection formCollection)
{
    if (this.Request.IsAjaxRequest())
    {
        switch ((TempData["step"] as string))
        {
            case "Company":
                TempData["step"] = "Person";
                return PartialView("Company");

            case "Person":
                TempData["step"] = "Pay";
                return PartialView("Person");

            case "Settlement":
                return PartialView("Pay");

            default:
                TempData["step"] = "Company";
                return PartialView("UserType");
        }
    }
    return View();
}

我的问题是,部分视图的验证是否可以从部分刷新中实现/实现?

3 个答案:

答案 0 :(得分:10)

阅读了几个论坛并做了一些实验。 最后一块拼图,在返回局部视图后导致验证工作。 jquery.validate.unobtrusive not working with dynamic injected elements

<script type="text/javascript">

    function validateAjaxForm() {
        $("form").removeData("validator");
        $("form").removeData("unobtrusiveValidation");
        $.validator.unobtrusive.parse("form");
        return $('#form').valid();
    }
</script>


 @{ Html.EnableClientValidation(true); } 
@using (Ajax.BeginForm("Step", "Origination", new AjaxOptions { UpdateTargetId = "stepArea", OnBegin = "return validateAjaxForm();" }, new { id = "form" }))
{
    <div id="stepArea"></div>
    <input id="btnSubmit" type="submit" value="submit" />
}

完美无缺。

答案 1 :(得分:9)

如果在视图中为null,请尝试初始化FormContext。这应该为生成的控件添加不显眼的验证“data-val- *”属性

@{
    if (Html.ViewContext.FormContext == null)
    {
        Html.ViewContext.FormContext = new FormContext();
    }
}

答案 2 :(得分:0)

Nickz解决方案存在一个很大的问题,这让我拉出了我的头发,直到找到了不同的解决方法。

    // forces creation of a new validator, which in turn causes 
    // an extra submit event handler to be attached!!!
    $("form").removeData("validator");
    $("form").removeData("unobtrusiveValidation");
    $.validator.unobtrusive.parse("form"); 

当您这样做时,每次调用$.validator.unobtrusive.parse()时,新的事件处理程序将附加到表单的提交事件,同时保留旧的事件处理程序。这意味着当您多次运行上述代码时,在触发提交事件时,验证程序将不必要地多次运行。这给我带来了严重的性能问题。所以我最终编写了parse()方法的自定义替代方法,我将其命名为updateParse

    $.extend($.validator.unobtrusive, {
    updateParse: function (selector) {
        /// <summary>
        /// Custom alternative for the built in method $.validator.unobtrusive.parse() which can updates an existing validator.
        /// Use this only when a validator has not yet been initialized, i.e. when $.validator.unobtrusive.parse()
        /// has not yet been called before.
        /// This is intended for use after you dynamically add / remove / modify validatable elements to a form via AJAX.
        /// Parses all the HTML elements in the specified selector. It looks for input elements decorated
        /// with the [data-val=true] attribute value and enables validation according to the data-val-*
        /// attribute values.
        /// </summary>
        /// <param name="selector" type="String">Any valid jQuery selector.</param>
        var $forms = $(selector)
            .parents("form")
            .andSelf()
            .add($(selector).find("form"))
            .filter("form");

        $(selector).find(":input[data-val=true]").each(function () {
            $.validator.unobtrusive.parseElement(this, true);
        });

        $forms.each(function () {
            var form = $(this);
            var info = form.data("unobtrusiveValidation");
            if (info) {
                var validator = form.data("validator");
                if (validator) {
                    validator.settings.rules = info.options.rules;
                }
                else {
                    throw "validator not yet initialized for this form yet -- use $.validator.unobtrusive.parse() instead";
                }
            }
        });
    }

这将更新现有验证程序对象的验证规则,而不是在添加额外的提交事件处理程序时强制创建新的验证程序。 在我的选项中,parse()方法应该在验证器已经存在时才起作用。