safaribook-pro-aspnet-mvc5/SportsStore/SportsStore.WebUI/Views/Cart/Index.cshtml

@model SportsStore.WebUI.Models.CartIndexViewModel

@{
    ViewBag.Title = "Sports Store: Your Cart";
}

@*Add style tag of cart table*@
<style>
    #cartTable td { vertical-align: middle; }
</style>

<h2>Your cart</h2>
@*Add id*@
<table id="cartTable" class="table">
    <thead>
    <tr>
        <th>Quantity</th>
        <th>Item</th>
        <th class="text-right">Price</th>
        <th class="text-right">Subtotal</th>
    </tr>
    </thead>
    <tbody>
    @foreach (var line in Model.Cart.Lines) {
        <tr>
            <td class="text-center">@line.Quantity</td>
            <td class="text-left">@line.Product.Name</td>
            <td class="text-right">@line.Product.Price.ToString("c")</td>
            <td class="text-right">
                @((line.Quantity * line.Product.Price).ToString("c"))
            </td>
            @*Add button*@
            <td>
                @using (Html.BeginForm("RemoveFromCart", "Cart"))
                {
                    @Html.Hidden("ProductId", line.Product.ProductID)
                    @Html.HiddenFor(x => x.ReturnUrl)
                    <input class="btn btn-sm btn-warning"
                           type="submit" value="Remove" />
                }
            </td>
        </tr>
    }
    </tbody>
    <tfoot>
    <tr>
        <td colspan="3" class="text-right">Total:</td>
        <td class="text-right">
            @Model.Cart.ComputeTotalValue().ToString("c")
        </td>
    </tr>
    </tfoot>
</table>

<div class="text-center">
    <a class="btn btn-primary" href="@Model.ReturnUrl">Continue shopping</a>
    @Html.ActionLink("Checkout now", "Checkout", null, new { @class = "btn btn-primary" })
</div>