Активуйте дію після вибору select2

Для пошуку я використовую бібліотеку select2 .
чи є спосіб викликати дію після вибору результату пошуку? наприклад, відкрити спливаюче вікно або просте попередження js.

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

Дивіться розділ " Події документації"

Залежно від версії, один із наведених нижче фрагментів повинен дати вам потрібну вам подію, або просто замінити "select2-selecting" на "change".

Версія 4.0+

Події тепер у форматі: select2:selecting(замість select2-selecting)

Дякуємо Snakey за повідомлення про те, що це змінилося станом на 4.0

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

Версія до 4.0

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

Тільки для уточнення, в документації для select2-selectingчитається:

select2-selecting Здійснюється, коли вибір вибирається у спадному меню, але до того, як було зроблено будь-які зміни у виділенні. Ця подія використовується, щоб дозволити користувачеві відхилити вибір, викликавши event.preventDefault ()

тоді як зміни мають:

зміни Здійснюється при зміні вибору.

Тож changeможе бути більш підходящим для ваших потреб, залежно від того, чи хочете ви, щоб вибір завершився, а потім здійснив свою подію, чи потенційно заблокував зміну.

Були внесені деякі зміни в імена подій select2 (я думаю, у версії 4 та пізніших версіях), тому «-» змінено на «:» .
Дивіться наступні приклади:

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

Ви можете перевірити всі події на сайті плагіна 'select2': select2 Події

Це працює для мене:

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

Відповідно до мого використання вище v.4 це буде працювати

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

І менш ніж до версії 4 це буде працювати:

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

Для вище 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);
});