code for add to cart button

Store Design
,
1

Hello,

I have the following code (it’s both a size selector and add to cart button) in a custom liquid block in my product page.

However the problem is with the add to cart button, when you click the add to cart button it directs you to the cart page, but I want it to open the cart drawer when it’s clicked on.

My product page: https://r1vex.myshopify.com/products/lindberg-antarctic-vinteroverall-black?_pos=2&_sid=fa65803e6&_ss=r

The add to cart button code is in the bottom after:

“”


{% if product.variants.size > 1 %}
    
        Storlek:
            
            {% assign selected_variant = product.selected_or_first_available_variant %}
            {{ selected_variant.title }}
        
        [Storleksguide](https://kidos.se/pages/storleksguide) 
    

    
    
    
    
    
    

        {% for variant in product.variants %}
            

                {{ variant.title }}
            

        {% endfor %}
    

    
    
    
{% else %}
    
    {% assign selected_variant = product.variants.first %}
{% endif %}

Thanks for helping!

2

Hi,

I think I understand want you looking for, right now your code submit and form right after add-to-cart click and my default form submit related product to cart and redirect to cart page, so in your case you need to stop that default actions and create you own function after onclick.

So I can provide you will the following code, which you can add between <% endif %> and <form method="post" action="/cart/add" enctype="multipart/form-data" id="product-form">

$('#product-form').on('submit', function(event) {
  event.preventDefault(); // prevent default form submission
  $.ajax({
    type: 'POST',
    url: '/cart/add.js',
    data: $(this).serialize(),
    dataType: 'json',
    success: function() {
      $('#cart-icon-bubble')[0].click()
    },
    error: function() {
      alert('Error adding product');
    }
  });
});

let me know if you see arror