如何在Extjs中突出显示网格中的行

n1bvdmb6  于 2023-03-08  发布在  其他
关注(0)|答案(1)|浏览(186)

在extjs中,我如何通过提供网格和行的详细信息来突出显示网格中的一行。如果没有,请提供其他方法来实现。

mygrid.getSelectionModel().selectRows(array,keep current selections);

上面的代码行选择并高亮显示它的默认颜色。有没有办法自定义它的颜色?

qacovj5a

qacovj5a1#

我不确定您是想通过选择一行来突出显示它,还是只突出显示它而不选择它。
下面的文章包含了您应该了解的关于ExtJS样式网格的几乎所有内容:http://skirtlesden.com/articles/styling-extjs-grid-cells
在“设置行样式”下显示:
在很多情况下,一行的样式取决于该行的数据,这些数据由存储中的记录表示,我们可以使用配置选项getRowClass根据记录向元素添加CSS类:

Ext.create('Ext.grid.Panel', { 
    ... 
    viewConfig: { 
        stripeRows: false, 
        getRowClass: function(record) { 
            return record.get('age') < 18 ? 'child-row' : 'adult-row'; 
        } 
    } 
});

使用自定义CSS:

.child-row .x-grid-cell { 
    background-color: #ffe2e2; 
    color: #900; 
} 

.adult-row .x-grid-cell { 
    background-color: #e2ffe2; 
    color: #090; 
}

不知道这是否是你正在寻找的,但你可以看看完整的文章,我相信你找到你的问题的答案在那里。
通过在网格上定义某个bodyCls(例如bodyCls:"mygrid")和相应的自定义样式,也完全可以仅自定义某个网格中所选行的颜色:

.mygrid .x-grid-item-selected .x-grid-cell {
    background-image:none;
    background-color:#fc0;
}

相关问题