Выделите набор строк в GridPanel Ext.net (ExtJS)

Question

Требуется для выделения набора строк в цвете Ext.net gridPannel, который требуется для выделения

Текущий подход заключается в вызове нижеприведенной функции при рендеринге GridPannel:

 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); выбрал правильный различный цвет каждого цвета из GridPannel

Любой Хороший подход для этого?

Answer 1

Вы можете переопределить метод getRowClass в GridView.

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

Или, если вам нужно применить цвета после рендеринга, вы можете попробовать установить для каждой строки:

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

Примечание. Эти примеры основаны на API ExtJS 3.4, но я уверен, что в 4.0 есть что-то похожее.

Answer 2

С ExtJS 4 вы можете использовать метод выделение элемента строки записей в сеточном хранилище.

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();
});