だから私はこれについて何も見つけられないようですが、なぜそれが起こっているのかわからないように見える奇妙なクロスブラウザの問題があります. 特定の日付を引き戻すことになっている日付フィールドがあります。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'
}
}
});