jqgrid: multiselect и отключить проверку (условно)

18


Я люблю jqGrid, но иногда вещи кажутся более сложными, чем они должны быть. То, что я хотел бы достичь, - это установить флажок в каждой строке, чтобы пользователь мог выбрать, какие строки будут отправляться / обрабатываться.
Мне нужно, однако, заблокировать некоторые флажки, потому что у пользователя нет полномочий на эту определенную строку, может быть.

Я попытался установить multiselect: true , а затем я попытался скрыть этот флажок:

loadComplete: function (data) {
    if (data.rows.length > 0) {
        for (var i = 0; i < data.rows.length; i++) {
            if (data.rows[i].cell[7] == 'false') {
                $("#jqg_OrdersGrid_" + data.rows[i].id).css("visibility", "hidden");
            }
        }
    }
},

, и он работает хорошо, но, тем не менее, .jqGrid('getGridParam', 'selarrrow') дает мне выбранные строки, даже если они не были проверены.
Есть ли другой способ иметь флажки, которые включены / отключены, и способ узнать, какие из них были проверены?

спасибо

    
задан LeftyX 10.03.2011 в 12:53
источник

5 ответов

30

Я бы предложил вам отключить некоторые флажки с возможностью выбора по отношению к атрибуту «disabled». Для полной реализации вам понадобится

  1. установить «отключено» внутри дескриптора события loadComplete
  2. дополнительно предотвращает выбор отключенных строк внутри обработчика beforeSelectRow
  3. для поддержки флажка «Выбрать все» в заголовке многоселекторного столбца реализуем обработчик onSelectAll , который фиксирует выбор отключенных строк.

В соответствующей демонстрации вы можете увидеть здесь . Наиболее важная часть кода:

var grid = $("#list10"), i;
grid.jqGrid({
    //...
    loadComplete: function() {
        // we make all even rows "protected", so that will be not selectable
        var cbs = $("tr.jqgrow > td > input.cbox:even", grid[0]);
        cbs.attr("disabled", "disabled");
    },
    beforeSelectRow: function(rowid, e) {
        var cbsdis = $("tr#"+rowid+".jqgrow > td > input.cbox:disabled", grid[0]);
        if (cbsdis.length === 0) {
            return true;    // allow select the row
        } else {
            return false;   // not allow select the row
        }
    },
    onSelectAll: function(aRowids,status) {
        if (status) {
            // uncheck "protected" rows
            var cbs = $("tr.jqgrow > td > input.cbox:disabled", grid[0]);
            cbs.removeAttr("checked");

            //modify the selarrrow parameter
            grid[0].p.selarrrow = grid.find("tr.jqgrow:has(td > input.cbox:checked)")
                .map(function() { return this.id; }) // convert to set of ids
                .get(); // convert to instance of Array
        }
    }
);

ОБНОВЛЕНО: Бесплатный jqGrid поддерживает обратный вызов hasMultiselectCheckBox , который можно использовать для создания multiselect не для всех строк jqGrid. Для отключения некоторых строк можно использовать rowattr . В результате вы получите более описанную выше функциональность. Рекомендуется дополнительно использовать опцию multiPageSelection: true для бесплатного jqGrid с локальными данными ( datatype: "local" или loadonce: true ). Опция multiPageSelection: true будет удерживать массив selarrrow в пейджинге. Он позволяет «предварительно выбрать» несколько строк, заполнив соответствующие идентификаторы в selarrrow . См. ОБНОВЛЕНО часть ответа и с демо для Дополнительная информация.

    
ответ дан Oleg 10.03.2011 в 15:14
источник
  • Спасибо, Олег. Всегда профессионально в ваших ответах ;-) Мне нравится, что ваш код дополнен пользовательскими примерами. На самом деле, я все же хотел бы иметь возможность выбрать строку, вызывающую для меня тот факт, что строка проверена, не имеет ничего общего с выбором. Я нашел работу. Я покажу вам код. –  LeftyX 10.03.2011 в 15:27
  • Я ответил на свой вопрос, но я не буду его принимать. Это нечестно. Постарайся посмотреть, что ты думаешь, и я приму твою. –  LeftyX 10.03.2011 в 15:34
  • @LeftyX: код выглядит нормально. Любые оптимизации могут быть не нужны, если в ваших сетках будет несколько строк. –  Oleg 10.03.2011 в 15:55
  • Для меня, onSelectAll по-прежнему кажется, что выбирает строку (даже с / до beforeSelectRow), хотя beforeSelectRow, похоже, не позволяет выбрать строку при щелчке. –  Ron Garrity 08.02.2012 в 19:34
  • @RonGarrity: в каком веб-браузере вы тестируете демонстрацию и сможете выбрать заблокированные строки? –  Oleg 08.02.2012 в 20:40
Показать остальные комментарии
5

Отличный ответ от Олега, я бы добавил код для отмены выделенных строк, выполнив следующую функцию onSelectAll.

onSelectAll: function(aRowids,status) {
    if (status) {
        // uncheck "protected" rows
        var cbs = $("tr.jqgrow > td > input.cbox:disabled", grid[0]);
        cbs.removeAttr("checked");

        //modify the selarrrow parameter
        grid[0].p.selarrrow = grid.find("tr.jqgrow:has(td > input.cbox:checked)")
            .map(function() { return this.id; }) // convert to set of ids
            .get(); // convert to instance of Array

        //deselect disabled rows
        grid.find("tr.jqgrow:has(td > input.cbox:disabled)")
            .attr('aria-selected', 'false')
            .removeClass('ui-state-highlight');
    }
}
    
ответ дан Sergio Espallargas 24.10.2014 в 17:54
источник
3

Для людей (таких как я), которые попадают в этот ответ после поиска в Google, это очень простое решение этой проблемы, поскольку jqGrid 4.0.0.

Достаточно добавить в строку, которую вы не хотите выбирать, в класс «ui-state-disabled» css-класса. См. Список изменений jqGrid 4.0.0 . И вы все равно можете объединить это со скрытием или отключением флажка.

    var $jqgrid = $("#jqgridselector");         
    //loop through all rows
    $(".jqgrow", $jqgrid).each(function (index, row) {
        var $row = $(row);
        if ($row === condition) {
            //Find the checkbox of the row and set it disabled
            $row.find("input:checkbox").attr("disabled", "disabled");
            //add class ui-state-disabled, because thats how jqGrid knows not to take them into account for selection
            $row.addClass("ui-state-disabled");
            //I overwrite the opactity of the ui-state-disabled class to make the row look 'normal'
            $row.css("opacity", 1);
            }
        });
    
ответ дан cverb 19.01.2015 в 12:44
источник
2

Я нашел работу. Во время события loadComplete я отключу флажок SelectAll: мне это не нужно. Я также скрываю флажок и отключает его.

loadComplete: function (data) {
    $("#cb_OrdersGrid").css("visibility", "hidden");
    if (data.rows.length > 0) {
        for (var i = 0; i < data.rows.length; i++) {
            if (data.rows[i].cell[7] == 'false') {
                $("#jqg_OrdersGrid_" + data.rows[i].id).css("visibility", "hidden");
                $("#jqg_OrdersGrid_" + data.rows[i].id).attr("disabled", true);
            }
        }
    }
}

Теперь, когда я хочу отправить свои данные, я просматриваю выбранные строки и проверяю, были ли они отключены и помещены те, которые включены в новый массив.

var selectedRows = myGrid.jqGrid('getGridParam', 'selarrrow');
var checkedRows = [];
var selectionLoop = 0;
for (var x = 0; x < selectedRows.length; x++) {
    var isDisabled = $('#jqg_OrdersGrid_' + selectedRows[x]).is(':disabled');
    if (!isDisabled) {
        checkedRows[selectionLoop] = selectedRows[x];
        selectionLoop++;
    }
}

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

    
ответ дан LeftyX 10.03.2011 в 15:33
источник
2

Я использую jqGrid 4.4.4, и мне пришлось немного настроить LoadfyX loadComplete.

            loadComplete: function(data) {
                for (var i = 0; i < data.rows.length; i++) {
                    var rowData = data.rows[i];
                    if (rowData.cell[6] != null) {//update this to have your own check
                        var checkbox = $("#jqg_list_" + rowData.i);//update this with your own grid name
                        checkbox.css("visibility", "hidden");
                        checkbox.attr("disabled", true);
                    }
                }
            }
    
ответ дан jhilden 04.03.2013 в 19:51
источник