Ext grid 改變行背景色
阿新 • • 發佈:2018-12-22
有時候我們會要求改變grid的某一行背景顏色,根據特定的條件,這時候可以用viewConfig這個方法。
Ext.util.CSS.createStyleSheet('.ts {background:#9a9a9bc2;}');//單獨建立css樣式
{
xtype: 'gridbase',
region: 'north',
title: '不含增值稅(單位:萬元)',
titleAlign: "center",
dockedItems: [
{
xtype: 'toolbar' ,
weight: -10,
items: [
{
xtype: 'mybutton',
btnType: 'winsave',
handler: Ext.bind(me._save, me)
}
]
}
],
id: 'grid1' ,
plugins: [Ext.create('Ext.grid.plugin.CellEditing', {clicksToEdit: 1})],
store: _store1,
pagingtoolbar: false,
isLineFeed: true,
viewConfig: {
getRowClass: function (record, rowIndex , rowParams, store) {
//設定條件,然後返回想展示的樣式
if (rowIndex === 1 || rowIndex === 3) {
return 'ts';//樣式名字
} else {
return ""
}
}
},
columns: {
defaults: {
align: 'center',
sortable: false,
flex: 1,
minWidth: 100,
menuDisabled: true,
defaults: {
sortable: false,
menuDisabled: true,
flex: 1,
minWidth: 150,
align: 'center',
editor: {
hideTrigger: true,
xtype: 'numberfield'
}
}
},
items: []//表頭
},