EditorGridPanel关于时间格式[GTM格式]的初始，编辑

在EXT中经常会遇到时间格式的初始化，编辑，保存的情况，其中时间格式也有精确度不同。下面介绍一下工作中遇到的一点问题及解决方法：[用到的控件为DateTimeField,为一个扩展控件，可以去网上下，也可以在我的资源里找，可以精确到秒]

如下图，是一个简单的EditorGridPanel，里面最后一列需要初始化一个时间格式的字段。



按平时正常的写法应该如下：

var sm = new Ext.grid.CheckboxSelectionModel();
sm.handleMouseDown=Ext.emptyFn;
var store= new Ext.data.JsonStore({
url: 'xxx.aspx',
root: 'data',
autoLoad:true,
fields:   ['BMMC','ZXRY','LXDH1','DDSJ']
});

var menuCM = new Ext.grid.ColumnModel({
defaults: {
sortable: false
},
columns: [
sm,
{header: "名称", width: 150,   dataIndex: 'BMMC'},
{header: "执行人员", width: 60,dataIndex: 'ZXRY'},
{header: "办公电话", width: 125,dataIndex: 'LXDH1'},
{header: "到达时间", width: 125,
dataIndex: 'DDSJ',
renderer: Ext.util.Format.dateRenderer('Y-m-d H:i:s'),
editor: new Ext.ux.form.DateTimeField({
format:'Y-m-d H:i:s',
anchor:"99%"
})}
]
});

var menuGrid = new Ext.grid.EditorGridPanel({
border: true,
frame: true,
title:'测试',
id:'menuGrid',
renderTo:'Div',
columnLines: true,
clicksToEdit:1,
store:store,
cm: menuCM,
sm:sm,
width:500,
height: 565,
collapsible: false,
animCollapse: false,
});

或者是这样：

var sm=new Ext.grid.CheckboxSelectionModel();
sm.handleMouseDown=Ext.emptyFn;

var reader = new Ext.data.JsonReader({
idProperty:'ZJBH',
fields: [
{name:'xxx', type:'xxx'},
{name:'DDSJ',type:'date'}
],
root:'data'
});
xxxxGrid= new Ext.grid.EditorGridPanel({
renderTo:'DIV',
columns: [
sm,
{
id: 'xx',
header: 'xx,
width: 50,
sortable: true,
dataIndex: 'XM',
hideable: false
}
,{
id: 'DDSJ',
header: '到达时间',
width: 80,
height:23,
sortable: true,
dataIndex: 'DDSJ',
renderer: Ext.util.Format.dateRenderer('Y-m-d H:i:s'),
editor: new Ext.ux.form.DateTimeField({
format:'Y-m-d H:i:s',
anchor:"99%"
})
}
],

frame: true,
columnLines: true,
width: 500,
height: 565,
clicksToEdit: 1,
});
xxxxGrid.getForm().load({url:'xxx'waitMsg:'Loading'});

这样的写法感觉应该没错，在ColunmModel里初始数据信息，时间格式的信息也会在renderer被格式化，但实际上显示的结果却并并不是时间格式的，而是“NaN-NaN-NaN”，这是为什么呢。原因如下：

　让我们来看看Ext.format.dateRenderer的源代码：

//////////////////////////////////////////////////////////////
dateRenderer : function(format) {
return function(v) {
return Ext.util.Format.date(v, format);、
}
}

////////////////////////////////////////////////////////////

我们从后台传来的值[字符串又被格式化了一次]，因为传来的值已经是字符串格式，不是时间格式的，所有会出现此问题。

修改：如果只是单纯的显示的话，只需要把第二种方法中的Jsonreader中的字段的类型 type:'date' 修改成 type:'string'这样就可以了，可以正确的时间格式了。

////////////////////////////////////////////////

但这是一个EditorGridPanel,还需要对时间进行编辑。选择了时间编辑器以后，如下图：



选择完成之后，会显示如下格式的时间字段：Fri Aug 28 09:37:46 GMT + 0008[GMT时间格式]，这是因为在renderer的对时间进行格式化时候出现了问题，因为从后台的时候不需要格，从时间编辑器里传值的时候需要格，有一个矛盾的过程，其实修改一下renderer属性即可：

renderer:function(value){
if(value instanceof Date){
return new Date(value).format("Y-m-d H:i:s");
}else{
return value;
}
}

对传的值进行一下判断！~~然后确定需要不需要格。

备注：不知道为什么，显示时间格式是正确，往后台传值保存的时候，却又是GMT时间格式的，需要在后台对那个GMT时间格式的字符串进行一个判断格式为正确的时间格式（y:M:d hh:mi:ss）:

//反UTC格式转换成DATETIME格式
public string GetDateTime(string str)
{
if (!string.IsNullOrEmpty(str) && str != "null" && str.IndexOf("U") != -1)
{
str = str.Replace("UTC ", "+");
CultureInfo cultureInfo = CultureInfo.CreateSpecificCulture("en-US");
string format = "ddd MMM d HH:mm:ss zz00 yyyy";
DateTime datetime = DateTime.ParseExact(str, format, cultureInfo);
str = datetime.ToString();
}
else
{
str = DateTime.Now.ToString();
}
return str;
}