Question

我已经编写了一个用于将产品添加到购物车的jquery，这是partiallistofproduct.cshtml文件。

<div class="container">
    <div class="row">
        <div class="col-sm-9 padding-right">
            <div class="features_items">
                <h2 class="admin-title text-center"></h2>
                <!--Partial list of Products-->
                @foreach (var item in Model)
                {
                    <div class="features_items">
                        <!--features_items-->
                        <div class="col-sm-4">
                            <div class="product-image-wrapper">
                                <div class="single-products">
                                    <div id="@item.ProductID" class="productinfo text-center">
                                        <a href="@Url.Action("ReadProductDetails", "Home",new {id=item.ProductID })">
                                            <img src="@Url.Content(item.ProductImage)" alt="" />
                                        </a>
                                        <h2>Rs @item.Price</h2>
                                        <p>@item.ProductName</p>
                                        @if (Session["UserName"] != null)
                                        {
                                            <p hidden id="userid">@Session["UserID"].ToString()</p>}
                                        <input type="hidden" id="hdnSession" data-value="@Request.RequestContext.HttpContext.Session["Name"]" />
                                        <input id="AddToCart" type="submit" value="Add to Cart" class="btn btn-default add-to-cart" />
                                    </div>
                                    <div class="product-overlay">
                                        <div id="@item.ProductID" class="overlay-content">
                                            <h2>Rs @item.Price</h2>
                                            <p id="productid">@item.ProductID</p>
                                            <a class="btn btn-default add-to-cart"><i class="fa fa-shopping-cart"></i>Add to cart</a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div><!--features_items-->

                }
                <!--Pagination part-->
                @Html.PagedListPager(Model, page => Url.Action("Index", new { page, pageSize = Model.PageSize }))
                showing @Model.FirstItemOnPage to  @Model.LastItemOnPage of @Model.TotalItemCount Products
            </div>
        </div>
    </div>
</div>

以下是将产品添加到购物车的脚本文件。我可以将产品添加到购物车。

<script>
    $(document).ready(function () {
        //on click on add to cart class this will perform
        $('.add-to-cart').click(function () {
            //checking user is logged in or not otherwise redirect to login page
            var sessionValue = $("#hdnSession").data('value');
            var aaa = parseInt($(this).closest('div').prop('id'));
            if (sessionValue != false) {
                $.ajax({
                    url: 'Account/AddToCart',
                    data: { //Passing data
                        UserID: $("#userid").html(), //Reading text box values using Jquery
                        ProductID: $(this).closest('div').prop('id'),
                        Quantity: 1
                    },
                    type: 'POST',
                    dataType: 'json',
                    //on success message will show as an alert
                    success: function (data) {
                        if (data != null && data.success) {
                            alert(data.responseText);


                        } else {
                            // DoSomethingElse()
                            alert(data.responseText);

                        }

                    },
                    //on failure error message will occur
                    error: function (data) {
                        alert("error");
                    }
                });
            }
            else {
                //redirection to login page
                window.location.replace("@Url.Action("Login", "Account")");
            }
        });
    });
</script>

这里我想展示一个成功将产品添加到购物车的bootstrap模态成功消息。我不知道如何使用bootstrap模式来显示成功消息。所以请帮我展示一个bootstrap模态成功消息。

Answer 1

在成功将产品添加到购物车并添加style:display:none
然后在Ajax Success函数中写入

$("#modal-Id").modal();

如何在成功添加产品到购物车时显示引导模式成功消息

1 个答案: