ASP.NET MVC Ajax.BeginForm 返回意外结果

Question

我正在渲染一个像这样的局部视图：

    <div id="cart">
    <%Html.RenderPartial("Cart", Model); %>
</div>

对于购物车中的每一行，我都使用一个表单来删除项目（重要的是，这在禁用 javascript 时有效，因此没有 Ajax.ActionLink）：

    <%using (Ajax.BeginForm("RemoveFromCart", "Cart", new AjaxOptions { UpdateTargetId="cart"}))
  {%>                           
        <%=Html.Hidden("ProductId", line.Product.Id)%>
        <%=Html.Hidden("returnUrl", ViewData["returnUrl"])%>
        <input type="image" src="<%=AppHelper.ImageUrl("delete.gif")%>" value="Remove item"  />
<%} %>

还有我的控制器操作：

        [HttpPost]
    public ActionResult RemoveFromCart(Cart cart, int productId, string returnUrl)
    {
        Product p = _catalogService.GetProduct(productId);
        cart.RemoveLine(p); // TODO - what about if null?

        if (Request.IsAjaxRequest())
            return PartialView("Cart", cart);
        else
            return RedirectToAction("Index",  new { returnUrl });
    }

据我了解，在启用 javascript 的情况下，单击删除按钮将对操作进行异步发布，并将“购物车”容器的内容替换为更新的局部视图。如果 js 被禁用，则进行完整的回发，并将用户再次重定向到索引页面。

如果我将一些商品添加到购物车并删除一个商品，它就可以正常工作。但是，如果我随后尝试删除另一个项目，则不会发生任何事情。原因是查看成功删除后的页面源，包含要删除的产品 id 的隐藏字段显示已删除项目的 id。

成功删除前：

<input id="ProductId" name="ProductId" type="hidden" value="6" />
<input id="ProductId" name="ProductId" type="hidden" value="22" />
<input id="ProductId" name="ProductId" type="hidden" value="47" />

删除第三个产品 (47) 后，其余项目显示值为 47 的隐藏字段。我的模型肯定已更新，因为我可以看到在单步执行控制器操作时该项目已被删除，但好像我的部分视图是没有正确绑定。

任何帮助将不胜感激。

谢谢 本

Answer 1

将您的产品 ID 放在表单扩展的路由值中，而不是隐藏字段。我认为这将完全避免这个问题。

<%using (Ajax.BeginForm("RemoveFromCart", "Cart", new { id = line.Product.Id }, new AjaxOptions { UpdateTargetId="cart"}))
  {%>                           
        <%=Html.Hidden("returnUrl", ViewData["returnUrl"])%>
        <input type="image" src="<%=AppHelper.ImageUrl("delete.gif")%>" value="Remove item"  />
<%} %>