easy-digital-downloads
easy-digital-downloads copied to clipboard
edd-ajax.js edd-add-to-cart class selector compatibility issue with Ajax functionality
Within edd-ajax.js file the .edd-add-to-cart class selectors are in most cases overqualified with an a tag. This results in issues with the input (submit) buttons EDD generates via the edd_get_purchase_link() function being missed when anything is loaded via Javascript/Ajax.
This can be fixed by removing the a tags from all these selectors, meaning both submit inputs and a href tags are updated correctly with the classes to hide the "add to cart" button.
As a side note, this might be on purpose in some instances and might need some testing with multi-part downloads, which allow re-adding options to the cart.
EDD was originally built to retain 100% of functionality with and without Javascript. To achieve this, we leveraged a combination of input elements and a elements. The input fields are shown when JS functionality is not present or broken and the anchor links are shown when JS is functioning.
There are a two solutions to this that immediately come to mind:
-
Remove the input fields entirely and depend only on the anchor links. We removed the option to disable ajax a few versions back so this is now doable.
-
Adjust your extension to look only at the anchor links. Using the input fields is not advisable as those are destined to be removed at some point.
Removing the input fields not something that will happen quickly so I would not recommend depending on that fix.
The problem here isn't so much that the ajax selector is too specific, it's that we do not hide the input field on ajax success. We don't because we assume the input field is already hidden. In some cases, like what @davidsherlock is seeing, however, the input field is visible due to the [downloads] shortcode being loaded with ajax, which causes the input field to be shown. This happens because we hide the edd-no-js elements when the dom is loaded but never anytime after. Elements with edd-no-js loaded into the dom after the initial page load do not get hidden.
To replicate:
- Add
[downloads]to a page - Install EDD Infinite Scroll and enable the option globally https://wordpress.org/plugins/edd-infinite-scrolling/
- On
master, view the page with[downloads]and scroll to the bottom to trigger new items being loaded into the page - Add an item to the cart. You will see an erroneous
Purchasebutton
To test fix:
- Repeat steps above
- There should be no erroneous purchase button
The submitted PR works to a degree but breaks the spinner animation on the downloads loaded via ajax.
Additionally, the issue still exists on multi-part pricing downloads where the add to cart button is not hidden.