多个Ajax.BeginForm不工作c#mvc

Question

我正在使用 c# mvc 在 html 表中删除动态生成的行。我第一次删除成功。其次，我只能在重新加载页面时删除。那是一次加载时只发生一次删除我的问题是什么？

部分视图_CartListing

@model CartModel
<table width="100%">
    <tr bgcolor="#E4E4E4">
       <th style="padding-left:20px;">
        FoodIem
       </th>
       <th  style="padding-left:20px;">
         Quantity
        </th>
        <th style="padding-left:20px;">
        Price
        </th>
       <th></th>
     </tr>
    @{
        int i = 0;
        string k;
     }
     @foreach (CartListing ct in Model.CartListings)
     {
         i = i + 1;
   using (Ajax.BeginForm("DeleteCart", "Cart", new { cartid = ct.CartId }, new AjaxOptions()
    {
     HttpMethod = "Post",
     OnSuccess = "onSuccess",
     UpdateTargetId = "mydiv"
   }, new {id="Form"+i }))
{
<tr>
  <td style="padding-left:20px;">
     @ct.CartId
  </td>
  <td style="padding-left:20px;" >
    @ct.Amount
  </td>
  <td style="padding-left:20px;">
    @ct.Price
  </td>
  <td>
   <input type="submit" value="delete" id="delete_@i"/>
  </td>
  </tr> 
 }
}
  <tr bgcolor="#E4E4E4"><td></td><td></td><td></td><td></td></tr>
</table>

主视图 CartManager

<div class="mycontainer">   
  <div id="mydiv">
     @{Html.Action("CartManager","Cart");}   
  </div>   
</div> 

控制器

    public ActionResult CartList()
    {
        string user = "jaddu";
        FoodContext db = new FoodContext();
        List<CartListing> fd = (from e in db.FoodItems
                                  join o in db.Carts on e.itemid equals o.itemid 
                                  where o.username==user
                                  select new CartListing 
                                  {
                                   ItemId=e.itemid,
                                   CartId=o.cartid,
                                   Itemname =e.itemname,
                                   Amount =o.amount,
                                   Price=(float)(e.price*o.amount),
                               }).ToList();
          CartModel vm = new CartModel { CartListings = fd };
          return PartialView("_CartListing",vm);    
    }

    [HttpPost]
    public ActionResult DeleteCart(int cartid)
    {
        string user = "jaddu";
        FoodContext db = new FoodContext();
        Cart car = db.Carts.Single(f => f.cartid == cartid);
        db.Carts.DeleteObject(car);
        db.SaveChanges();
        List<CartListing> fd = (from e in db.FoodItems
                                join o in db.Carts on e.itemid equals o.itemid
                                where o.username == user
                                select new CartListing
                                {
                                    ItemId = e.itemid,
                                    CartId = o.cartid,
                                    Itemname = e.itemname,
                                    Amount = o.amount,
                                    Price = (float)(e.price * o.amount),
                                }).ToList();
        CartModel vm = new CartModel { CartListings = fd };
        return PartialView("_CartListing", vm);
    }

Answer 1

试试

using (Ajax.BeginForm("DeleteCart", "Cart", new { cartid = ct.CartId }, new AjaxOptions()
{
    HttpMethod = "Post",
    OnSuccess = "onSuccess",
    UpdateTargetId = "mydiv",
    InsertionMode = InsertionMode.Replace,
}, new {id="Form"+i }))

Answer 2

尝试将使用 Razor 创建按钮 id 的方式从 delete_@i 更改为 delete_@(i)，否则所有按钮将具有相同的 id，并且无法按预期工作。

即像这样换行

<input type="submit" value="delete" id="delete_@(i)"/>

Answer 3

我测试了您的 .cshtml 代码，如下所示，它可以正常工作。我认为您需要仔细检查控制器中的代码，您在 Get 和 Post 操作中创建数据库上下文的新实例（在您的情况下为 FoodContext）。尝试在请求上下文中使用单个实例。

型号

 public class Article
    {
        public int Id { get; set; }
        public string ArticleContent { get; set; }
    }

_PartialView.cshtml

@model IEnumerable<WebApplication6.Models.Article>
    <table width="100%">

        @foreach (var ct in Model)
        {
            i = i + 1;
            using (Ajax.BeginForm("DeleteArticle", "Home", new { Id = ct.Id }, new AjaxOptions()
         {
             HttpMethod = "Post",
             OnSuccess = "onSuccess",
             UpdateTargetId = "mydiv"
         }, new { id = "Form" + i }))
            {
                <tr>
                    <td style="padding-left:20px;">
                        @ct.ArticleContent
                </td>
                <td style="padding-left:20px;">
                    @ct.Id
                </td>
                <td>
                    <input type="submit" value="delete" id="delete_@i" />
                </td>
            </tr>
            }
        }
    </table>

Controller.cs

 MyDbContext _db = new MyDbContext();
public ActionResult ArticleList()
        {
            var vm = _db.Articles.ToList();
            return PartialView("_CartListing", vm);
        }

        [HttpPost]
        public ActionResult DeleteArticle(int Id)
        {
            var a = _db.Articles.Find(Id);
            _db.Articles.Remove(a);
            _db.SaveChanges();

            var vm = _db.Articles.ToList();
            return PartialView("_CartListing", vm);
        }