jqGrid，在单击列标题时在列单元格上设置bg颜色 [英] jqGrid, setting bg color on column cells when column header is clicked

问题描述

我正在使用jgGrid 3.8.我有一个问题.单击列标题时，我想为单元格的背景着色.我的意思是，数据bg的升序或降序颜色必须与其他列单元格的颜色不同.我怎样才能做到这一点?

I am using jgGrid 3.8. I have an issue. I want to color the background of cells, when the column header is clicked. I mean, ascending or descending datas bg colors must be different color of other column's cells. How can I do that?

非常感谢您.

推荐答案

您可以使用 loadComplete 事件句柄.在排序后的数据之后将调用事件 loadComplete 将在数据分页后加载，因此是根据当前排序顺序更改单元格背景颜色的好地方:

You can use setCell method inside of loadComplete event handle. The event loadComplete will be called after the sorted data will be loaded and after the data paging so it is a good place to change the background color of cells based on the current sort order:

loadComplete: function() {
    var ids = grid.jqGrid('getDataIDs');
    if (ids) {
        var sortName = grid.jqGrid('getGridParam','sortname');
        var sortOrder = grid.jqGrid('getGridParam','sortorder');
        for (var i=0;i<ids.length;i++) {
            grid.jqGrid('setCell', ids[i], sortName, '', '',
                        {style:(sortOrder==='asc'?'background:aqua;':
                                                  'background:yellow;')});
        }
    }
}

一个执行该操作的示例，您可以在

A working example which do this you can see live here.

已更新:查看修改后的演示也.结果看起来像上一个演示中的更好:

UPDATED: Look at the modified demo also. The results seems look more nice as in the previous demo:

它在除Opera之外的所有浏览器中显示渐变效果.在歌剧中，它与先前的演示相同.在另一个我的 answer 中，我玩还有更多的颜色渐变效果.

It shows gradient effect in all browsers excepting opera. In opera it is the same as the previous demo. In another my answer I play more with the color gradient effects.

这篇关于jqGrid，在单击列标题时在列单元格上设置bg颜色的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！