„Funkcja zapytania nie została zdefiniowana dla niezdefiniowanego błędu Select2”

Próba użycia Select2 i otrzymanie tego błędu w polu wejściowym / tekstowym wielu elementów:

"query function not defined for Select2 undefined error"

Omówione w tym wątku grupy Google

Problem wynikał z dodatkowego elementu div, który był dodawany przez select2. Select2 dodał nowy element div z klasą „select2-container form-select”, aby opakować utworzony element zaznaczenia. Więc następnym razem, gdy ładowałem funkcję, zgłaszany był błąd, ponieważ select2 był dołączany do elementu div. Zmieniłem selektor ...

Przedrostek identyfikatora css select2 z określoną nazwą tagu „select”:

$('select.form-select').select2();

Ten komunikat o błędzie jest zbyt ogólny. Jednym z innych możliwych źródeł jest to, że próbujesz wywołać select2()metodę na już „select2ed” wejściu.

Jeśli zainicjujesz puste wejście, wykonaj następujące czynności:

$(".yourelement").select2({
 data: {
  id: "",
  text: ""
 }
});

Przeczytaj pierwszy komentarz poniżej, który wyjaśnia, dlaczego i kiedy powinieneś użyć kodu w mojej odpowiedzi.

Miałem też ten problem, upewnij się, że nie inicjalizujesz dwukrotnie select2.

U mnie ten problem sprowadzał się do ustawienia prawidłowego atrybutu data-ui-select2:

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


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

$scope.selectedProjectManager = {};

Jeśli zdejmę datanieruchomość na $scope.projectManagers, otrzymuję ten błąd.

Ten problem sprowadzał się do tego, jak budowałem moje pole wyboru select2. W jednym pliku javascript miałem ...

$(function(){
  $(".select2").select2();
});

A w innym pliku js przesłonięcie ...

$(function(){
    var employerStateSelector = 
                $("#registration_employer_state").select2("destroy");
    employerStateSelector.select2({
    placeholder: 'Select a State...'
    });
});

Przeniesienie drugiej zmiany do zdarzenia ładowania okna rozwiązało problem.

$( window ).load(function() {
  var employerStateSelector = 
              $("#registration_employer_state").select2("destroy");
  employerStateSelector.select2({
    placeholder: 'Select a State...'
  });
});

Ten problem pojawił się w aplikacji Railsowej

Otrzymałem również ten sam błąd podczas używania Ajax z polem tekstowym, a następnie rozwiązuję go, usuwając klasę select2 z pola tekstowego i ustawiając select2 według identyfikatora:

$(function(){
  $("#input-select2").select2();
});

Wygląda na to, że twój selektor zwraca niezdefiniowany element (Dlatego undefined error jest zwracany)

W przypadku, gdy element naprawdę istnieje, wywołujesz select2 na inputelemencie bez dostarczania czegokolwiek do select2, skąd powinien pobierać dane. Zazwyczaj dzwoni się .select2({data: [{id:"firstid", text:"firsttext"}]).

Występuje również ten sam błąd podczas korzystania z ajax.

Jeśli używasz Ajax do renderowania formularzy za pomocą select2, klasa input_html musi być inna niż te, które NIE są renderowane przy użyciu Ajax. Nie do końca jestem pewien, dlaczego to działa w ten sposób.

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

Jest to generowane, ponieważ zapytanie nie istnieje w opcjach. Wewnętrznie prowadzona jest kontrola, która wymaga jednego z poniższych parametrów

• Ajax
• tagi
• dane
• pytanie

Musisz więc tylko podać jedną z tych 4 opcji do select2 i powinna działać zgodnie z oczekiwaniami.

Mam ten sam błąd. Używam select2-3.5.2

To był mój kod, który zawierał błąd

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

Poniższy kod naprawił problem.

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

Mam skomplikowaną aplikację internetową i nie mogłem dokładnie zrozumieć, dlaczego ten błąd jest generowany. Po rzuceniu JavaScript przerywał działanie.

W select2.js zmieniłem:

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

do:

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

Teraz wszystko wydaje się działać poprawnie, ale nadal loguje się błąd, na wypadek, gdybym chciał spróbować dowiedzieć się, co dokładnie w moim kodzie powoduje błąd. Ale na razie jest to dla mnie wystarczająco dobre rozwiązanie.

posługiwać się :

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

}