<div class="container">
<div class="row justify-content-md-center mt-5">
<div class="col-12">
<div class="card">
<div class="card-body">
<h5 class="card-title">Pricing option for dynamic product</h5>
<p class="card-text">
Click the button bellow to open the Inline Cart with dynamic product and pricing options set
</p>
<a href="#" class="btn btn-success" id="buy-button">Buy now!</a>
</div>
</div>
</div>
</div>
</div>
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,
options: [
{
name : 'color',
value : 'red',
surcharge: 10
},
{
name : 'shape',
value : 'squared',
surcharge: 20
}
],
});
TwoCoInlineCart.cart.setSignature('86c6823fcdf7a22ca30e2472ecc45f82aa2526ec590cedd374e3186c4ccebb85');
TwoCoInlineCart.cart.checkout();
});