“query function not defined for Select2 undefined error”

Question

Trying to use Select2 and getting this error on multiple item input/text field:

\"query function not defined for Select2 undefined error\"

Answer 1

This error message is too general. One of its other possible sources is that you're trying to call select2() method on already "select2ed" input.

Answer 2

Also got the same error when using ajax.

If you're using ajax to render forms with select2, the input_html class must be different from those NOT rendered using ajax. Not quite sure why it works this way though.

Answer 3

I got the same error. I have been using select2-3.5.2

This was my code which had error

    $('#carstatus-select').select2().val([1,2])

Below code fixed the issue.

    $('#carstatus-select').val([1,2]);

Answer 4

For me this issue boiled down to setting the correct data-ui-select2 attribute:

<input type="text" data-ui-select2="select2Options.projectManagers" placeholder="Project Manager" ng-model="selectedProjectManager">


$scope.projectManagers = { 
  data: []  //Must have data property 
}

$scope.selectedProjectManager = {};

If I take off the data property on $scope.projectManagers I get this error.

Answer 5

if (typeof(opts.query) !== "function") {
    throw "query function not defined for Select2 " + opts.element.attr("id");
}

This is thrown becase query does not exist in options. Internally there is a check maintained which requires either of the following for parameters

• ajax
• tags
• data
• query

So you just need to provide one of these 4 options to select2 and it should work as expected.

Answer 6

use :

try {
    $("#input-select2").select2();
}
catch(err) {

}