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

Highlighted
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="{{product.id}}"  method="post"><input type="hidden" name="id" data-productid="{{product.id}}" 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" />

</form>

"

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){
 
  e.preventDefault();
 
 
  var val =  $("input[name = 'prodid']").val(); 
  console.log("innn",val);
 
  $.ajax({
    type: 'POST',
    url: '/cart/add.js',
    data: {
 
          quantity: 1,
          id: val,
 
 
    },
    
    dataType: 'json',           
    success: function(datas) {
      console.log("innn",val);
            $.getJSON("/cart.js", function(dataw, status){
              $('span.number-wrapper span').text(dataw.item_count);  
            });
            setTimeout(function(){
              $.get("/cart?view=ajax--mobile", function(data, status){
                $('.off-canvas--right-sidebar').html(data);  
              });
              $('a.cart-link.font--accent').trigger('click');
            }, 500);    
    }      
  })
});

 

this is my ajax code which is actually opening the drawar but only adding 1 product https://community.shopify.com/c/Shopify-Design/Pass-Variant-ID-to-Cart-without-Dropdown-menu/td-p/28... 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.

0 Likes