Skip to main content
knowledgecenter.2checkout.com

Add a dynamic product to the InLine Cart

Overview

Use the Product object to add a dynamic product to the InLine Cart by calling the click event handler.

Use case

  1. Add an HTML link or button in your page like the one below.
  2. Create a JavaScript click handler to execute the Inline Client desired methods.
  3. Use theTwoCoInlineCart.setup.setMode('DYNAMIC')method in order to let the cart know you are using dynamic instead of catalog products.
  4. In order to set currency useTwoCoInlineCart.cart.setCurrency(currency-code).
  5. Add your product to the cart by calling theTwoCoInlineCart.products.add({name, quantity, price, options}) method.
  6. Use theTwoCoInlineCart.cart.checkout()method to show the cart on your page.

Sample request

HTML

<a href="#" class="btn btn-success" id="buy-button">Buy now!</a>

JAVASCRIPT

window.document.getElementById('buy-button').addEventListener('click', function() {
  TwoCoInlineCart.setup.setMode('DYNAMIC');
  TwoCoInlineCart.cart.setCurrency('USD');
 
  TwoCoInlineCart.products.add({
    name: 'A test dynamic product',
    quantity: 1,
    price: 20,
  });
 
  TwoCoInlineCart.cart.checkout();
});

Demo 

After adding the dynamic product to the InLine checkout using the above method, your cart should look like this: