31 октября 2016 г.

Добавление нового элемента в Chosen

Есть такой очень хороший jQuery плагин Chosen. Он позволяет из стандартных выпадающих списков `select` делать очень удобные. Но плагин не позволяет работать с добавлениями элементов "из коробки". Все решения, найденные мной в сети, не удовлетворительны.

Предлагаю следующий способ:

var el = $('#select-where-you-want-to-add-element-dynamically').chosen(),
    chosen = el.data('chosen');
chosen.container.bind('keyup', function (e) {
    if (e.keyCode === 188 || e.which === 188) {
        var value = $.trim(chosen.search_field.val()).replace(',', '');
        $.ajax({
            async: false,
            data: {
                // data that you pass to creation method
            },
            dataType: 'json',
            method: 'POST',
            success: function(result) {
                if (result.pk) {
                    el.append(
                        "<option value=\"" +
                        result.id +
                        "\" selected>" +
                        result.label +
                        "</option>"
                    ).trigger("chosen:updated");
                }
                chosen.search_field.val('');
            },
            url: 'URL of creation method'
        });
    }
});

Комментариев нет:

Отправить комментарий