"Funzione di query non definita per errore non definito Select2"


Risposte:


241

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();

in qualche modo lo ha risolto per me, nel mio caso stavo clonando una riga di input del modulo che includeva menu di selezione select2-ified e ogni sorta di cose strane stavano accadendo dopo il primo clone.
martincarlin87

Deve anche essere all'interno$(document).ready(function() { $('select.form-select').select2()})
TED

1
Come può essere risolto lo stesso problema nella direttiva Select2 dell'interfaccia utente angolare?
zavidovych

Mi sono imbattuto nello stesso problema oggi, sebbene lo stesso codice in precedenza non avesse problemi (forse un aggiornamento di select2?). Comunque, questo ha risolto anche per me e ha funzionato di nuovo bene. Bella risposta!
user756659

10
Questo problema si verifica in genere se il controllo di selezione è già stato inizializzato dal .select2({})metodo. Una soluzione migliore sarebbe chiamare prima il metodo di distruzione. Es:$("#mySelectControl").select2("destroy").select2({});
Dmitry S.

18

Questo messaggio di errore è troppo generico. Una delle sue altre possibili fonti è che stai cercando di chiamare il select2()metodo su un input già "select2ed".


13

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.


2
Ho avuto questo problema quando ho migrato una casella select2 da un elemento di selezione effettivo a un tipo di input = elemento nascosto che stavo popolando in seguito. Nell'eseguire il codice select2, questo errore viene generato perché non viene passato alcun valore di query, ajax, dati o tag.
Daniel,

1
Questa dovrebbe essere la risposta accettata per questa domanda. Non so perché select2()non accetti semplicemente parametri vuoti
swdev

11

Ho anche avuto questo problema, assicurati di non inizializzare due volte select2.


lo stesso per me, ma l'errore non è stato un problema per me. s2 funziona comunque
Reign.85

come fare questo?
khaled saleh

7

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 dataproprietà su $scope.projectManagersottengo questo errore.


5

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


4

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();
});

3

Sembra che il tuo selettore restituisca un elemento indefinito (quindi undefined errorviene restituito)

Nel caso in cui l'elemento esista davvero, stai chiamando select2 su un inputelemento senza fornire nulla a select2, da cui dovrebbe recuperare i dati. Di solito si chiama .select2({data: [{id:"firstid", text:"firsttext"}]).


2

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.


Intendi come, "<input type = 'hidden' class = 'foo' ...." dove se hai più select2, non possono essere tutti 'foo'? Questo non ha funzionato per me.
dethSwatch

1
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

  • ajax
  • tag
  • dati
  • domanda

Quindi devi solo fornire una di queste 4 opzioni per select2 e dovrebbe funzionare come previsto.


0

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]);

Io userei $ ('# carstatus-select'). Select2 ("val", [1,2]); come menzionato nei documenti
hakuna1811

0

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.


-2

uso :

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

}

questo nasconderà solo l'errore, non lo risolverà. Questa non è una soluzione nella stragrande maggioranza dei casi
Ramses il
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.