所以我似乎无法在此找到任何内容，但我有一个奇怪的跨浏览器问题，我似乎无法找出它为什么会发生。我有一个应该撤回某个日期的日期字段。在Chrome中，日期显示，而在FF和IE中则显示日期。
奇怪的是，我查看了从后端返回的数据，日期就在那里，它只是设置输入的值（也不是我们要求提取数据的任何位置。甚至没有网格）
我有什么遗漏会让它在Chrome中正常显示但在FF和IE中没有显示吗？也许在商店或模特中有什么东西？
我正在使用ExtJS 4.1.2以防有助于回答问题
查看（网格）
Ext.define('MyApp.view.ContractGrid', {
extend: 'Ext.grid.Panel',
alias: 'widget.ContractGrid',
height: 443,
id: 'contractgrid',
itemId: '',
width: 667,
title: 'Contract Search',
store: 'ContractStore',
initComponent: function() {
var me = this;
Ext.applyIf(me, {
columns: [
{
xtype: 'gridcolumn',
dataIndex: 'ContractNumber',
text: 'Contract #'
},
{
xtype: 'datecolumn',
hidden: false,
dataIndex: 'LicenseDate',
text: 'License Date'
},
],
viewConfig: {
},
selModel: Ext.create('Ext.selection.RowModel', {
}),
dockedItems: [
{
xtype: 'toolbar',
dock: 'top',
items: [
{
xtype: 'button',
text: '+ New Contract',
listeners: {
click: {
fn: me.onButtonClick,
scope: me
}
}
}
]
}
]
});
me.callParent(arguments);
},
});
查看（面板）
Ext.define('MyApp.view.ContractPanel', {
extend: 'Ext.panel.Panel',
alias: 'widget.ContractPanel',
requires: [
'MyApp.view.ModuleTabs'
],
draggable: false,
height: 804,
id: 'contractpanel',
autoScroll: true,
layout: {
type: 'absolute'
},
manageHeight: false,
initComponent: function() {
var me = this;
Ext.applyIf(me, {
items: [
{
xtype: 'form',
border: 0,
height: 350,
itemId: 'ContractForm',
maxHeight: 400,
width: 1060,
layout: {
type: 'absolute'
},
bodyPadding: 10,
manageHeight: false,
items: [
{
xtype: 'panel',
border: 0,
height: 310,
margin: '',
minWidth: 450,
padding: '',
width: 480,
layout: {
type: 'absolute'
},
manageHeight: false,
items: [
{
xtype: 'textfield',
x: 0,
y: 0,
disabled: true,
margin: '',
padding: 5,
width: 236,
name: 'id',
fieldLabel: 'Contract ID',
labelWidth: 110
},
{
xtype: 'textfield',
x: 0,
y: 30,
margin: '',
padding: 5,
width: 236,
inputId: '',
name: 'ContractNumber',
fieldLabel: 'Contract Number',
labelWidth: 110
},
{
xtype: 'datefield',
x: 0,
y: 190,
padding: 5,
width: 210,
name: 'LicenseDate',
fieldLabel: 'License Date',
labelWidth: 110,
submitFormat: 'Y-d-m'
},
]
}
]
},
{
xtype: 'ModuleTabs',
id: 'ModuleTabs',
x: 0,
y: 360
}
]
});
me.callParent(arguments);
});
存储
Ext.define('MyApp.store.ContractStore', {
extend: 'Ext.data.Store',
alias: 'store.ContractStore',
requires: [
'MyApp.model.ContractModel'
],
constructor: function(cfg) {
var me = this;
cfg = cfg || {};
me.callParent([Ext.apply({
autoLoad: true,
autoSync: true,
remoteFilter: true,
remoteSort: true,
storeId: 'contract',
model: 'MyApp.model.ContractModel',
buffered: true,
pageSize: 200,
listeners: {
write: {
fn: me.onStoreWrite,
scope: me
}
}
}, cfg)]);
}
});
模型
Ext.define('MyApp.model.ContractModel', {
extend: 'Ext.data.Model',
alias: 'model.ContractModel',
uses: [
'MyApp.model.ModuleModel'
],
idProperty: 'id',
fields: [
{
name: 'id',
type: 'int'
},
{
name: 'ContractNumber',
type: 'string'
},
{
name: 'LicenseDate',
type: 'date'
}
],
hasMany: {
model: 'MyApp.model.ModuleModel',
foreignKey: 'contract_id',
name: 'modules'
},
proxy: {
type: 'direct',
api: {
create: contract.createRecord,
read: contract.getResults,
update: contract.updateRecords,
destroy: contract.destroyRecord
},
reader: {
type: 'json',
root: 'data'
}
}
});
答案 0 :(得分：1)
您的问题是您没有在模型上指定dateFormat。由于您不这样做，因此将转到本机JS Date.parse方法来创建日期。有些浏览器比其他浏览器更宽容他们接受的格式。
例如，在FF中比较这些：
console.log(Date.parse('2012-01-01'));
console.log(Ext.Date.parse('2012-01-01', 'Y-m-d'));
长话短说，在模型上指定一个dateFormat，这样你就不会把它留给浏览器如何解析日期。
来自文档：
在将接收的数据转换为类型为的日期时使用 指定为“日期”。
序列化日期字段以供使用时，也会使用格式字符串 作家。
Ext.Date.parse函数的格式字符串，如果是，则为“timestamp” Reader提供的值是UNIX时间戳，如果是，则为“time” Reader提供的值是一个javascript毫秒时间戳。 见Ext.Date。
请注意，虽然此配置是可选的，但它非常重要 将默认使用基本JavaScript Date对象的解析函数 如果没有指定，而不是Ext.Date.parse。这可能会导致 意外问题，特别是在时区之间转换时，或 转换未指定时区的日期时。该 本机Date.parse的行为是特定于实现的，并且 根据日期字符串的值，它可能会返回UTC 日期或当地日期。 因此强烈建议这样做 您在解析日期时始终指定明确的日期格式。
答案 1 :(得分：0)
尝试使用日期格式在模型中对日期字段进行整形，如下所示：
{name:'expectedCompleteBy', type:'date', mapping:'expectedCompleteBy', dateFormat:'Y-m-d'},
同样在您的网格中，您可以使用格式显示日期字段，如下所示：
xtype:'datecolumn', format:'Y-m-d', dataIndex:'expectedCompleteBy'
XTemplate也有特殊的日期功能：
{expectedCompleteBy:date("Y-m-d")}
以表格形式：
{ xtype:'datefield',
fieldLabel:'Need By Date',
name:'needByDate',
//submitFormat:'Y-m-d', defaults to format
format:'Y-m-d'
}