Extjs单元格的样式设计

单元格的设定都是在header里面进行属性设置{header，属性值}属性1：渲染：使用renderer属性进行配置。可改变字体，为单元格添加图片改变格式等。renderer:function(value){return 语句};或者renerder:自定义函数 value代表：单元格中的文本改变字体的颜色加粗:return '<span style="color:green">' + "<b>" + value + "</b>"+ '</span>';在单元格中插入图片:return "<img src='add24.gif' />" + value;基本上都可以返回一个Html Css语句使用:Ext.grid.column.Column中的configs所有属性进行配置 常用属性2.设定单元格的编辑模式：cellModel 单元格选择 rowModel行选择

plugins: [
Ext.create('Ext.grid.plugin.CellEditing', {
clicksToEdit: 1//单击一次
})
],

3.编辑 设定了编辑模式之后，在将单元格设置文本区域即可 field代表选择当前列的所有单元格 field:'textfield' ‘datefield’ 也可以使用

editor属性对单元格编辑editor: {
xtype: 'numberfield',
allowBlank: false,
minValue: 0,
maxValue: 100000
}

如上可以指定编辑器的类型textfield    numberfield   combobox   datefield  checkcolumn

combobox

4.dockedItems: [{xtype: 'pagingtoolbar',store: store, // GridPanel使用相同的数据源dock: 'bottom',displayInfo: true}],实现滚动翻页使用事件型列：{

xtype: 'actioncolumn',//定义一个事件列

items:

[

{

图标

handler:单击时触发的事件

}，

{

图标

handler:单击时触发的事件

}

]

}

{

图标

handler:单击时触发的事件

}