Попытка использовать Ajax для моей функции AddToCart (Использование формы в Foreach) - PullRequest
0 голосов
/ 03 января 2019

Пока что это добавит только первый товар в корзину и останется на той же странице.На каждой странице есть как минимум 3 элемента, с которыми каждый раз создается новая форма.Другие продукты, которые он не добавит в корзину, перенаправят меня на страницу Home Index.Я использую Ajax для отправки формы.Вместо сообщения об успехе появляется сообщение об ошибке (только при добавлении первого товара в корзину), поэтому что-то идет не так, как надо.Это то, что я до сих пор .....

Просмотр:

  @foreach (var item in Model)
 {
         <a href="@Url.Action("Details","Products", new { id = item.ProductID 
           })" class="btn btn-outline-secondary">View details</a>

         <div id="MessageContent"></div>

  @using (Html.BeginForm
         ("", "", FormMethod.Post, new { @productID = item.ProductID, Id = "myForm" }))
             {
              @Html.HiddenFor(x => x.Where(p => p.ProductID == 
               item.ProductID).FirstOrDefault().ProductID)

          <input type="submit" onclick="addToCart(1)" value="Add To Cart" 
          class="btn btn-primary" />                                                   
 }
}

Ajax (в представлении):

 <script type="text/javascript">
        $('#myForm').submit(function (e) {           
            e.preventDefault();
            $('#MessageContent')
           .html("<div class='alert alert-info'> Adding to cart...</div>")
            $.ajax({               
                url: '@Url.Action("AddToCart", "Home")',               
                type: 'POST',            
                data: $(this).serialize(),               
                success: function (e) {                
                    $('#MessageContent')
                        .html("<div class='alert alert-success'>Item added to cart</div>");                                    
                },               
               error: function (e) {              
                    $('#MessageContent').html("<div class='alert alert-warning'>Oops...Some error Occured.</div>");
                }
            });
        });

    </script>

Контроллер:

 [HttpPost]
       public void AddToCart(int productID)

        {
            ////Create the Shell Local Shopping Cart
            Dictionary<int, ShoppingCartViewModel> shoppingCart = null;

            //Check the global shopping cart
            if (Session["cart"] != null)
            {
                //if it has stuff in it, reassign to the local
                shoppingCart = (Dictionary<int, ShoppingCartViewModel>)Session["cart"];
            }
            else
            {
                //create an empty Local Version
                shoppingCart = new Dictionary<int, ShoppingCartViewModel>();
            }

            //get the product being displayed in the view
           Product product = db.Products.Where(x => x.ProductID == productID).FirstOrDefault();

            if (product == null)
            {
                //return RedirectToAction("Index");
            }
            else
            {
                //title is valid
                ShoppingCartViewModel item = new ShoppingCartViewModel(1, product);

                //if the item is already in the cart just increase the qty
                if (shoppingCart.ContainsKey(product.ProductID))
                {
                    shoppingCart[product.ProductID].Qty += 1;
                }
                else //add the item to the cart
                {
                    shoppingCart.Add(product.ProductID, item);
                }
                //now that the item has been added to the local cart, 
                //update the session cart with the new item/qty
                Session["cart"] = shoppingCart;    
            }              
        }

ОБНОВЛЕНИЕ: Я только что исправил сообщение об ошибке, удалив тип данных: 'json' из функции ajax.

1 Ответ

0 голосов
/ 03 января 2019

Я понял это. Ошибка новичка ... Я использовал уникальный идентификатор "#myform" в каждой форме, поэтому он больше не использовался после отправки первой формы. Идентификатор MessageContent, однако, я не мог получить всплывающее окно без отображения на всех формах или только один. Это не важно, хотя я могу просто удалить эту часть.

...