Tentativo di utilizzare Select2 e ottenere questo errore su più campi di testo / input di elementi:
"query function not defined for Select2 undefined error"
Tentativo di utilizzare Select2 e ottenere questo errore su più campi di testo / input di elementi:
"query function not defined for Select2 undefined error"
Risposte:
Coperto in questo thread del gruppo Google
Il problema era a causa del div extra che veniva aggiunto da select2. Select2 aveva aggiunto un nuovo div con la classe "select2-container form-select" per racchiudere la selezione creata. Quindi la prossima volta che ho caricato la funzione, l'errore è stato generato mentre select2 veniva allegato all'elemento div. Ho cambiato il selettore ...
Prefisso identificatore css select2 con nome tag specifico "select":
$('select.form-select').select2();
$(document).ready(function() { $('select.form-select').select2()})
.select2({})
metodo. Una soluzione migliore sarebbe chiamare prima il metodo di distruzione. Es:$("#mySelectControl").select2("destroy").select2({});
Nel caso in cui inizializzi un input vuoto, fai questo:
$(".yourelement").select2({
data: {
id: "",
text: ""
}
});
Leggi il primo commento qui sotto, spiega perché e quando dovresti usare il codice nella mia risposta.
select2()
non accetti semplicemente parametri vuoti
Ho anche avuto questo problema, assicurati di non inizializzare due volte select2.
Per me questo problema si è ridotto all'impostazione dell'attributo corretto 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 = {};
Se tolgo la data
proprietà su $scope.projectManagers
ottengo questo errore.
Questo problema si riduceva a come stavo costruendo la mia casella di selezione select2. In un file javascript avevo ...
$(function(){
$(".select2").select2();
});
E in un altro file js un override ...
$(function(){
var employerStateSelector =
$("#registration_employer_state").select2("destroy");
employerStateSelector.select2({
placeholder: 'Select a State...'
});
});
Spostare la seconda sostituzione in un evento di caricamento della finestra ha risolto il problema.
$( window ).load(function() {
var employerStateSelector =
$("#registration_employer_state").select2("destroy");
employerStateSelector.select2({
placeholder: 'Select a State...'
});
});
Questo problema è emerso all'interno di un'applicazione Rails
Ho anche ricevuto lo stesso errore quando si utilizza ajax con una casella di testo, quindi lo risolvo rimuovendo la classe select2 della casella di testo e impostando select2 per id come:
$(function(){
$("#input-select2").select2();
});
Sembra che il tuo selettore restituisca un elemento indefinito (quindi undefined error
viene restituito)
Nel caso in cui l'elemento esista davvero, stai chiamando select2 su un input
elemento senza fornire nulla a select2, da cui dovrebbe recuperare i dati. Di solito si chiama .select2({data: [{id:"firstid", text:"firsttext"}])
.
Inoltre ho ricevuto lo stesso errore quando si utilizza ajax.
Se stai usando ajax per visualizzare i moduli con select2, la classe input_html deve essere diversa da quelle NON renderizzate usando ajax. Non sono del tutto sicuro del motivo per cui funzioni in questo modo.
if (typeof(opts.query) !== "function") {
throw "query function not defined for Select2 " + opts.element.attr("id");
}
Questo viene lanciato perché la query non esiste nelle opzioni. Internamente viene mantenuto un controllo che richiede uno dei seguenti parametri per i parametri
Quindi devi solo fornire una di queste 4 opzioni per select2 e dovrebbe funzionare come previsto.
Ho ricevuto lo stesso errore. Sto usando select2-3.5.2
Questo era il mio codice che aveva un errore
$('#carstatus-select').select2().val([1,2])
Il codice seguente ha risolto il problema.
$('#carstatus-select').val([1,2]);
Ho un'app Web complicata e non sono riuscito a capire esattamente perché è stato generato questo errore. Stava causando l'interruzione del JavaScript quando veniva lanciato.
In select2.js ho cambiato:
if (typeof(opts.query) !== "function") {
throw "query function not defined for Select2 " + opts.element.attr("id");
}
per:
if (typeof(opts.query) !== "function") {
console.error("query function not defined for Select2 " + opts.element.attr("id"));
}
Ora tutto sembra funzionare correttamente, ma è ancora in corso l'accesso per errore nel caso in cui voglio provare a capire cosa esattamente nel mio codice sta causando l'errore. Ma per ora questa è una soluzione abbastanza buona per me.
uso :
try {
$("#input-select2").select2();
}
catch(err) {
}