Вопрос по multi-select, javascript – Добавить Удалить обработчик столбца на jqGrid ColumnChooser

2

Я используюjqGrid columnChooser, вот так:

<code>    jQuery(grid).jqGrid(
        'navButtonAdd',
        pagerDiv,
        {
            caption: "Columns",
            buttonicon: "ui-icon-newwin",
            title: "Hide/Show Columns",
            onClickButton: function () {
                $(this).jqGrid('columnChooser', {
                    done: function (perm) {
                        if (perm) {
                            $(this).jqGrid('remapColumns', perm, true);
                        }
                    },
                    modal: true,
                    width: 400,
                    height: 300,
                    classname: 'column-chooser-select'
                });
            }
        }
    );
</code>

и мне было интересно, если есть способ указать обработчик события на columnChooser (используяJQuery UI Multiselect плагин, который поставляется с jqGrid), который срабатывает каждый раз, когда столбец добавляется или удаляется. Поэтому я думаю, что это вопрос из двух частей:

does the jQuery UI Multiselect support such a thing? if so, is there a way to hook it up without altering the jqGrid source?

Немного предыстории того, чего я пытаюсь достичь:

Моя сеточная конфигурация по умолчанию скрывает много столбцов. Некоторые из этих столбцов не заполняются из БД - они являются неясными, редко используемыми элементами данных, которые при заполнении резко снизят производительность выполнения запроса (несколько объединений, включающих таблицы с более 100 миллионами записей).

Если пользователь выберет один из этих столбцов для отображения, я хотел бы предупредить его о том, что требуется другое обратное обращение к серверу, и это может занять некоторое время, - и дать им возможность отменить добавление столбца.

Спасибо

Ваш Ответ

2   ответа
1

когда я отмечуselect All флажок в сетке. Я хочу исключить определенный столбец (по умолчанию он не должен отображаться в моей сетке).
Я использовал свойство hidden = True в модели col. купить я хочу справиться с этим в колонке выбора также.

function Properties_Columnchooser() {
    $('#btn_setColumns').click(function () {
        jQuery('#grid-tableProperties').jqGrid('columnChooser',{
        "shrinkToFit" : true,
        "autowidth" : true,
        done : function(perm) {
            w = $(window).width();
            // alert('done ' + w);
            if (perm) 
               {
                this.jqGrid("remapColumns", perm, true);
                 this.setGridWidth(w - 30, true);

                $('.ui-search-input').show();
            } 
             else 
            {
            }
        }
    }
);
    });
}
Привет, ребята, спасибо за ваше предложение :) :)
5

что понимаю вашу проблему и нахожу ваш вопрос интересным, поэтому я написал для вас демо, в котором показано, как можно решить проблему.

columnChooser использует внутренний модуль jQuery UI Multiselect, который использует jQuery UI Sortable. Поэтому я предлагаю использоватьsortreceive Событие jQuery UI Сортируемый, чтобы поймать необходимую информацию.

Код может быть следующим

$("#grid").jqGrid('navButtonAdd', '#pager', {
    caption: "",
    buttonicon: "ui-icon-calculator",
    title: "Choose columns",
    onClickButton: function () {
        $(this).jqGrid('columnChooser');
        $("#colchooser_" + $.jgrid.jqID(this.id) + " ul.selected")
            .bind("sortreceive", function (event, ui) {
                alert('column "' + ui.item.text() + '" is choosed');
            });
        $("#colchooser_" + $.jgrid.jqID(this.id) + " ul.available a.action")
            .click(function () {
                alert('column "' + $(this).parent().text() + '" is choosed');
            });

    }
});

Посмотреть демоВот.

Код привязать "нажмите" событие на & quot; + & quot; дляinitial список столбцов, который был в окне выбора столбцов во время инициализации диалога. , что это будет достаточно для вас. При необходимости вы можете легко изменить код, чтобы он поддерживал & apos; click & apos; на "+" для столбцов, которые будут удалены из левого списка при работе сcolumnChooser.

Я почти забыл упомянуть, что я использовал в демо-версии улучшеннуюcolumnChooser (увидетьответ), но мое предложение выше работает с оригинальной версиейcolumnChooser тоже.

Какие плагины javascript необходимы для этого?
Я использовал то же самое, но теперь это не показывает правильный путь. Он показывает очень большие столбцы, а не несколько вариантов. Пожалуйста, предоставьте пример кода с полной функциональностью, если у вас есть.
Спасибо, Олег. Это потрясающе. kmk
@kmk: Добро пожаловать!
@BhavikAmbani: каталогplugins jqGrid содержитui.multiselect.css а такжеui.multiselect.js которые необходимы. Кроме того, требуется также jQuery UI.

Похожие вопросы