Bootstrap-select: Empty select refresh error "Cannot read property 'classList' of undefined"

[kriit24]

If select is empty and then make refresh u got error
"bootstrap-select.js:948 Uncaught TypeError: Cannot read property 'classList' of undefined".

Bootstrap version: 1.13.5

Line code is: active.classList.remove('active');

//i made ajax autocomplete for bootstrap select
//before showing new select content i need to remove old content
select.html('');
select.selectpicker('refresh');

[kriit24]

I made the fix:

if (that.activeIndex !== that.selectedIndex && active != undefined && active.classList != undefined) {

[kriit24]

Also i fixed

element clearing problem if data dynamically changes.
It will be create if he did it himself automatically.

$('select[name="some"]').parents('div.bootstrap-select').find('ul.dropdown-menu.inner').html('');

[AbdallahBedir]

+1

[caseyjhol]

Released in v1.13.6!

[addisonklinke]

@caseyjhol I am still seeing this error in 1.13.9 - please see this fiddle. The steps to reproduce are

1. Click the dropdown box
2. Type "a" in the search
3. Press the down arrow key

Expected behavior: User can use up/down arrow keys to navigate search matches and press enter to chose one

Actual behavior: Blue highlight does not move with arrow keys, but throws error Cannot read property 'classList' of undefined. Additionally, multiple options remaining highlighting when using arrow keys and some options are skipped relative to the displayed order

Setup details

• Operating system: Ubuntu 18.04
• Browser: Chromium v76.0.3809.100
• jQuery v3.2.1
• PopperJS v1.14.3
• Bootstrap v4.0.0
• bootstrap-select v1.13.9

EDIT: I noticed that pulling bootstrap-select v1.13.8 from the CDN links does not have the same issue, so it appears the bug was reintroduced in the latest release

[caseyjhol]

@addisonklinke I wasn't able to reproduce the error in your fiddle. I was able to reproduce the issues with highlighting the incorrect option. That was fixed in v1.13.10, though (see #1219).