Jquery select2: TypeError: b.dataAdapter is null

Question

when using select2 multiselect and choosing an option, I get this error message:

TypeError: b.dataAdapter is null 

Does anyone know what that means?

Multifunction mode works great, I'm just curious about this post.

EDIT:

This is my html:

 <div class="form-group"> <label class="control-label col-md-12" for="participant-id">Participant <span class="required"> * </span> </label> <div class="col-md-12"> <input type="hidden" name="participant_id" value=""/> <select name="participant_id[]" multiple="multiple" class="form-control select2me participantSelector" required="required" id="participant-id"> <option value=""></option> </select> </div> </div> 

this is jquery init:

 $(".select2me").select2({placeholder:"Select",width:"auto",allowClear:!0}))} 

The data for multiselex that I get if the value is selected in another "projectSelector" drop-down list:

 $('.projectSelector').on('change', function() { var targetProject_id = $('#project-id :selected').val(); updateParticpantDropdown(targetProject_id); }); function updateParticpantDropdown(selectedProjectId){ $.ajax({ type: "POST", url: '/xx/projects/xx/'+ selectedProjectId, dataType : "json", success: function (response, status) { if (response.result == "success"){ var data = response.data; $(".participantSelector").empty().select2({ placeholder: "Click here to select participants", allowClear: false, data: data }); } } }); } 

Data is uploaded to the multi-selection, and everything works as expected on the screen. Just in the console, I get an error

TypeError: b.dataAdapter is null

This is my json answer (in short):

  {"result":"success","data":[{"id":18,"text":"xx, Ana Rosa"},{"id":17,"text":"xx, Saul"},{"id":14,"text":"xx, Jesus"},{"id":15,"text":"xx, Jose Sergio" },{"id":13,"text":"xx, Guadalupe"},{"id":12,"text":"xx, Adolfo"},{"id":25 ,"text":"xx, Roland"},{"id":16,"text":"xx, Mariela Elisa"},{"id":11,"text":"xx, Roberto Carlos "},{"id":19,"text":"xx, Jose Rafael"},{"id":2,"text":"xx, Juan Carlos"}]} 

In Chrome, I get this message:

 select2.full.min.js:2 Uncaught TypeError: Cannot read property 'current' of null at HTMLSelectElement.<anonymous> (select2.full.min.js:2) at HTMLSelectElement.dispatch (jquery.min.js:3) at HTMLSelectElement.r.handle (jquery.min.js:3) at Object.trigger (jquery.min.js:3) at HTMLSelectElement.<anonymous> (jquery.min.js:3) at Function.each (jquery.min.js:2) at n.fn.init.each (jquery.min.js:2) at n.fn.init.trigger (jquery.min.js:3) at d.select (select2.full.min.js:1) at d.select (select2.full.min.js:2) 

Answer 1

Since selector2 elements tend to store some extra data, I noticed that when the list item data is cleared in addition to $(".participantSelector").empty() , the error went away. So try this like this:

 var selector = $(".participantSelector"); selector.empty(); selector.removeData(); selector.select2({ placeholder: "Click here to select participants", allowClear: false, data: data }); 

Hope this works for you too.

Answer 2

you should remove .empty () and use as shown below. It works great for you.

 $(".participantSelector").select2({ placeholder: "Click here to select participants", allowClear: false, data: data }); 

Answer 3

I think this is a problem because you initialized select drop down with a null value. Basically, the script informing you of the drop is initialized, but there is no data in it. Add one value as a solution

<option value="0">Please Select</option>

The rest of the things seem right.