У меня возникла проблема при динамическом добавлении вкладок в tabpanel в ext 3.4. Вот суть того, что происходит:Редактор ExtJs EditorGridPanel иногда не является обязательным редактором?
- создать вкладку Панель
- добавить вкладки с панелью редактора сетки с правильным редактором, определенным в модели столбца
- редактор связан с некоторыми полями на некоторых вкладках, но не все поля на всех вкладках
Кто-нибудь знает, в чем проблема?
Я создал следующий шлепнуть (очень простой вариант того, что я на самом деле делает): Fiddle Here
Ext.onReady(function() {
var scheduleRec = {
"Sunday":[{"StartTimeHours":0,"StartTimeMinutes":0,"EndTimeHours":0,"EndTimeMinutes":0}],
"Monday":[{"StartTimeHours":0,"StartTimeMinutes":0,"EndTimeHours":0,"EndTimeMinutes":0}],
"Tuesday":[{"StartTimeHours":0,"StartTimeMinutes":0,"EndTimeHours":0,"EndTimeMinutes":0}],
"Wednesday":[{"StartTimeHours":0,"StartTimeMinutes":0,"EndTimeHours":0,"EndTimeMinutes":0}],
"Thursday":[{"StartTimeHours":0,"StartTimeMinutes":0,"EndTimeHours":0,"EndTimeMinutes":0}],
"Friday":[{"StartTimeHours":0,"StartTimeMinutes":0,"EndTimeHours":0,"EndTimeMinutes":0}],
"Saturday":[{"StartTimeHours":0,"StartTimeMinutes":0,"EndTimeHours":0,"EndTimeMinutes":0}],
};
//Build a schedule array...
scheduleArray = [];
if (scheduleRec) {
for (srec in scheduleRec) {
if (scheduleRec.hasOwnProperty(srec)) {
if (typeof scheduleRec[srec] === 'object' && srec !== 'HolidaySets') {
scheduleArray.push([srec, scheduleRec[srec]]);
}
}
}
}
// simple array store
var comboStore = new Ext.data.ArrayStore({
fields: ['day', 'schedule'],
data: scheduleArray
});
var fm = Ext.form;
Ext.util.Format.timefieldRenderer = function(format) {
return function(v) {
if (v instanceof Date) {
return v.format(format);
} else {
return v;
}
};
};
var cm = new Ext.grid.ColumnModel({
defaults: {
sortable: true
},
columns: [{
header: 'Start Time',
dataIndex: 'StartTime',
format: 'H:i',
width: 75,
renderer: Ext.util.Format.timefieldRenderer('H:i'),
editor: {
xtype: 'timefield',
format: 'H:i',
increment: 1
}
}, {
header: 'End Time',
dataIndex: 'EndTime',
format: 'H:i',
width: 75,
renderer: Ext.util.Format.timefieldRenderer('H:i'),
editor: {
xtype: 'timefield',
format: 'H:i',
increment: 1
}
}]
});
var createDate = function(H, M) {
var tmpDate = new Date();
tmpDate.setHours(H);
tmpDate.setMinutes(M);
return tmpDate;
}
var gridStoreFields = [{
name: 'StartTime',
type: 'date',
convert: function(v, rec) {
var tmpDate = createDate(rec.StartTimeHours, rec.StartTimeMinutes);
return tmpDate;
}
}, {
name: 'EndTime',
type: 'date',
convert: function(v, rec) {
var tmpDate = createDate(rec.EndTimeHours, rec.EndTimeMinutes)
return tmpDate;
},
format: 'H:i'
}];
var gridStore = new Ext.data.JsonStore({
autoLoad: false,
fields: gridStoreFields
});
var panel = new Ext.TabPanel({
id: 'tabPanelId',
activeTab: 0,
height: 300,
renderTo: Ext.getBody()
});
comboStore.each(function(records) {
var theDay = records.get('day');
var newStore = new Ext.data.JsonStore({
storeId: theDay + 'Store',
data: records.get('schedule'),
autoLoad: false,
fields: gridStoreFields
});
var newGrid = new Ext.grid.EditorGridPanel({
id: theDay + 'Grid',
xtype: 'editorgrid',
height: 300,
store: newStore,
cm: cm,
border: false,
clicksToEdit: 1
});
Ext.getCmp('tabPanelId').add({
title: theDay,
items: newGrid
});
});
Ext.getCmp('tabPanelId').setActiveTab(0);
});
Заранее спасибо за вашу помощь.
Я проверил в хром-инструментах, что все динамически созданные вкладки имеют правильный идентификатор сетки и что каждая сетка имеет правильный файл storeId и правильный редактор, связанный в модели столбцов.
EDIT: Я немного поиграл со скрипкой, проблема заключается в том, что каждое поле может быть полем редактора ровно по 1 сетке за раз. Например, если вы редактируете поле 1 на вкладке 1, а затем редактируете поле 2 на вкладке 2, поле 2 не редактируется на вкладке 1, а поле 1 не редактируется на вкладке 2.