How to add products to checkout using AJAX

[yanteb]

How can i add a product to checkout programmatically the way i can add a product to the cart using AJAX? See below illustrations:

Basically on all of my product pages i have some custom HTML that allows customers to purchase an add-on (extended warranty). If they select an option (in this case, 3 year extended warranty has been selected) and click "Add to cart", im making a separate AJAX call to POST /cart/add.js to add the warranty product to the cart along with the hardware item. 

^^^This leads to the bottom picture...

The above case im not having trouble with. However when i select an add on and click "Buy with paypal", the add on doesnt get added to the checkout page, only the hardware product does. See below:

 

As you can see, when i click add to cart with an add on selected, the add on gets added

to the cart because Shopify offers an AJAX API to add items to cart by posting to

/cart/add.js. My question is does Shopify offer something like /checkout/add.js to add

line items directly to checkout page?       

[zigainfokalai]

Hi can you help me

Actually, I want to show the collection product list.

In the product list, I want to show multiple variant types. Based on the variant, we need to show the variant price.

Variant types need to show the tab button. If I click tab 1, it will show the first variant, just like all variants.

After that, I want to show variant types in the dropdown. Whichever variant I selected, I need to show the price based on the variant ID.

Here, I want to add the product to the cart page. If I click the add to cart button, it will immediately add the item to the cart. based on the product ID and variant ID. It is possible to do so dynamically. I did everything programmatically. the final step is struggling.