Question

我正在加载一个主视图，该视图最初使用具有必填字段的模型呈现部分视图。正如您所期望的那样，客户端验证适用于该初始部分，但是当我使用AJAX动态渲染相同的部分视图时，客户端验证无法将动态添加的字段识别为唯一。

我对此并不感到惊讶，因为毕竟它们具有相同的名称，id和验证数据 - 破折号属性，但有没有办法让客户端验证消息分别识别每个字段，而无需手动检查和应用客户端脚本验证？

主要观点：

@{Html.EnableClientValidation(); }
@{using (Html.BeginForm()){
    @Html.Partial("_WorkItem")
    <div id="newItemHolder">

    </div>

    <div id="addItem">Add Item</div>
}}

<script type="text/javascript">
  $(document).ready(function () {
    $("#addItem").click(function () {
        $.ajax({
            type: "POST",
            data: {},
            url: "Controller/NewItem",
            success: function (data) {
                //inject partial views content to newItemHolder
                jQuery.validator.unobtrusive.parse($("#newItemHolder"));
            }
        });
    });
  });
</script>

Answer 1

如果您不刷新包含的表单，您可能还需要以下内容：

success: function (data) {
    var holder = $('#newItemHolder');
    // get the containing form
    var form = $(holder).closest('form');

    holder.html(data);
    form.removeData('validator');
    form.removeData('unobtrusiveValidation');
    jQuery.validator.unobtrusive.parse(form);
}

Answer 2

我找到了解决此问题的方法，如果其他人有同样的情况/问题，我将包含我提出的解决方案。如果有人通过数据注释完成了使用客户端验证验证每个部分的目标，我肯定会有兴趣听听你是如何做到的！

我所做的是将每个部分放入一个表单中，这样验证在每个表单的字段中都有唯一的名称，然后是一些触发器，最后使用表单提交我调用了以下内容。

$('form').each(function () {
    $(this).validate().form();
});

结果是，每个需要的字段都是自己验证的，当为一个必填字段提供值时，它不会导致客户端验证对于所有共享相同名称的控件成功。

MVC3中的动态加载内容部分视图，具有客户端验证和具有相同名称的控件

2 个答案: