Articles on: Cart

Identifying the correct event listener that triggers the add to cart submit button

This guide will instruct you and illustrate how to identify the correct event listener and script you have to use to place the init code, upsellplusapp.init_drawer_offer(); appropriately:

On the product page, inspect (Ctrl + Shift + I or ⌘ Cmd + Shift + C) the 'add to cart' button and click on the ''**Event Listeners**'' tab:




Finding the Event Listener Tab
Event Listeners tab

Click on the Submit toggle to find the correct script. The key is to look for one file that ends with .js. For example, this file could be: product-form.js, theme.js or theme-editor.js

Finding the file that contains the script

When you hover over the 'form', the section that is being inspected will be highlighted. In this case, the Add to Cart button

After you have identified the file that contains the script, you would want to click on the blue hyperlink that will take you to the Source tab which will show you the code that targets the Add to Cart button:


Code that targets the 'Add to Cart' button

Go to your Store's Admin page and look for the theme you'd like to edit the code for. (We recommend having a backup of your original theme in case you need to revert the changes by either downloading the theme code or duplicating the live version of the theme). When you are editing the code, look for the correct file, which in this case it is the product-form.js located under the 'Assets' folder.

Add the upsellplusapp.init_drawer_offer(); code where the cart should be updated. In this case, it belongs on line 59 as you can see in the example below:

Final Step

Updated on: 07/08/2023

Was this article helpful?

Share your feedback

Cancel

Thank you!