Css 行上的Ext JS单击更改单击的行背景色

你好
我是ExtJS新手，我已经创建了网格，其中包含以下字段

columns: [
{
    header   : 'Firs name',
    width    : 200,
    sortable : true,
    dataIndex: 'firstName'
},
{
    header   : 'Last name',
    width    : 200,
    sortable : true,
    dataIndex: 'lastName'
},
{
    header   : 'Favourite color',
    width    : 195,
    sortable : true,
    dataIndex: 'favouriteColor'
}

],

值将在php中生成。
当用户双击任何一行时，我必须使该行的背景色变成用户最喜欢的颜色（红色、蓝色、黄色）。
到目前为止，我已经做到了

  grid.on('rowdblclick', function(grid,index,e) {
    alert(index);
  });

---

。。。我得到了单击行的索引，但我不知道如何更改其背景颜色。非常感谢您的帮助。

您需要使用GridView对象获取所选行的DOM。并在该行上应用您最喜欢的颜色的CSS。首先，您需要创建几个CSS类：

.redrow {
  background-color: red !important;
}

蓝色和黄色也一样。接下来，您需要获取该行并将CSS类添加到该行

grid.on('rowdblclick', function(grid,index,e) {
    var color = grid.getStore().getAt(index).get('favouriteColor');

    if(color == 'red')
       Ext.fly(grid.getView().getRow(index)).addClass('redrow');
    else if( color == 'blue')
       Ext.fly(grid.getView().getRow(index)).addClass('bluerow');
    .
    .
    .
});

---

如果试图根据FavoriteColor列更改网格行背景色，则需要使用其他技术。您可以使用ViewConfig并实现getRowClass方法，如下所示：

viewConfig: {
    forceFit: true,
    getRowClass: function(record, index,prarms,store) {
        var color = record.get('favouriteColor');
        if(color == 'red')
            return 'redrow';
        else if(color == 'blue')
            return 'bluerow';
        else if (color == 'yellow')
            return 'yellowrow';
        else
            return;         
    }
}

ViewConfig与网格声明一起使用。您不使用getRowClass的返回值。框架使用返回值。您只需要编写逻辑来为行选择正确的CSS类。如果需要在渲染网格时显示背景色，可以使用getRowClass方法。它不能在用户事件期间或网格渲染后使用

---

在您的情况下，您不需要此方法，因为当用户双击行时，您正在更改行的颜色，对吗？因此，您可以参考答案的第一部分，根据该行的FavoriteColor值更改该行的背景。

谢谢，但返回错误：Uncaught TypeError:Object#没有方法“addClass”-也会将每一行背景变为红色。。。但是我需要动态-如何“捕捉”用户最喜欢的颜色？您是否尝试使用FavoriteColor变量设置网格行颜色？谢谢，它现在正在更改类。---是的，“FavoriteColor”显示用户最喜欢的颜色（红色、绿色、蓝色、黄色），但不知道如何获取其值。请参阅回答问题的第二部分，但。。。将代码放在哪里以及如何使用getRowClass的值？。。。。。当用户双击时，是否有一种简单的方法可以获取行的“FavoriteColor”？