从购物车中移除产品无法在MVC音乐商店(AJAX)中工作

时间:2016-11-28 13:19:16

标签: javascript jquery ajax asp.net-mvc

我是asp.net MVC的新手。我在MVC音乐商店工作。我几乎完成了编码部分,但我在从购物车部分删除项目时卡住了。

我在View页面上使用的代码如下:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
    if (typeof jQuery == 'undefined') {
        document.write(unescape("%3Cscript src='/Scripts/jquery-1.7.1.min.js' type='text/javascript'%3E%3C/script%3E"));
    }
</script>
<script type="text/javascript">
    $(function () {
        // Document.ready -> link up remove event handler
        $(".RemoveLink").click(function () {
            // Get the id from the link
            var recordToDelete = $(this).attr("data-id");
            if (recordToDelete != '') {
                // Perform the ajax post
                $.post("/ShoppingCart/RemoveFromCart", {"id": recordToDelete },
                    function (data) {
                        // Successful requests get here
                        // Update the page elements
                        if (data.ItemCount == 0) {
                            $('#row-' + data.DeleteId).fadeOut('slow');
                        } else {
                            $('#item-count-' + data.DeleteId).text(data.ItemCount);
                        }
                        $('#cart-total').text(data.CartTotal);
                        $('#update-message').text(data.Message);
                        $('#cart-status').text('Cart (' + data.CartCount + ')');
                    });
            }
        });
    });

    function handleUpdate() {
        // Load and deserialize the returned JSON data
        var json = context.get_data();
        var data = Sys.Serialization.JavaScriptSerializer.deserialize(json);

        // Update the page elements
        if (data.ItemCount == 0) {
            $('#row-' + data.DeleteId).fadeOut('slow');
        } else {
            $('#item-count-' + data.DeleteId).text(data.ItemCount);
        }

        $('#cart-total').text(data.CartTotal);
        $('#update-message').text(data.Message);
        $('#cart-status').text('Cart (' + data.CartCount + ')');
    }
</script>

这是行动链接

<td>
            <a href="#" class="RemoveLink" data-id="<%:item.RecordId %>">Remove from cart</a>
        </td>

http://localhost:14652/ShoppingCart#当我点击删除购物车链接时,它会更改为此网址。

//
    // AJAX: /ShoppingCart/RemoveFromCart/5
    [HttpPost]
    public ActionResult RemoveFromCart(int id)
    {
        // Remove the item from the cart
        var cart = ShoppingCart.GetCart(this.HttpContext);

        // Get the name of the album to display confirmation
        string albumName = storeDB.Carts
            .Single(item => item.RecordId == id).Album.Title;

        // Remove from cart
        int itemCount = cart.RemoveFromCart(id);

        // Display the confirmation message
        var results = new ShoppingCartRemoveViewModel
        {
            Message = Server.HtmlEncode(albumName) +
                " has been removed from your shopping cart.",
            CartTotal = cart.GetTotal(),
            CartCount = cart.GetCount(),
            ItemCount = itemCount,
            DeleteId = id
        };
        return Json(results);
    }

请帮助我。

1 个答案:

答案 0 :(得分:0)

我遇到了同样的问题。我必须从

更改以下行
<script src="/Scripts/jquery-1.4.4.min.js" type="text/javascript"></script>

<script src="/Scripts/jquery-1.10.2.min.js" type="text/javascript"></script>

之后一切顺利。我简直不敢相信这一点。