2013-09-10 16 views
0

这里是我的产品和ProductItem类/型号:MVC 4验证属性是不工作的动态添加字段

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); 
     }); 
    }); 

现在应用于Name和Price的验证属性工作正常,但不是动态添加的字段(即“RawMaterial”和“Qty”)。

请给我建议,这个验证将如何运作?

注:出于测试目的,我刚才添加索引列表的第一个对象0

+0

可能的重复问题http://stackoverflow.com/questions/10023503/unobstructive-client-side-validation-for-dynamically-added-input-fields – asymptoticFault

+0

请建议任何其他解决方案,表单解析不是我的解决方案case –

+0

当你说他们不工作,你的意思是客户端或服务器端?你可以说得更详细点吗? – asymptoticFault

回答

0

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

  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。

相关问题