如何使用选择编辑类型和没有自定义格式化程序有条件地对列进行着色

时间:2017-10-18 08:33:28

标签: drop-down-menu jqgrid jqgrid-formatter

我想用select edit-type有条件地对列文本进行着色。如果我使用自定义格式化程序,则值会更改。下面是我的代码片段,它不起作用,

    function generateEventHandlerGrid(eventsJson){
        var eventGrid = $("#eventGrid");
           eventGrid.jqGrid({
               datatype: 'local',
               data: eventsJson.eventInfo,
             jsonReader: {repeatitems: false},
    colNames: ['Event Category', 'Event Creation'],
{name: 'eventCategory', index: 'eventCategory',align:"center"},
{name: 'enabled', index: 'enabled', width:"100px",align:"center",editable:true,edittype: 'select',
                 editoptions: {value: "1:Enable;0:Disable"}, formatter: function ( cellvalue, options, rowObject ){
                    if (rowObject.enabled == 1){
                       var cellHtml = "<span style='color:" + "red" + "' originalValue='" + rowObject.enabled + "'>" + "Enable" + "</span>";
                       return cellHtml;
                    }else{
                       var cellHtml = "<span style='color:" + "green" + "' originalValue='" + rowObject.enabled + "'>" + "Disable" + "</span>";
                       return cellHtml;
                    }
                 }}],
    viewrecords: true,
    gridview: true,
    rownumbers: true,
    shrinkToFit: false,
               height: strMinimumHeight,
               editurl: "clientArray",
               restoreAfterSelect: false,
               loadonce: true,
    }

如何在没有自定义格式化程序的情况下根据值设置文本颜色?

1 个答案:

答案 0 :(得分:1)

自定义格式化程序的目标是格式化单元格的内容。您在当前代码中尝试执行的操作是在单元格中的外部DOM元素上设置style 属性。最好的功能是cellattr回调。因此,您仍然可以使用某些格式化程序,例如,将内容格式化为日期,并仍设置一些样式或类,这样可以更改单元格的属性。

cellattr回调的确切参数列表取决于您使用的jqGrid的版本和分支。您可以尝试使用以下代码将formatter替换为cellattr

cellattr: function (rowid, cellValue, rowData, cm, item) {
    return " style='color:" + (rowData.enabled == 1 ? "red" : "green") + "'";
}