We have checked in our local environment and ensure that when we click on the Add to cart button without providing values in the required field then the page gets reloaded and show the error message.
Can you please share us with your product URL so that we can verify from our side?
Thank you!
If you click Add to cart in Ajax mode, so there is no page reload and user couldn’t see the error.
I setup plugin on a temporary test website:
https://taraztools.ir/product/test-product-with-extra-product-options/
Please check the website on mobile size to see what exactly I mean.
Thank you
Due to the Ajax add to cart the page is not scrolling to the top when an error occurs. You can add the scrolling by adding custom JavaScript. You need to add the JavaScript based on the ajax add to cart result(if an error occurred).
Please note that you only need to add this for the mobile view by checking the width.
Sample code for scrolling is given below:
$('html, body').animate({scrollTop:($('.single-product .woocommerce-error').offset().top-100)}, 1000);
Note: You need to adjust it based on your requirement.
We hope this will help.
Thank you!
Thank you. I put your code in <script> tag and add it before </head> on theme Header.php but it doesn’t work (not do anything). Sorry for that Can you please help me?
Console:
Uncaught TypeError: Cannot read property ‘top’ of undefined
-
This reply was modified 1 year, 1 month ago by
Tareq Jamal.
Please add the above code in the footer template before closing the body tag.
You need to modify the code based on your requirement.
Thank you!
I used Pop-up Notices for WooCommerce to handle error display and its perfect, A great match with Extra Product Options (Product Addons)
Thank you for support
