Conflict ajax add to acrt with plugin

Hello,
i use a plugin that creates an extra option inside the page for upload media files (it’s called “WooCommerce Upload Files”).
But when i activate Ajax add to cart option in theme settings,then is not possible to add the product in basket if i upload a file (only in products with variations).
I sent a ticket in plugin’s creator and i quote you his answer:
“I’ve performed some analysis and the issue you experience is related to theme you are using.
More in specific: your theme uses a custom ajax function to add the product to the cart and not the standard post method used by woocommerce product page template.
That Ajax function, once the add to cart button is clicked, sends the product id that has to be added to cart via the add-to-cart parameter (see the attached images). However when the plugin is active, for some reasons, it is sending other parameters but not the one containing the product id.
It seems then that the custom function used by the theme is not properly implemented and when a 3rd party plugin is adding some extra content to the product page, it stops working.
You should then contact the theme developer in order to fix it and make it to properly send the needed parameter even when the Upload Files plugin is active”
Can you please help me because i don’t want disable Ajax add to cart?
Thank you

Update:it seems that can’t add a simple product when i added a variable product with file uploaded.

Attachments:

You must be logged in to view attached files.

Products

Hello,

Our AJAX add to cart function is not aware of any extra fields that may be added by a lot of external plugins. As for the product ID parameter, so our theme takes the default WooCommerce form fields and sends them to AJAX handler. So seems that this plugin changes our theme and WooCommerce HTML structure and add its own fields. Anyway, it may require an additional customization both our theme and that plugin to make them works well with each other. Sorry, but it is out of our theme support scope.

Regards

The problem, as reported in the previous email, is just that custom function you implemented is not taking its own field (in specific the add-to-cart parameter) and sending to your ajax handler.
You have just to fix your handler in order to properly retrieve that value before sending the parameter.No futher extra work is required.
The Product ID is not a custom parameter added by the plugin, the plugin doesn’t need to send any parameter via ajax through this function. That is the parameter you use to proper let your custom function to work.
I would appreciate it to help me with that,thank you

The product ID field is a part of the WooCommerce form https://gyazo.com/f5b14c8c1cbbba211d40d1ce8f5332ad
But it is missed when the plugin is activated
https://gyazo.com/ed890704fbc9bd9743a51df771b73cd1

Yes,this is the problem.
You can read again replies
#45236 ,attached images in #45244 and #45337.
The Product ID is not a custom parameter added by the plugin, the plugin doesn’t need to send any parameter via ajax through this function.

We meant that this parameter is added by WooCommerce, and should be there even if the plugin is activated.

Yes,but the ajax functionality is added from your theme,not from Woocommerce or the plugin.
With storefront for.ex the plugin works fine

Yes, and it requires this parameter to be presented. It works with other themes because they don’t have AJAX add to cart functionality. You can disable it in Theme Settings -> Product page and it will work as with all other themes as you expect.

i know this,but i would like to have this functionality.The problem is that i can add a simple product even if I have not added any file

Yes, you can do this with simple products because that parameter exists there. And for variable products, it is removed. It is more plugin related problem. The AJAX handler can’t add the product to the shopping cart if doesn’t get its ID.

So,you don’t support me? Αt least tell me how it works this functionality for simple and variable products so as to say in plugin’s creator the way to fix it

We would be glad to help you but what can we do in this situation? Plugin rewrites the HTML structure and it is no longer compatible with the JS scripts. The code for this function is located in the file js/functions.js. Function name – addToCartAllTypes.

Hello,i found solution by changing the functions.js file in line 219:
$thisbutton = $form.find(‘button.single_add_to_cart_button’)
The code retrieves the value of the “add to cart” button using the right selector and not the generic .button selector.
Actually the plugin is fully compatible with standard WooCommerce product page template. It is the theme that is custom implementing the product page template adding an ajax function to manage the add to cart function.
The add to cart button is not altered by the plugin and the value of that html element (that represent the product id that your function should pass to your handler) can be easily retrieved with one line of jQuery code:

jQuery(‘buton.single_add_to_cart_button”).val();

I believed it was your responsibility to support me in this…Have a nice day

Hello,

So the problem is in the jQuery selectors interception. We didn’t know that the plugin added their own buttons there as well. By default, WooCommerce plugin doesn’t have any extra buttons with the same class there so it was not necessary to use the selector that you use. In such cases, simpler selectors – better performance. Anyway, we are glad that you solved that problem. We will consider changing this in our theme core files.

Kind Regards

Would you like me to send you the changes? So do you tell me if there’s anything wrong?

Do you mean the part of the code you changed? If it works as you expected, then there is nothing wrong there.

I mean if you want it for included in the next update

Yes, please, post it here so we can use it in the future.

Is this

Attachments:

You must be logged in to view attached files.

Great, thank you.

[Author]

Posts