Lösen Sie nach Auswahl von select2 eine Aktion aus

Ich verwende die select2-Bibliothek für meine Suche.
Gibt es eine Möglichkeit, nach Auswahl eines Suchergebnisses eine Aktion auszulösen? Öffnen Sie beispielsweise ein Popup oder eine einfache JS-Warnung.

$("#e6").select2({
    placeholder: "Enter an item id please",
    minimumInputLength: 1,
    ajax: { // instead of writing the function to execute the request we use Select2's convenient helper
        url: "index.php?r=sia/searchresults",
        dataType: 'jsonp',
        quietMillis: 3000,
        data: function (term, page) {
        return {
            q: term, // search term
            page_limit: 10,
            id: 10
            };
        },
        results: function (data, page) { // parse the results into the format expected by Select2.
            // since we are using custom formatting functions we do not need to alter remote JSON data
            return {results: data};
        },
    },

    formatResult: movieFormatResult, // omitted for brevity, see the source of this page
    formatSelection: movieFormatSelection, // omitted for brevity, see the source of this page
    dropdownCssClass: "bigdrop", // apply css that makes the dropdown taller
    escapeMarkup: function (m) { return m; } // we do not want to escape markup since we are displaying html in results
});

Siehe den Abschnitt Dokumentationsereignisse

Abhängig von der Version sollte eines der folgenden Snippets das gewünschte Ereignis enthalten. Alternativ können Sie einfach "select2-selected" durch "change" ersetzen.

Version 4.0 +

Ereignisse haben jetzt das folgende Format: select2:selecting(anstelle von select2-selecting)

Vielen Dank an snakey für die Benachrichtigung, dass sich dies ab 4.0 geändert hat

$('#yourselect').on("select2:selecting", function(e) { 
   // what you would like to happen
});

Version vor 4.0

$('#yourselect').on("select2-selecting", function(e) { 
   // what you would like to happen
});

Zur Verdeutlichung select2-selectinglautet die Dokumentation für :

select2-selected Wird ausgelöst, wenn eine Auswahl in der Dropdown-Liste ausgewählt wird, jedoch bevor Änderungen an der Auswahl vorgenommen wurden. Dieses Ereignis wird verwendet, damit der Benutzer die Auswahl durch Aufrufen von event.preventDefault () ablehnen kann.

in der Erwägung, dass Veränderung:

change Wird ausgelöst, wenn die Auswahl geändert wird.

Dies ist changemöglicherweise besser für Ihre Anforderungen geeignet, je nachdem, ob Sie die Auswahl abschließen und dann Ihre Veranstaltung durchführen oder die Änderung möglicherweise blockieren möchten.

Es wurden einige Änderungen an den Namen der select2-Ereignisse vorgenommen (ich denke in Version 4 und höher), sodass das '-' in dieses ':' geändert wird .
Siehe die nächsten Beispiele:

$('#select').on("select2:select", function(e) { 
    //Do stuff
});

Sie können alle Ereignisse auf der Plugin-Site 'select2' überprüfen: select2 Events

Für mich geht das:

$('#yourselect').on("change", function(e) { 
   // what you would like to happen
});

Gemäß meiner Verwendung über Version 4 wird dies funktionieren

$('#selectID').on("select2:select", function(e) { 
    //var value = e.params.data;  Using {id,text format}
});

Und für weniger als v.4 wird das funktionieren:

$('#selectID').on("change", function(e) { 
   //var value = e.params.data; Using {id,text} format
});

Für oben v4

$('#yourselect').on("select2:select", function(e) { 
     // after selection of select2 
});

//when a Department selecting
$('#department_id').on('select2-selecting', function (e) {
    console.log("Action Before Selected");
    var deptid=e.choice.id;
    var depttext=e.choice.text;
    console.log("Department ID "+deptid);
    console.log("Department Text "+depttext);
});

//when a Department removing
$('#department_id').on('select2-removing', function (e) {
    console.log("Action Before Deleted");
    var deptid=e.choice.id;
    var depttext=e.choice.text;
    console.log("Department ID "+deptid);
    console.log("Department Text "+depttext);
});