Jquery脚本删除表单集合中的所有项目

我有一张桌子：

  <% for(int i=0; i  
 
 
ProductId
 
Productname
 
Quantity
 
UnitPrice
 
 
 
 
 
 m.NorthOrderDetails[i].Quantity) %>
 
 m.NorthOrderDetails[i].UnitPrice) %>
 
<button type="button" class="delete" data-id="">Delete
 
<input type="hidden" name="" value="" />
 
  
    

当我单击删除按钮时，我正在调用此脚本：

  var url = ''; $('.delete').click(function () { var id = $(this).data('id'); // Get the product ID var row = $(this).closest('tr');// Get the table row $.post(url, { ID: id }, function () { row.remove(); // remove the row from the table }); });  

并且脚本在Controller中调用此方法

 [HttpPost] public JsonResult Delete(int ID) { NorthOrder forOrderDetail = (NorthOrder)Session["Order"]; forOrderDetail.NorthOrderDetails.RemoveAll(z => z.ProductID == ID); Session["Order"] = forOrderDetail; return Json(null); } 

在UI中，当我单击提交按钮时，行会正确删除。 但是在控制器方法中，当我删除第一行时，集合的计数等于null，当我删除最后一行时，它等于1例如，当页面加载时，表包含两行

 public ActionResult View2(NorthOrder q, string button) { } 

为什么？

Answer 1

因为要删除某些行，但是在“ Save提交”操作中回发整个集合，所以索引器要么不是从零开始，要么不是连续的。 在删除第1行的情况下，发布值为

 NorthOrderDetails[1].Quantity=SomeValue&NorthOrderDetails[1].UnitPrice=SomeOtherValue 

NorthOrderDetails[0]...没有值NorthOrderDetails[0]...因此绑定失败并且集合为空。

默认情况下， DefaultModelBinder要求集合索引器从零开始并且是非连续的。 删除项目并从DOM中删除其控件时，无法正确绑定集合。 要完成这项工作，您需要添加一个额外的隐藏输入， DefaultModelBinder用它来匹配集合属性。 将视图代码更改为

 % for(int i=0; i < Model.NorthOrderDetails.Count; i++) {%>  <%: Html.DisplayFor(m => m.NorthOrderDetails[i].ProductID) %> // Remove the .ToString() <%: Html.DisplayFor(m => m.NorthOrderDetails[i].ProductName) %>   // add this <%: Html.TextBoxFor(m => m.NorthOrderDetails[i].Quantity) %>  <%: Html.TextBoxFor(m => m.NorthOrderDetails[i].UnitPrice) %> Delete   <% } %> 

注意：我早就忘记了aspx，但隐藏输入的剃刀代码是所以你可能想检查我的语法。

附注：

1. 你在这里使用会话似乎不合适。 在Delete方法中，您将删除该项目。 当您最终保存集合时，您需要从数据库中获取原始集合并进行比较以确定要在数据库中删除哪些项目。 相反，你Delete()方法应该调用数据库来删除项目（请参阅我之前的问题的答案）
2. 您的Add按钮不应该是提交并发布到View2()方法。