Update Quantity through an editior or text box

Question

EDIT: Basically want to change the current method of adding more than one of the same product from adding them individually to the cart to when one has been added you can just input how many you want.

Hi guys so currently in my system the quantity of an item added to the cart is updated by the user clicking to continue shopping and going back and selecting a new item each time they wish to add it. I would like for this to be done through either an editor or text box so they can select the quantity they want without having to go back to view the product like 3 times.

Add method (Shopping Cart Controller)

public ActionResult AddToCart(int id)
        {
            var addedProduct = db.Products.Single(product => product.ID == id);

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

            cart.AddToCart(addedProduct);

            return RedirectToAction("Index");
        }

Add method (Shopping Cart Model)

public void AddToCart(Product product)
        {
            var cartItem = db.Carts.SingleOrDefault(c => c.CartId == ShoppingCartId && c.ProductId == product.ID);

            if (cartItem == null)
            {
                cartItem = new Cart
                {
                    ProductId = product.ID,
                    CartId = ShoppingCartId,
                    Count = 1,
                    DateCreated = DateTime.Now
                };
                db.Carts.Add(cartItem);
            }
            else
            {
                cartItem.Count++;
            }

            db.SaveChanges();
        }

shopping cart view model

 public class ShoppingCartViewModel
    {
        public List<Cart> CartItems { get; set; }
        public decimal CartTotal { get; set; }
    }
}

Shopping Cart View @{ ViewBag.Title = "Store Checkout"; CultureInfo us = new CultureInfo("en-GB"); }

<h3 class="text-center">
    <span><img src="~/Content/Images/shoping_cart.png" />Your shopping cart:</span>
</h3>

<div id="update-message" class="text-info">
</div>
@if (Model.CartItems.Count == 0)
{
    <a class="btn-danger" href="~/Products/Index">Your shopping cart is empty, continue shopping---></a>
}
else
{
    <table class="table-responsive table-bordered table-striped">
        <tr>
            <th>
                Product Name
            </th>
            <th>
                Price (each)
            </th>
            <th>
                Quantity
            </th>
            <th>Sub-total</th>
            <th></th>
        </tr>
        @foreach (var item in Model.CartItems)
        {
            <tr id="row-@item.ProductId">
                <td>
                    @Html.ActionLink(item.Product.Name, "Details", "Products", new { id = item.ProductId }, null)
                </td>
                <td>
                    @item.Product.Price
                </td>
                <td id="item-count-@item.ProductId">
                    @item.Count
                </td>
                <td>
                    @((item.Product.Price * item.Count).ToString("c", us))
                </td>
                <td>
                    <a href="" class="RemoveLink" data-id="@item.ProductId">
                        Remove from cart
                    </a>
                </td>
            </tr>
        }
        <tr>
            <td>
                Total
            </td>
            <td></td>
            <td></td>
            <td id="cart-total" class="text-success">
                <b>@Model.CartTotal.ToString("C", us)</b>
            </td>
        </tr>
    </table>

    <p class="button">
        <a>@Html.ActionLink("Continue Shopping", "Index", "Products")</a>
    </p>
    <p class="button">
        @Html.ActionLink("Click and Collect Order>> ", "AddressAndPayment", "Checkout")  @Html.ActionLink("Checkout With Braintree>> ", "AddressAndPaymentBraintree", "Checkout")
    </p>
}

Any Help to solving this would be much appreciated.

How did you originally add this item to the cart? It's the same thing -- it's just a form post with a `quantity` value and the product `id`. — Jasen, May 12 '16 at 17:46
Could you perhaps post a example of this because when I tried doing it the input had no effect. — , May 12 '16 at 17:51
Also the way they are originally added to the cart is through this button @Html.ActionLink("Add to cart", "AddToCart", "ShoppingCart", new { id = Model.ID }, new { @class = "btn btn-info" }) — , May 12 '16 at 18:12
Updating the database with an action link (a GET request) is not safe. See this http://stackoverflow.com/questions/46585/when-do-you-use-post-and-when-do-you-use-get. — Jasen, May 12 '16 at 18:18

score 0 · Answer 1 · answered May 12 '16 at 18:14

This is a basic form submission

@using(Html.BeginForm("UpdateQuantity", "ShoppingCart", FormMethod.Post))
{
    <input name="cartId" value="@cart.Id" type="hidden" />
    <input name="productId" value="@product.Id" type="hidden" />
    <input name="quantity" type="text" />
    <button type="submit">Update</button>
}

The update action

[HttpPost]
public ActionResult UpdateQuantity(int cartId, int productId, int quantity)
{
    var cart = db.Carts.FirstOrDefault(c => c.CartId == cartId);
    cart.Count = quantity;

    db.SaveChanges();

    return RedirectToAction("MyCart", routeValues: new { cartId = cartId });
}

[HttpGet]
public ActionResult MyCart(int cartId)
{
    var cart = db.Carts.FirstOrDefault(c = c.CartId == cartId);
    return View(cart);
}

score 0 · Answer 2 · answered May 12 '16 at 19:09

Hi thanks for the answer Jasen but I found a simplier fix that serves my purpose. basically created a new row in my shopping cart table and added this to it @Html.ActionLink("Add Another?", "AddToCart", "ShoppingCart", new { id = item.ProductId }, new { @class = "btn btn-info" }) thanks for your answer though it might help others but this worked for me.

Update Quantity through an editior or text box

2 Answers2