Extjs 显示日期类型数据

2013年7月30日

11:24

首先我们定义类一组数据，其中最后一列是日期格式的数据，如下代码

步骤：

在定义列模型的时候在要处理日期的那一列添加:renderer:Ext.util.Format.dateRenderer('Y-m-d h:i:s');和type的属性
在数据中的日期需要符合对应的日期格式
在store当中定义reader是，需要加上dataFormat的属性

Ext.onReady(function(){

var cm = new Ext.grid.ColumnModel([

{header:'编号',dataIndex:'id',sortable:true},

{header:'名称',dataIndex:'name'},

{header:'描述',dataIndex:'descn'},

{header:'日期',dataIndex:'birthday',type:'date',renderer:Ext.util.Format.dateRenderer('Y-m-d h:i:s') ,200}

]);

var data = [

['1','name1','descn1','1970-01-15T02:58:04'],

['2','name2','descn2','1970-01-15T02:58:04'],

['3','name3','descn3','1970-01-15T02:58:04'],

['4','name4','descn4','1970-01-15T02:58:04'],

['5','name5','descn5','1970-01-15T02:58:04']

]

var store = new Ext.data.Store({

proxy:new Ext.data.MemoryProxy(data),

reader: new Ext.data.ArrayReader({},[

{name:'id',mapping:0},

{name:'name',mapping:1},

{name:'descn',mapping:2},

{name:'birthday',type:'date',dataFormat:'Y-m-dTH:i:s',mapping:3}

])

});

//只有load的时候数据才能够进行加载

store.load();

var grid = new Ext.grid.GridPanel({

renderTo:'grid',

store:store,

// enableColumnMove:false,

//enableColumnResize:false,//禁止拖放功能

stripeRows:true,

loadMask:true,

cm:cm,

600,

height:400,

viewConfig:{

forceFit:true

autoExpandColumn:'descn'

})

});

已使用 Microsoft OneNote 2013 创建。