【发布时间】：2012-10-22 21:12:01
【问题描述】：
所以我似乎在这方面找不到任何东西，但我遇到了一个奇怪的跨浏览器问题，我似乎无法找出它发生的原因。我有一个应该拉回某个日期的日期字段。在 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'
}
}
});
【问题讨论】：
-
另外，如果你们想要任何特定的代码，请告诉我。我不知道在这种情况下显示什么是有益的，因为它只是我从资源中提取的标准日期字段......
-
它是如何拉日期的？它是什么格式的？它是通过模型来的吗？你是如何设置值的？
-
问题是这发生在超过 1 个地方。我们在使用'Y-d-m'的'submitFormat'作为我们的PHP后端的日期字段输入框中设置值。当我们提取数据时，我们只使用默认格式/altFormat。我们正在通过模型提取数据。当我们得到结果时，我们肯定会从后端返回正确的数据，但由于某种原因，只有 chrome 会渲染细节，而其他的则不会。对于网格，我们只需关联正确的商店，并且（如果我理解正确的话）商店会相应地填充网格。我们还在其他地方使用记录。
-
仅供参考，上面的意思是“发布一些代码”... ;)
-
大声笑我想我只是不知道你想要什么部分，因为它发生在多个位置。这是我的第一个 ExtJS 应用程序 =/ 不过我会发布一些内容。让我知道这是否还不够和/或您是否想要更多。
标签： extjs cross-browser extjs4.1 datefield