无法让我的 ajax "add to Cart Partial" 函数在 ASP.NET MVC 中工作

Question

我想调用一个 ajax 函数来将我制作的部分商品添加到我的购物车，但它似乎不起作用。我认为出于某种原因，产品 ID 未被 link 编辑。这是代码：

 <div class="addtocart">
            <a href="#" class="addtocart">Add to cart</a>

            <span class="ajaxmsg">The product has been added to your cart. </span>
  </div>
<script>
$(function () {


/*
* Add to cart
*/

$("a.addtocart").click(function (e) {
    e.preventDefault();

    $("span.loader").addClass("ib");

    var url = "/cart/AddToCartPartial";

    $.get(url, { id: @Model.Id }, function (data) {
        $(".ajaxcart").html(data);
    }).done(function () {
        $("span.loader").removeClass("ib");
        $("span.ajaxmsg").addClass("ib");
        setTimeout(function () {
            $("span.ajaxmsg").fadeOut("fast");
            $("span.ajaxmsg").removeClass("ib");
        }, 1000);
    });
});


  </script>

我找到了一个解决方案，但是当我使用这个 link 时它可以工作，但是它需要一个我不想要的 addtocartpartial。

@Html.ActionLink("Test", "AddtoCartPartial", "Cart", new { id = Model.Id }, new { @class = "addtocart" })

是否有另一种调用 ajax 脚本的方法或避免 link 将我带到 select 上的 addtocartpartial 页面的方法？

我的 addtocartpartial 控制器是：

   public ActionResult AddToCartPartial(int id)
    {
        // Init CartVM list
        List<CartVM> cart = Session["cart"] as List<CartVM> ?? new List<CartVM>();

        // Init CartVM
        CartVM model = new CartVM();

        using (Db db = new Db())
        {
            // Get the product
            ProductDTO product = db.Products.Find(id);

            // Check if the product is already in cart
            var productInCart = cart.FirstOrDefault(x => x.ProductId == id);

            // If not, add new
            if (productInCart == null)
            {
                cart.Add(new CartVM()
                {
                    ProductId = product.Id,
                    ProductName = product.Name,
                    Quantity = 1,
                    Price = product.Price,
                    Image = product.ImageName
                });
            }
            else
            {
                // If it is, increment
                productInCart.Quantity++;
            }
        }

        // Get total qty and price and add to model

        int qty = 0;
        decimal price = 0m;

        foreach (var item in cart)
        {
            qty += item.Quantity;
            price += item.Quantity * item.Price;
        }

        model.Quantity = qty;
        model.Price = price;

        // Save cart back to session
        Session["cart"] = cart;

        // Return partial view with model
        return PartialView(model);
    }

Answer 1

您可能为 id 参数设置了默认路由。在这种情况下，您可以以 controller/action/{id} 格式将值附加到 url，并从 $.get 中删除参数。以下代码可能对您有用：

var url = "/cart/AddToCartPartial/" + "@Model.Id";

$.get(url, function (data) {
    $(".ajaxcart").html(data);
}).done(function () {
    // ... other code
});

或者您可以尝试使用查询参数样式附加 id：

var url = "/cart/AddToCartPartial?id=" + "@Model.Id";

无法让我的 ajax "add to Cart Partial" 函数在 ASP.NET MVC 中工作

Can't GET my ajax "add to Cart Partial" function to work in ASP.NET MVC

asp.net

ajax

asp.net-mvc

asp.net-ajax