Created by: pvdlg
Fixes #18641 (closed), fixes #21328 (closed).
Util.getSelectorFromElement
is used to obtains the selector, (and later then the matching elements), referenced by data-target
or href
in JS components.
If data-target
is not defined it relies on a regex to determine if href
is a selector or a regular link.
The problem is that there is no way to have a regex that will isolate URL from css selectors in 100% of the cases. For example href="div.class"
can mean 'execute the JS action (collapse, dropdown, etc..) on all div
with the class class
or it can be a regular href
URL redirecting to the page <context>/div.class
In order to solve this issue this PR remove the reliance on the regex and:
- replace
getSelectorFromElement
bygetTargets
that returns a JQuery with matching targets - if
data-target
is defined,getTargets
uses it - if
data-target
is not defined,getTargets
try to usehref
and considers it as the attribute containing the target selector, if a JQuery selection on it actually returns elements
In addition the PR slightly simplifies the code to retrieve targeted elements in each modules.
Currently if a JS module trigger element (i.e. element with data-toggle
) doesn't have a valid selector in data-target
nor in href
nothing happen except for dropdown and alert in which the parent of the trigger is considered the target. There is no error reported and the JS module is bypassed and has no effect. I kept the same behavior in the PR.