添加到购物车产品重复项

时间:2019-04-13 22:35:20

标签: jquery html asp.net asp.net-mvc asp.net-mvc-5

我正在尝试在购物车中添加产品。当我单击产品上的“添加到购物车”按钮时,它会在购物车中添加两次。我不知道是什么原因导致重复。在我的商店页面上,一切正常,但是在主页上,我列出了那些产品,导致购物车中出现重复

这是我的控制人

public ActionResult Products(bool isLatestProducts, int? CategoryID = 0)
        {
            ProductsWidgetViewModel model = new ProductsWidgetViewModel();
            model.IsLatestProducts = isLatestProducts;

            if (isLatestProducts)
            {
                model.Products = ProductsService.Instance.GetLatestProducts(4);
            }
            else if(CategoryID.HasValue && CategoryID.Value > 0)
            {
                model.Products = ProductsService.Instance.GetProductsByCategory(CategoryID.Value, 4);
            }
            else
            {
                model.Products = ProductsService.Instance.GetProducts(1, 8);
            }

            return PartialView(model);
        }

这是我的观点

@model ProductsWidgetViewModel
@{
    var defaultImageURL = "/Content/images/system/placeholder-image.png";
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/2.1.0/sweetalert.min.js"></script>

@if (Model != null && Model.Products != null)
{
    if (!Model.IsLatestProducts)
    {
        <ul class="flat-filter style-1 text-center max-width-682 clearfix">
            <li class="active"><a href="#" data-filter="*">All Product</a></li>
            @foreach (var category in Model.Products.Select(x => x.Category).ToList().Distinct())
            {
                <li><a href="#" data-filter=".@category.Name.ToLower()">For @category.Name</a></li>
            }
        </ul>
        <div class="divider h54"></div>
    }

    <div class="product-content product-fourcolumn clearfix">
        <ul class="product style2 isotope-product clearfix">
            @foreach (var product in Model.Products)
            {
                var imageURL = string.IsNullOrEmpty(product.ImageURL) ? defaultImageURL : product.ImageURL;

                <li class="product-item @product.Category.Name.ToLower()">
                    <div class="product-thumb clearfix">
                        <a href="@Url.Action("Details", "Product", new { ID = product.ID })" class="product-thumb">
                            <img src="@imageURL" alt="image" style="height: 250px;">
                        </a>
                        @if (Model.IsLatestProducts)
                        {
                            <span class="new">New</span>
                        }
                    </div>
                    <div class="product-info text-center clearfix">
                        <span class="product-title">
                            @product.Name
                        </span>
                        <div class="price">
                            <ins>
                                <span class="amount">Rs @product.Price</span>
                            </ins>
                        </div>
                    </div>
                    <div class="add-to-cart text-center">
                        <a class="productAddToCart" data-id="@product.ID">ADD TO CART</a>
                    </div>
                    <a href="#" class="like"><i class="fa fa-heart-o"></i></a>
                </li>
            }
        </ul>
    </div>
}

<script>

    var products;
    $(".productAddToCart").click(function () {
        var existingCookieData = $.cookie('CartProducts');

        if (existingCookieData != undefined && existingCookieData != "" && existingCookieData != null) {
            products = existingCookieData.split('-');
        }
        else {
            products = [];
        }

        var productID = $(this).attr('data-id');

        products.push(productID);

        $.cookie('CartProducts', products.join('-'), { path: '/' });

        updateCartProducts();

        swal("Good job!", "Product Added To Cart", {
            icon: "success",
        });
    });

</script>

这是我在首页上使用的语句

<section class="flat-row row-product-new">
    <div class="container">
        <div class="row">
            <div class="col-md-12">
                <div class="title-section margin-bottom-52">
                    <h2 class="title">
                        New Product
                    </h2>
                </div>

                @{Html.RenderAction("Products", "Widgets", new { isLatestProducts = true });}
            </div>
        </div><!-- /.row -->
    </div><!-- /.container -->
</section>

0 个答案:

没有答案