突出显示栅格项选择的行和单元格

Question

是否有一种标准方式来突出显示网格中的活动行，如附加屏幕？

我的意思是有一个网格，与cellmodel选择类型，当点击网格中的项目，它突出显示单元格。我想在同一时间突出显示活动行。

当网格包含大量要分析的数据时， 选择单元格时会非常有用，并且需要突出显示整行（可能是列表？）。

Answer 1

感谢您的帮助球员。我们这样做:)这是一个可能的解决方案：

selModel: Ext.create('Ext.selection.CellModel', { 
    listeners: { 
     select: function (cellModel, record, rowIndex) { 
      var myGrid = this.items.get('gridItemId'); 
      myGrid.getView().addRowCls(rowIndex, 'row-style'); 
     }, 
     deselect: function (cellModel, record, rowIndex) { 
      var myGrid = this.items.get('gridItemId'); 
      myGrid.getView().removeRowCls(rowIndex, 'row-style'); 
     }, 
     scope: this 
    } 
}), 

Answer 2

即使你使用的是CellSelectionModel，你可以很容易地应用样式/班行所选单元格。如果你看看为CellSelectionModel的事件，你会看到cellselect实际上返回rowIndex。

cellselect：（selectionModel设置这个，数的rowIndex，数colIndex）

所以，你可以这样是像下面这样：

// we'll say you have your Grid stored in a variable, grid 
CellSelectionModel ...({ 
    listeners: { 
     'cellselect': function(selModel, rowIndex) { 
      var cellRow = grid.getView().getRow(rowIndex); 
      Ext.fly(cellRow).addClass('selectedRow') 
      // do any other logic with the actual DOM element here 
    } 
}) 

Answer 3

你可以使用添加CSS类到特定行的网格的addRowCls方法。

http://docs.sencha.com/ext-js/4-0/#/api/Ext.grid.View-method-addRowCls