ASP.NET MVC - ショッピングカートから削除

Question

私のグループと私は私たちのウェブサイトでこれに対する答えを見つけるのに苦労しており、最終的にコミュニティにいくつかの助けを求めています！

私たちのウェブサイトのボタンを "カートから取り除く"ようにしてリンクし、データベースを0に戻してページを更新し、減少を表示することです。

ショッピングカートビューのjavascriptは機能していないようですが、これが最終的に問題であるかどうかはわかりません。 MVCミュージックストアやASP.NETのドキュメントなど、多くのガイドに従ってきました。

Index.cshtml：

script src="/Scripts/jquery-1.5.1.min.js" type="text/javascript"></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> 

<h3> 
    <em>Review</em> your cart: 
</h3> 
<div id="update-message"> 
</div> 

<div style="height:600px; overflow:auto; padding-top: 50px; margin-left: 200px; width: 1050px; "> 
    <table id="cart-summary" border="1" frame="void" rules="rows" style="width:100%;margin-left:auto; margin-right: auto;"> 
     <tr class="data-table"> 
      <th colspan="1"> 
       Item(s) 
      </th> 
      <th colspan="1" style="text-align:center;"> 
       Price 
      </th> 
      <th colspan="1" style="text-align:center;"> 
       Quantity 
      </th> 
      <th colspan="1" style="text-align:center;"> 
       Total 
      </th> 
      <th></th> 
     </tr> 


     @foreach (var item in Model.CartItem) 
     { 
      <tr> 
       <td style="margin:auto;width:500px;"> 
        <div style="float:left;"> 
         <a href=@Url.Content(String.Format("~/Books/Details/{0}", item.Book.id))> 
          <img class="img-responsive" src="@Url.Content(String.Format("~/Content/img/books/{0}.jpg",item.Book.ISBN))" style="width: 100px; height: 150px;" /> 

         </a> 
        </div> 

        <div style="margin-top:37px;"> 
         <a href=@Url.Content(String.Format("~/Books/Details/{0}", item.Book.id))> 
          <span>@Html.DisplayFor(modelItem => item.Book.Title)</span><br /> 
         </a> 
         <span style="text-align:left;">@Html.DisplayFor(modelItem => item.Book.Author)</span><br /><br /> 
         <span style="text-align:left">ISBN: @Html.DisplayFor(modelItem => item.Book.ISBN)</span> 
        </div> 

       </td> 
       <td> 
        <p style="text-align:center;">@item.Book.PriceNew</p> 
       </td> 

       <td> 
        <p style="text-align:center;">@item.Quantity</p> 
        <a href="#" class="RemoveLink" data-id="@item.RecordId">Remove from cart</a> 
        <!--data-url='Url.Content("~/ShoppingCart/RemoveFromCart")'> 
         Remove from cart 
        </a>--> 
       </td> 
       <td> 
        <p>@Model.CartTotal</p> 
       </td> 
      </tr> 
     } 
     <tr> 
      <td></td> 
      <td> 
       <p style="padding-top:15px;"></p> 
       <br /> 
       <button type="button"> 
        @Html.ActionLink("Back to List", "../Books/Index") 
       </button> 
      </td> 
      <td></td> 
      <td id="cart-total"> 
       <p style="padding-top: 10px;font-weight:bold;color:rgb(179,0,0);font-size:18px;">Subtotal: @Model.CartTotal</p> 
       <button type="button"> 
        @Html.ActionLink("Checkout!", "AddressAndPayment", "Checkout") 
       </button> 
      </td> 
     </tr> 

    </table> 
</div> 

コードの次のセットは、C＃コードです。 Cart.cs：

public int RemoveFromCart(int id) 
     { 
      var cartItem = bookDb.Carts.Single(
       c => (c.CartId == ShoppingCartId) 
       && c.RecordId == id); 

      int itemCount = 0; 

      if (cartItem != null) 
      { 
       if (cartItem.Quantity > 1) 
       { 
        cartItem.Quantity--; 
        itemCount = cartItem.Quantity; 
       } 
       else 
       { 
        bookDb.Carts.Remove(cartItem); 
       } 
       bookDb.SaveChanges(); 
      } 

      return itemCount; 
     } 

最後にお互いに関連したコードのMVCのセットを完了するために...我々はまた、ここでエラーがあるかもしれないと考えています。ここでもまた、われわれは知っているだけの経験がありません。

ShoppingCartController.cs：

// GET: ShoppingCart 
     public ActionResult Index() 
     { 
      var cart = ShoppingCart.GetCart(this.HttpContext); 

      // Set up our View Model 
      var viewModel = new ShoppingCartViewModel 
      { 
       CartItem = cart.GetCartItems(), 
       CartTotal = cart.GetTotal() 
      }; 
      return View(viewModel); 
     } 

     // GET: Book/Details/5 
     // Button that allows you to add to the cart you will be redirected to the Shopping cart index page 
     public ActionResult AddToCart(string id) 
     { 
      var addedBook = bookdb.Books.Single(book => book.ISBN == id); 

      var cart = ShoppingCart.GetCart(this.HttpContext); 

      cart.AddToCart(addedBook); 

      bookdb.SaveChanges(); 

      return RedirectToAction("Index"); 
     } 

     // this is attached to the remove to cart button in the shopping cart index page, the index page will then reload 
     [HttpPost] 
     public ActionResult RemoveFromCart(int id) 
     { 
      // Retrieve the current user's shopping cart 
      var cart = ShoppingCart.GetCart(this.HttpContext); 

      // Get the name of the book to display confirmation 
      string bookName = bookdb.Carts.Single(book => book.RecordId == id).Book.Title; 

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

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

おかげでたくさん！

Answer 1

Index.cshtml

<script> 


$(document).on('click', '.del-CartDetail', function() {  

var id = $(this).data("id");   

$("#hdnCartDetailId").val(id);  

$("#modal-del-cartdetail").modal({    

backdrop: 'static',  
keyboard: false,   
show: true  
    }); 

}); 


$("#btnModalSubmit").click(function() {   
    var buttonText = $("#btnModalSubmit").html(); 
    $("#btnModalSubmit").attr('disabled', '').html('<i class="fa fa-spinner fa-spin"></i>&nbsp; ' + buttonText); 


var id = $("#hdnCartDetailId").val(); 


$.ajax({ 
      url: '/CartDetail/DeleteCartDetail', 
      type: "POST", 
      dataType: "json", 
      contentType: 'application/json; charset=utf-8', 
      data: JSON.stringify({ Id: id }), 
      success: function (result) { 
       debugger; 
       if (result.success) { 
        $('#modal-del-cartdetail .close').click(); 
        //Page redirect after delete record 
        window.location.reload(); 
        $('#modal-del-cartdetail').show(); 
        INTAPP.Util.Notification(true, "Selected Cart(s) have been successfully deleted."); 
       } else { 
        INTAPP.Util.HandleLogout(data.message); 
        INTAPP.Util.Notification(false, "Some error occured while deleting selected Cart."); 
       } 

       $("#btnModalSubmit").attr('disabled', null).html('Submit'); 
      }, 
      error: function (xhr, status, error) { 
       INTAPP.Util.Notification(false, error); 
       $("#btnModalSubmit").attr('disabled', null).html('Submit'); 
      } 
     }); 
    });  
</script> 


@Html.Partial("ConfirmModal", new ModalViewModel 
    { 
     Id = "modal-del-cartdetail", 
     IsAlertModel = false, 
     Title = "Delete Product", 
     Message = "Are you sure you want to delete the cart detail?", 
     HiddenElementId = "hdnCartDetailId" 
    })