Browse - Add to Basket

First step towards making an honest buck is getting customers to add items to the basket. Discover the server-side APIs to get it done and sneak a peek at the client-side APIs available in the Razor Store.

 


Relevant APIs

 

UCommerce.Api
TransactionLibrary.AddToBasket(
quantity,
sku,
variantSku = null,
decimal? unitPrice = null,
PriceGroup priceGroup = null,
addToExistingLine = true,
executeBasketPipeline = true
)

Hands-on

The Sku and VariantSku from the page are posted back the POST method in your product controller. Use the API above to add the product to the basket.


Bonus 1.

Add another field to class AddToBasketViewModel” that takes a quantity. Also modify the form to allow the user to enter a quantity by modifying the Product.cshtml under the views folder.


Bonus 2.

The master class project ships with JQuery extensions that allows you to add a product async using the code snippet below. Use your javascript ninja-skills to collect the information relevant to adding the product to basket and use that approach instead. Collect Sku, VariantSku and the Quantity.

$.uCommerce.addToBasket(
    {
        sku: “”,
        variantSku: “”,
        quantity: 1,
        addToExistingLine: true
    },
    onSuccess,
     onError)
{{lineitem.ProductName}}

{{lineitem.VariantName}} - {{lineitem.Quantity}} x {{lineitem.FormattedPrice}} {{lineitem.FormattedPrice}}

Your cart is empty ;(
Total {{basket.FormattedProductsTotal}}
Checkout