Problem/Motivation
DOM may be updated by various front end, back end or other ajax actions. Currently when an element with the class ".use-ajax" is added after the initial page load it usually isn't initialised. Although it might work for the admin user as the element binding could occur after the inistial DOM update (such as with VueJS or ReactJS).
To reproduce, create a dialog link with the class attribute use-ajax
and data-dialog-type="modal"
, linking to another page. This should work.
Next, dynamically add another link, using either a JS front end or developer tools. Clicking on the link will take you to the page instead of opening a modal.
Proposed resolution
Find a way to delegate the event to a parent element or listen for dynamic updates.
The attached patch is non-compliant, and it doesn't include ES6 changes, but it does show one way to listen for dynamic updates.