JQuery conflicts will stop the application from working as expected.
You may have a JQuery conflict if you experience any of the following:
- Adding items to cart results in a spinner that does not disappear
- Items fail to add to cart
- Option Set Rules do not work as expected
- You see $ is undefined in browser debug / console logs
This can happen if other installed applications are conflicting with Option Price Calculator requirements.
You have a conflicting version of JQuery on your site.
Troubleshooting
Determine what version of JQuery is loading on your store.
- Open your store in a web browser.
- Right click anywhere eon the page and go to Inspect.
- Go to Console tab.
- Run the following command:
$().jquery;
Console should return 3.5.1
If console returns JQuery undefined or $ undefined, JQuery is not installed on the page.
You may want to test this on your product page and your cart page separately. Sometimes themes may not load all expected resources on each page.
JQuery missing from store
- Go to Online Store => Themes
- Click Actions and go to Edit code
- Search and open Theme.liquid
- Find the closing </head> tag.
- Paste the following code:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
Incorrect version of JQuery
An incorrect version of JQuery often means you need to follow instructions to install JQuery or add a newer version of JQuery to your store. It may mean you need to track down and remove other references to JQuery in your store.
A different version of JQuery will likely stop Option Price Calculator from operating as expect.