Uncaught TypeError: Cannot read property 'setAttribute' of null

[Zolak94]

I'm using combobox in my Laravel app. This is my select in my edit_worker blade:

<select name="city_id" class="combobox form-control"  id="city"> 
    <option value="" selected disabled hidden>Choose city...</option>
     @foreach($cities as $city)
         <option value="{{ $city->id }}" 
             @if($worker->city_id == $city->id) 
                 selected='selected' 
             @endif>
         {{ $city->name }}</option>
     @endforeach
 </select>

Once the page is loaded current worker city is selected but once i click on X icon i will get this error Uncaught TypeError: Cannot read property 'setAttribute' of null, my combobox is still working , once I start typing everything is working fine, only when I click on X next to combobox I get that error. Here is full error:

applyStyle.js:66 Uncaught TypeError: Cannot read property 'setAttribute' of null
    at Object.onLoad (applyStyle.js:66)
    at index.js:69
    at Array.forEach (<anonymous>)
    at new t (index.js:67)
    at c.t.toggle (dropdown.js:177)
    at HTMLSpanElement.<anonymous> (dropdown.js:222)
    at HTMLSpanElement.dispatch (jquery.min.js:2)
    at HTMLSpanElement.y.handle (jquery.min.js:2)

[tiesont]

Sorry, not familiar with Laravel in the least, but I wanted to at least acknowledge that I've seen your issue. If I can carve out some time to at least read some intro-level Laravel docs, I'll see if I can suggest anything. Probably going to be a bit, so hopefully someone else chimes in.

[Zolak94]

Sorry, not familiar with Laravel in the least, but I wanted to at least acknowledge that I've seen your issue. If I can carve out some time to at least read some intro-level Laravel docs, I'll see if I can suggest anything. Probably going to be a bit, so hopefully someone else chimes in.

Ok, thank you for reply. Hopefully it will be an easy task. Good luck.

[Zolak94]

Sorry, not familiar with Laravel in the least, but I wanted to at least acknowledge that I've seen your issue. If I can carve out some time to at least read some intro-level Laravel docs, I'll see if I can suggest anything. Probably going to be a bit, so hopefully someone else chimes in.

One more thing, this is also happening when combobox is disabled and I click on dropdown button. So solution can be that I add class pointer-events:none to that div, after that it's working. Is there any other way to do something like this? It seems like dropdown is not disabled when combobox is disabled.

[Zolak94]

I found what caused this. It was Popper JS. So the fix is to not use Popper JS with this...

[tiesont]

Popper JS is a dependency of most of Bootstrap 4's JS components (see https://getbootstrap.com/docs/4.3/getting-started/introduction/#js), so unless you're using Bootstrap 3 or the bundled version of Bootstrap 4, you need to include Popper.