PDA

View Full Version : Dynamic Grid WIth Direct



sani
3 Nov 2012, 8:48 PM
I share my here :



Ext.require([
'Ext.direct.*',
'Ext.data.*',
'Ext.grid.*',
'Ext.util.Format'
]);


Ext.onReady(function() {
Ext.direct.Manager.addProvider(Ext.app.REMOTING_API);

//added model inside onready
Ext.define('QueryReport', {
extend: 'Ext.data.Model',
fields: ['ID_FAKULTAS', 'SINGKATAN_FAKULTAS', 'NM_FAKULTAS', 'ALAMAT_FAKULTAS']
});

//separated store into unique var for guaranteeRange
var store = Ext.create('Ext.data.Store', {
model: 'QueryReport',
autoLoad: true,
proxy: {
type: 'direct',
directFn: QueryDatabase.getResults,
}
});

//create the grid
var grid = Ext.create('Ext.grid.Panel', {
height: 450,
width: 700,
title: 'Velociraptor Owners',
store: store,
columns: [{
dataIndex: 'ID_FAKULTAS',
width: 50,
text: 'ID'
}, {
dataIndex: 'SINGKATAN_FAKULTAS',
flex: 1,
text: 'Singkatan'
}, {
dataIndex: 'NM_FAKULTAS',
flex: 1.3,
text: 'Nama'
}, {
dataIndex: 'ALAMAT_FAKULTAS',
flex: 1,
text: 'Alamat'
}],
renderTo: Ext.getBody()
});
});


I have problem here, how to make my code

fields: ['ID_FAKULTAS', 'SINGKATAN_FAKULTAS', 'NM_FAKULTAS', 'ALAMAT_FAKULTAS'] get dynamic from store json data
so this code
columns: [{ dataIndex: 'ID_FAKULTAS',
width: 50,
text: 'ID'
}, {
dataIndex: 'SINGKATAN_FAKULTAS',
flex: 1,
text: 'Singkatan'
}, {
dataIndex: 'NM_FAKULTAS',
flex: 1.3,
text: 'Nama'
}, {
dataIndex: 'ALAMAT_FAKULTAS',
flex: 1,
text: 'Alamat'
}],
dynamic also.

I mean, i want to make dynamic gridpanel generated dynamic by "QueryDatabase".

sani

mitchellsimoens
5 Nov 2012, 8:48 AM
The store needs to have a model defined. Do note that specifying the fields config creates a new model definition and uses that.