Using Nop Ajax Cart plugin on custom button

Hi,
Wish to add a new custom button on simple/grouped product template that should work like 'Add to Cart' button. Current 'Add to Cart' button opens small Ajax Cart window with new product added to it. However, I cannot get this Ajax Cart feature to work on new button.
I have added below html just below Add to Cart code in template file(\Presentation\Nop.Web\Themes\Native\Views\Product\ProductTemplate.Simple.cshtml):
<input type="button" id="add-to-cart-button-custom" class="button-1 add-to-cart-button" value="Add Custom Product To Cart" onclick="AjaxCart.addproducttocart_details('/addproducttocart/details/11193/1', '#product-details-form');; return false;" />

Can someone please help?

Hi,

The input should have data-productid attribute.

Well, What I have put is a very simple example of button. After making this work, I intend to use this with a dropdown of various products. So, that user can select a product from dropdown and click on this button to add selected product to cart. Please help on how to achieve this. (I have a specific requirement to show few products in dropdown.)

To add to earlier reply, I intend to use javascript/jquery to replace the productId in url of AjaxCart.addproducttocart_details() call, based on user's selection of dropdown item. Hence, I cannot add data-productid attribute in the button element.

Hi,

The Ajax Cart is replacing the Add to Cart buttons. There is a selector in the administration and a few required things like the product id.

Unfortunately, we can't tell you how to implement your custom logic. Try to beautify the Ajax Cart .js and you will find how we get the buttons from the DOM.

Hi,

I think you should try to make your custom button work like the existing Add to Cart button with the Ajax functionality ensure that the JavaScript call to AjaxCart.addproducttocart_details is correctly triggered and follows the same structure as the default button. The issue might be with the URL or product ID you are using. Try confirming the product ID is correct (in your example it is 11193).

Thanks