Javascript Ext JS 网格行背景颜色集
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2154765/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Ext JS Grid Row Background Color Set
提问by williamtroup
How would I go about setting the background colour of an Ext JS Grid row, mainly just the selected item(s).
我将如何设置 Ext JS Grid 行的背景颜色，主要是选定的项目。
Any help would be greatly appreciated.
任何帮助将不胜感激。
回答by Brian Moeskau
To change the selected row color you have to override the appropriate CSS class:
要更改所选行的颜色，您必须覆盖相应的 CSS 类：
.x-grid3-row-selected {
background-color: red !important;
}
You could also override the default border-colorif you want using that class.
border-color如果您想使用该类，您也可以覆盖默认值。
The getRowClassfunction, on the other hand, is for adding a static CSS class to rows using business logic to determine which rows are affected. You could also achieve row coloring that way, but it would not affect highlighted row color (although you could also write CSS that used both classes together to do so).
getRowClass另一方面，该功能用于使用业务逻辑向行添加静态 CSS 类以确定哪些行受到影响。您也可以通过这种方式实现行着色，但它不会影响突出显示的行颜色（尽管您也可以编写同时使用这两个类的 CSS）。
EDIT: To change the row style programmatically you will still want to define your styles statically in CSS, then simply add/remove CSS classes dynamically as needed. E.g., assuming a grid and a button with id 'my-btn', clicking the button will add a class (could be defined just like .x-grid3-row-selected as shown above) to the first row in the grid, applying whatever style is in the CSS class. It's up to you to define your real business logic for selecting row(s), but this is the syntax:
编辑：要以编程方式更改行样式，您仍然需要在 CSS 中静态定义样式，然后根据需要动态添加/删除 CSS 类。例如，假设一个网格和一个 id 为“my-btn”的按钮，单击该按钮将向网格中的第一行添加一个类（可以像上面所示的 .x-grid3-row-selected 一样定义），应用CSS 类中的任何样式。由您来定义选择行的真实业务逻辑，但这是语法：
Ext.get('my-btn').on('click', function(){
Ext.fly(myGrid.getView().getRow(0)).addClass('error');
});
回答by Djumaka
@bmoeskau This thing you gave does not work with me. I rather use
@bmoeskau 你给的这个东西对我不起作用。我宁愿用
grid.getView().addRowClass(rowIndex, 'red');
inside the onDoubleClick function.
在 onDoubleClick 函数中。
