add.js not found 404

[Yuri_Boyka]

I have added the Jquery AJAX Code to add product item to the cart. This all code written in Page Template.
Please tell me if anything work that I left before to proceed this.
I didnt see any add.js in myshopify store.
I am familier with Shopify but stuck there. Thanks in advance
 

  $(".add").click( function() {
    $.ajax({
      type: 'POST',
      url: '/cart/add.js',
      data : { id: 11567095812, quantity: 1 },
      dataType: 'json',
      success: function(data) { 
        		alert(data);
      }         
  });  
  });

[Jason]

add.js is an AJAX API endpoint - it's not a file that is part of your theme. 

For more info on the AJAX API read over the docs:
https://help.shopify.com/themes/development/getting-started/using-ajax-api

[Yuri_Boyka]

Thanks for your response.But please give me where is something missing that I could't get it.
I stuck from last 2 days.

[Jason]

Giving more information about the issue, errors, and examples are always a good idea when asking for assistance. There's not enough context to understand what you're trying to do and what you should be seeing. Links to your store are a good start.

Consider adding info like:

• What theme is in use.
• A link to a page that has this code in place (that fails)
• Explain the actual problem. For example - what do you expect to happen vs what is actually happening.
• Show any any errors you see,
• Exaplain how the forum members can replicate the problem (once we see a link).

[Yuri_Boyka]

Published theme is Debut
my store link is and where this code is applied
https://safedrivingbreathalyzer-com.myshopify.com/pages/main-products
its password to access frontend is "shaghe"
I want to add the product item using jquery ajax, please check view source

Thanks in advance

[Jason]

When doing development on a site it always pays to keep an eye on the Browser debug console. I can see that attempting to add a product to the cart returns this error:

{"status":404,"message":"Cart Error","description":"Cannot find variant"}

This would mean that the ID you are sending (eg: 11567095812) is not correct. Make sure the ID you are sending is the correct varant ID.

[Yuri_Boyka]

you are sweome dude.
variant id was incorrect, everything is working fine 🙂

[Ninthony]

Just wanted to say thanks to Yuri and Jason for figuring this out. My problem was that the ID that I was refering to was the original product ID and not a particular variants ID. Here's the working code for my button that occurs on all products on my landing page. In my button div I have a data attribute called data-url"{{ prod.url }}" and this is all being generated in a for loop that is loading all the products into a slider. So my button is positioned absolutely over all the products: 

// --------------------Button over product ----------------------------->

<div class="buy-now" data-url="{{prod.url}}">

//---------------------Script------------------------------>

  var buy_now = $('.buy-now');
  
  //for each of them, assign a click listener
  buy_now.each(function(){
    $(this).click(function(){
      
  //get their product url
    var productURL = $(this).data( "url" );
      
  //get the JSON for the product    
      jQuery.getJSON(productURL + '.js', function(product) {
          var product_id=product.variants[0].id;
        console.log(product_id)
        jQuery.post('/cart/add.js', {
        
          quantity:1,
          id:product_id
        
        })
        
} );
    })
  })

[AvidBrio]

you can see the print the id 

{{ product.variants.first.id }}
{{ product.id }}

[Technologic]

The answer is not in this doc why post it?