在GridPanel Ext.net (ExtJS)中突出显示一组行

Highlight a set of Rows in GridPanel Ext.net (ExtJS)

本文关键字：显示 一组 Ext GridPanel net ExtJS      更新时间：2023-09-26

需要在Ext.net gridPannel颜色中突出显示一组行，需要突出显示

当前的方法是在渲染gridpanel时调用下面的函数:

 function (value, meta, record, rowIndex,columnIndex,store) 
    {
                    color= record.data["ColorValue"];
                    var style = document.createElement('style');
                    style.type = 'text/css';
                    style.innerHTML = '.cssClass'+rowIndex+' {   background color:'+color+'}';
                    document.getElementsByTagName('head')[0].appendChild(style);
                    grid.store.getAt(rowIndex).set("mySelected", "cssClass"+rowIndex);
    }

但是使用这种方法:它突出显示所有具有相同颜色的行 ..测试alert(color);从gridpanel

中获取每个颜色的正确不同颜色

你可以在GridView中重写getRowClass方法。

new Ext.grid.GridPanel({
    [...],
    viewConfig: {
        getRowClass: function(record, index, rowParams, store) { return 'some-class'; }
    }
});

或者如果您需要在渲染后应用颜色，您可以尝试为每行设置:

grid.getView().getRow(0).className += 'some-class';

注意:这个例子是基于ExtJS 3.4的API，但我打赌在4.0中有类似的东西。

在ExtJS 4中，您可以使用网格存储中记录的row元素的高亮方法。

var store = grid.getStore();
var view  = grid.getView();
var node;
store.each(function(record) {
    if (record.get('fieldname') !== 'your_condition') return;
    //Return the node given the passed Record, or index or node.
    node = view.getNode(record);
    if (!node) return;
    Ext.get(node).highlight();
});
相关文章：