extjs中gridpan在编辑的时候,如果使用的是日期控件,就会出一些问题,比如如下的代码中,按照一般的方式书写
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
var celledit=Ext.create("Ext.grid.plugin.CellEditing",{ clicksToEdit:1 }); Ext.define("UserModel",{ extend:"Ext.data.Model", fields:[{ name:"username",type:"string" },{ name:"birthday",type:"date" }] }); var userstore=Ext.create("Ext.data.Store",{ model:"UserModel", data:[{ username:"展博", birthday:"1986-06-23" }] }); var grid=Ext.create("Ext.grid.Panel",{ store:userstore, columnLines:true, 580, title:"可编辑的日期", renderTo:Ext.getBody(), viewConfig:{stripeRows:true}, columns:[Ext.create("Ext.grid.RowNumberer"), { text:"姓名", dataIndex:"username", 80, editor:{ xtype:"textfield" } },{ text:"生日", dataIndex:"birthday", 450, editor:{ xtype:"datefield" } }], plugins:celledit });
呈现出来如下:
日期不对,后来在编辑的生日列中加入 renderer: Ext.util.Format.dateRenderer('Y-m-d'),
显示正常了
可编辑生日列的时候就成下面的了
在编辑生日列中加入下面代码
editor:{
xtype:"datefield",
format:"Y-m-d"
},
不错,又可以了
但是点击编辑,但是不编辑,还会有一个更改的红点如下:
为啥呢?肯定是编辑时候的数据和编辑之前的数据不一样的嘛,后来发现确实是这样,如果把生日的原始的数据变为1986-06-23 00:00:00就可以了,嗯,不错,所有的 问题都解决了