jqGrid: условно скрыть / показать содержимое столбца ** на строку **

Есть ли способ нацелить столбец в jqGrid (в моем случае, Struts2-jQuery-Grid Plugin 3.7.0) только на определенные строки?

Например, я хочу показать содержимое 2-го столбца, только если значение 1-го столбца равно Movie:

 _______________________________________________________
|       COL 1       |               COL 2               |
|===================|===================================|
|   Movie           | bla bla yada yada                 |
|-------------------|-----------------------------------|
|   Song            |                                   |
|-------------------|-----------------------------------|
|   Clip            |                                   |
|-------------------|-----------------------------------|
|   Movie           | foo or bar that is the question...|
|-------------------|-----------------------------------|
|   Game            |                                   |
|___________________|___________________________________|

Я пытался использовать условные выражения OGNL в hidden а также cssClass поля GridColumnTag, но сразу заметили, что они оцениваются один раз по всему столбцу, а не на каждой "итерации".

В качестве обходного пути, я могу вручную скрыть столбцы в этих строках с помощью javascript после заполнения сетки, но это хак, и мне интересно, есть ли чистое решение для условной "что-то сделать" для столбцов в строке,

ПРИМЕЧАНИЕ: я не могу просто стереть контент из источника List (как это было бы очевидно), потому что COL 2 в моем реальном случае является Boolean в виде checkbox,

2 ответа

Решение

Есть много способов, как вы можете выполнить требование. Одним из самых простых является настройка color: transparent; CSS на ячейках, которые нужно скрыть. Например, вы определяете правило CSS

.hiddenCell { color: transparent; }

и вы назначаете класс hiddenCell к указанным ячейкам "COL 2". Ты можешь использовать cellattr Свойство "COL 2" для него:

cellattr: function (rowId, val, item) {
    if (item.sent) {
        return " class='hiddenCell'";
    }
}

Демо демонстрирует подход. Недостаток подхода - скрытый текст все еще существует на HTML-странице, поэтому его можно проверить при необходимости.

Другой способ - использование пользовательских форматеров. Например, вы можете определить следующее formatter Перезвоните

formatter: function (cellValue, options, item) {
    return item.sent ? "" : $.jgrid.htmlEncode(cellValue);
}

Демо демонстрирует второй подход. Недостаток подхода - немного сложно совместить использование собственного форматера с другим форматером (например, formatter: "select" в приведенном выше примере). Тем не менее, это тоже можно сделать:

formatter: function (cellValue, options, item, action) {
    return item.sent ?
        "" :
        $.fn.fmatter.call(
            this,
            "select",
            cellValue,
            options,
            item,
            action);
}

как следующая демонстрация.

Если вы загружаете данные с сервера, то, вероятно, лучшим выбором будет изменение входных данных (входных данных для столбца "COL 2") внутри beforeProcessing Перезвоните. Смотрите ответ или этот для примеров кода.

Для записей решение для (поддельного) сценария, описанного в вопросе (с использованием плагина Struts2-jQuery-Grid вместо необработанного jqGrid), будет следующим:

<script>
   function conditionalFormatter(cellValue, options, rowObject) {
       return rowObject.type!="Movie" ? "&nbsp;" : $.jgrid.htmlEncode(cellValue);
   }
</script>

<s:url id="remoteurl" action="myStrutsAction" namespace="/myNamespace" />

<sjg:grid href="%{remoteurl}" dataType="json"  gridModel="gridModel" >
    <sjg:gridColumn title="Col 1" name="type" />
    <sjg:gridColumn title="Col 2" name="foo" formatter="conditionalFormatter" />
</sjg:grid>
Другие вопросы по тегам