Pass variant ID of single products which do not have variant(dropdown) but only first getting passed

New Member
11 0 0

I am trying this very hard what i have to do is adding single product to cart on its individual add to add to cart button I would like each product to display with is own Add-to-Cart button in a featured product slider.


<form class="product-form" action="/cart/add" data-productid="{{}}"  method="post"><input type="hidden" name="id" data-productid="{{}}" class="product-select" value="{{ product.variants[0].id }}" data-variant-title="{{ product.variants[0].title }}" />

<input type="submit" value="Add To Cart" class="collection-add-to-cart-btn add-to-cart" />



The above code is working but its redirecting to cart page i do not want it to redirect i want it to open drawar cart after clicking add to cart.

I saw on some forums this can only be done through ajax customization i have also written that code for the same and trying to pass variant ID but only 1 is getting passed always


$('body').on('click', 'input.other', function (e){
  var val =  $("input[name = 'prodid']").val(); 
    type: 'POST',
    url: '/cart/add.js',
    data: {
          quantity: 1,
          id: val,
    dataType: 'json',           
    success: function(datas) {
            $.getJSON("/cart.js", function(dataw, status){
              $('span.number-wrapper span').text(dataw.item_count);  
              $.get("/cart?view=ajax--mobile", function(data, status){
            }, 500);    


this is my ajax code which is actually opening the drawar but only adding 1 product referred this but it is also redirecting to cart page.

Need urgent help in this can anyone tell how do i send clicked variant ID.