JQGrid: как установить стиль ячейки на основе содержимого - PullRequest
1 голос
/ 14 октября 2011

Я хочу установить цвет фона ячейки на основе содержимого ячейки.

Мой первый вопрос: есть ли способ установить цвет фона ячейки из данных XML?

Если нет, вот мое определение сетки:

$("#grid_sites").jqGrid({
    url:"getgridxmlsites.php?detailid=" + $('#hdnStudyDetailId').val(),
    datatype: "local",
    height: 160,
    width: 832,
    shrinkToFit: true,
    caption:"",
    colNames :["Site","Name","PI","Location","Phone","Status"],
    colModel :[
       {name:"sitenumber",  index:"sitenumber",  width:50,   align:"right"},
       {name:"name",        index:"name",        width:120},
       {name:"location",        index:"location",    width:100},
       {name:"phone",       index:"phone",       width:100},
       {name:"status",      index:"status",      width:70}
    ],
    pager:"pager_sites",
    scroll: 1,
    viewrecords:true,
    sortable:true,
    sortname: "sitenumber",
    autowidth: true,
    pgbuttons: false,
    loadonce: true,
    gridview: true
});

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

{name:"status",  index:"status",   width:70, formatter: statusFormatter}

function statusFormatter(cellvalue, options, rowObject)
{
   What exactly would go here for something like this:

   if (cellValue == 'Pending') change the cell's background color to yellow
   else if (cellValue == 'Approved') change the cells's background color to green;
}

Спасибо!

1 Ответ

1 голос
/ 14 октября 2011

Существует много способов сделать то, что вы хотите.В ответе вы найдете пример того, как использовать пользовательский форматер для изменения цвета фона ячейки в зависимости от ее содержимого.Ответ пишется до ввода атрибута cellattr.Основное назначение пользовательского форматера - создать HTML-содержимое ячейки на основе данных ячейки.

Атрибут cellattr, представленный как модификация мой запрос функции , имеет преимуществопотому что он позволяет только устанавливать / изменять атрибуты HTML-кода ячейки и использовать некоторый предопределенный форматер, такой как «число» или «выбор».Таким образом, вы можете просто установить атрибут class или style и одновременно использовать некоторый предопределенный форматер, который соответствует содержащимся данным.Посмотрите на этот ответ , который показывает, как динамически установить background-color более class и другой ответ , который показывает, как установить его на style.

Ответ Обсудите дополнительно преимущества и недостатки обоих подходов.

Еще одно замечание к вашему коду.Я не рекомендую использовать параметр url в форме

url:"getgridxmlsites.php?detailid=" + $('#hdnStudyDetailId').val()

. Он имеет два важных недостатка.Во-первых, $('#hdnStudyDetailId').val() может быть отправлено и декодировано на сервере неправильным способом, если в $('#hdnStudyDetailId').val() содержатся некоторые специальные символы ('', '+', '=', 'ä', 'д', ', ', ...).Вторая проблема заключается в том, что значение из '#hdnStudyDetailId' будет прочитано только один раз во время создания сетки.Таким образом, при любом обновлении таблицы, содержащей сортировку по другому столбцу, будет использоваться подкачка и т. Д. То же старое значение из элемента '#hdnStudyDetailId'.Я рекомендую вам прочитать ответ и использовать URL с параметрами url и postData:

url: "getgridxmlsites.php",
postData: {
    detailid: function() { return $('#hdnStudyDetailId').val(); }
}
...