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?

Thank you very much.

解决方案

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:

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屋！