Ext给GridPanel上指定的行制定颜色

转载于 2013-09-09 15:34:38 发布 · 903 阅读

javascript 同时被 2 个专栏收录

311 篇文章

订阅专栏

EXT

192 篇文章

订阅专栏

本文介绍如何使用 ExtJS 的 GridPanel 组件，并通过 getRowClass 方法为不同条件的数据行设置不同的背景颜色。示例中展示了如何根据 'DayStore' 和 'XXX' 字段的值来更改行样式。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

InventoryGrid = new Ext.grid.GridPanel({
id: "InventoryGrid",
store: InventoryStore,
sm: sm,
cm: cm,
loadMask: true,
autoScroll: true,
stripeRows: true, //采取grid自动渲染，行列交错！
columnLines: true,
border: false,
viewConfig: {
//forceFit: true,
columnsText: "显示/隐藏列",
sortAscText: "正序排列",
sortDescText: "倒序排列",
/*根据条件改变要求行的背景色！
需要在主页面新建一个css例如：
<style type="text/css">
.my_row_style table{ background:Yellow}
</style>
然后用下面的方法便可以实现了！见API实例
*/
getRowClass: function (record, rowIndex, rowParams, store) {
if (record.data.DayStore <= "50") {
return "my_row_style";
}
if(record.get('XXX')=="0001010201") {
return 'yellow';
}else{
return 'blue';
}
}
},