Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Error when have a class attribute for optgroup tag #2859

Open
walid-ajaj opened this issue Jan 16, 2024 · 0 comments
Open

Error when have a class attribute for optgroup tag #2859

walid-ajaj opened this issue Jan 16, 2024 · 0 comments

Comments

@walid-ajaj
Copy link

if (typeof classes !== 'undefined' && classes !== '') a.classList.add.apply(a.classList, classes.split(/\s+/));

Browser will throw the error exception DOMException: Failed to execute 'add' on 'DOMTokenList': The token provided must not be empty. when you have <optgroup /> with a value in class attribute.

Example: https://jsfiddle.net/9jbr5h0u/

<select class="selectpicker show-menu-arrow" data-live-search="true" title="Choose one of the following..." data-size="10" >
  <option>-- Select --</option>
  <optgroup label="Test Group" class="test-style">
    <option>Honda</option>
    <option>Civic</option>
    <option>Accord</option>
    <option>Odyssey</option>
  </optgroup>
</select>

The issue is:
in line 1684 plugin try to add class name opt followed with a space.
However, in line 1732 config.optgroupClass is already have a space followed with value <optgroup /> have a class attribute.
This lead optionClass in line 1684 to have two class names separated with two spaces.

Now in line 731 the code classes.split() will create a an array which second element is an empty string, and that empty string element is the one cause the Exception when browser try to add it as class name.

My quick fix for this issue is to filter the result array and remove the empty elements:
if (typeof classes !== 'undefined' && classes !== '') a.classList.add.apply(a.classList, classes.split(/\s+/).filter(function(x) {return x!==''}));

Not sure if there is other places could have same bug, but same fix cam be applied to eveywhere there is a split() call:

if (typeof classes !== 'undefined' && classes !== '') a.classList.add.apply(a.classList, classes.split(/\s+/));

if (buttonClass) button.classList.add.apply(button.classList, buttonClass.split(' '));

if (buttonClass) button.classList.remove.apply(button.classList, buttonClass.split(' '));

if (style) button.classList.remove.apply(button.classList, style.split(' '));

if (buttonClass) button.classList.add.apply(button.classList, buttonClass.split(' '));

Regards,

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant