0

这是我的 Product 和 ProductItem 类/模型：

    public class Product
        {
            public int ProductId { get; set; }
            [Required(ErrorMessage="Enter Name")]
            public string Name { get; set; }
            public List<ProductItem> productitems { get; set; }
            [Required(ErrorMessage="Enter Price")]
            public decimal Price { get; set; }
        }
    public class ProductItem
        {
            [Required(ErrorMessage="Select Raw Material")]
            public int RawMaterial { get; set; }
            [Required(ErrorMessage="Enter Quantity")]
            public decimal Qty { get; set; }
        }

对于 ProductItem，我使用 jQuery 动态添加其字段，如您在此处看到的：

$("#btnAddProductItem").click(function () {
        $.getJSON("/rawmaterial/GetRawMaterials", null, function (data) {
            var productItem = $("<tr class='productItem' id='productItem-0'><td><select id='rmlist-0' name='productitems[0].RawMaterial'></select><span class='field-validation-valid' data-valmsg-for='productitems[0].RawMaterial' data-valmsg-replace='true'></span></td><td><input type='text' id='rmqty-0' name='productitems[0].Qty'/><span class='field-validation-valid' data-valmsg-for='productitems[0].Qty' data-valmsg-replace='true'></span></td></tr>");
            $("#productItem").append(productItem);
            $("#rmlist-0").addItems(data);
        });
    });

现在，应用于名称和价格的验证属性工作正常，但不适用于动态添加的字段（即“RawMaterial”和“Qty”）。

请给我这个验证将如何工作的建议？

注意：出于测试目的，我刚刚添加了索引为 0 的 List 的第一个对象。

4

1 回答 1

1

有几种方法可以做到这一点 -

  1. 部分视图：由于您使用的是服务器端数据注释，正如我从类定义中看到的那样，因此使用 js 动态加载并不是一个好主意。因为您将错过 MVC 4 可以自动创建的所有验证。因此，我建议的最佳解决方案是将您动态添加到部分视图文件的代码，然后使用 ajax 调用获取 html，然后填充 HTML。

  2. JS 验证：但是，如果您必须使用 JS，那么您必须自己添加所有验证项。为此，您必须做一些额外的工作-

    • 首先，使用任何开发人员工具检查 HTML，您会注意到<span>在每个项目之后附加了一个属性，以显示具有提及目标的错误。您必须将类似的属性附加到您的元素

    • 使用 MVC 4 不显眼的验证，所有验证属性和规则都与目标元素一起添加data属性。每一个都基于他们所代表的验证。你让你创建类似的属性。

    • 最后，在 JS 中添加所有验证项后，重置表单，以便它解析添加的新验证并相应地工作。解析验证的代码在这里 -

      var form = $("form") //use more specific selector if you like
form.removeData("validator").removeData("unobtrusiveValidation");
$.validator.unobtrusive.parse(form);

但我更喜欢部分视图解决方案，因为它需要最少的返工，并且还可以让您选择将所有验证保存在一个地方。您不必担心将来要移植到 js 的新验证。

于 2014-06-03T18:43:49.810 回答