Я новичок в ExtJS, так что это может быть глупый вопрос.
У меня есть собственная панель, расширяющая класс Ext Panel, который выполняет вызов AJAX и должен создавать и заполнять внутреннюю GridPanel полученными данными (столбцы являются динамическими, поэтому я не могу подготовить сетку раньше). Первый параметр webService
— это функция обратного вызова, вызываемая с данными, когда вызов AJAX, инкапсулированный в объекте webService
, завершается успешно.
К настоящему времени я пытаюсь заполнить свой TablePortlet
жестко закодированными данными, и он хорошо работает, когда метод renderCallback
вызывается непосредственно из constructor
, но вообще не работает, если вызывается после запроса AJAX. Могу проследить в Firebug, что в этом случае метод все равно вызывается, context
валидный, store
заполняется данными, но ничего не рендерится.
Как правильно заполнить данные? Может быть, есть какой-нибудь метод render
, который мне не хватает?
TablePortlet = Ext.extend(Ext.Panel, {
constructor: function(portletTitle, sourceId, webService)
{
var context = this;
TablePortlet.superclass.constructor.call(this, {
title: portletTitle,
anchor: '100%',
frame: true,
collapsible: true,
draggable: true
});
var grid = null;
function renderCallback(data)
{
if (grid != null)
context.remove(grid);
var store = new Ext.data.ArrayStore({
autoDestroy: true,
fields:[{name:"a"}, {name:"b"}, {name:"c"}, {name:'d'}],
});
store.loadData([['1','2','1','2'],['3','4','3','4']]);
grid = new Ext.grid.GridPanel({
store: store,
colModel: new Ext.grid.ColumnModel([
{header: 'A', dataIndex:'a'},
{header: 'B', dataIndex:'b'},
{header: 'C', dataIndex: 'c'},
{header: 'D', dataIndex: 'd'},
]),
width: '100%',
autoHeight: true,
view: new Ext.grid.GridView(),
viewConfig: {
forceFit: true
},
layout: 'fit'
});
context.add(grid);
}
this.on('render', function()
{
webService.GetTable(renderCallback, sourceId);
});
}
});