PDA

View Full Version : Issue with PAGING + STORE + GRIDPANEL + CLASSES



odrium
15 Nov 2011, 10:12 AM
Greetings.

I want to have paging enabled in my GridPanel and in fact I have done so effectively wiithout using Javascript classes. But when I started the development of my application, there's no way I can assign the store my grid is using to the paging bbar:


Ext.ns('Cerdos.grid');

Cerdos.grid.TecnicoGridPanel = Ext.extend(Cerdos.grid.GridPanelBaseCls, {
url : 'sistema/tecnico/getTecnico.php',

buildTbar : function(){
return [
'<b>T&eacute;cnicos</b>',
'->',
{
text : 'Nuevo Técnico',
iconCls : 'icon-user_add',
scope : this,
handler : this.onNewTecnico
},
'-',
{
text : 'Editar Técnico',
iconCls : 'icon-user_edit',
scope : this,
handler : this.onEditTecnico
},
'-',
{
text : 'Eliminar Técnico',
iconCls : 'icon-user_delete',
scope : this,
handler : this.onDeleteTecnico
}
]
},

buildBbar : function() {
return {
xtype : 'paging',
displayInfo : true,
pageSize : 5,
store : this.store
}
},

buildStore : function() {
return {
xtype : 'jsonstore',
url : this.url,
autoLoad : true,
root: 'root',
fields : [
'id_tecnico', 'cedula', 'nombres', 'apellidos', 'fecha_ing'
],
sortInfo : {
field : 'apellidos',
dir : 'ASC'
}
};
},

buildColumns : function() {
return [
{
header : 'Apellidos',
dataIndex : 'apellidos',
sortable : true
},
{
header : 'Nombres',
dataIndex : 'nombres',
sortable : true
},
{
header : 'Cédula',
dataIndex : 'cedula',
sortable : true
},
{
header : 'Fecha de Ingreso',
dataIndex : 'fecha_ing',
sortable : true
}
]
},

agregarEventos : function() {
this.addEvents({
newtecnico : true,
edittecnico : true,
deletetecnico : true
});
},

onNewTecnico : function() {
this.fireEvent('newtecnico');
},

onEditTecnico : function() {
var selectedRec = this.getSelected()[0];

if (selectedRec) {
this.fireEvent('edittecnico', this, selectedRec);
}
},

onDeleteTecnico : function() {
var selectedRecs = this.getSelected();
if (selectedRecs.length > 0) {
this.fireEvent('deletetecnico', selectedRecs);
}
}

});

Ext.reg('tecnicogridpanel', Cerdos.grid.TecnicoGridPanel)

If you can see the "buildBbar" function I assign to the "store" option "this.store". And it pops an error saying there is not such store. I assume that's because the way objects are created with xtype. So,

¿How can I assign the gridpanel store to the paging bbar? Please help.


PD: The initComponent code in the "GridPanel BaseCls", which is the class that TecnicoGridPanel extends:



initComponent : function() {
Ext.applyIf(this, {
viewConfig : {
forceFit : true
},
columns: this.buildColumns(),
tbar: this.buildTbar(),
bbar: this.buildBbar(),
store: this.buildStore()
});
Cerdos.grid.GridPanelBaseCls.superclass.initComponent.call(this);
this.agregarEventos();
},

mitchellsimoens
18 Nov 2011, 1:43 PM
This is because of your applyIf:


Ext.applyIf(this, {
viewConfig : {
forceFit : true
},
columns: this.buildColumns(),
tbar: this.buildTbar(),
bbar: this.buildBbar(),
store: this.buildStore()
});

You will need to set the store onto this before this Ext.applyIf gets fired:


this.store = this.buildStore();

Ext.applyIf(this, {
viewConfig : {
forceFit : true
},
columns: this.buildColumns(),
tbar: this.buildTbar(),
bbar: this.buildBbar()
});

odrium
19 Nov 2011, 11:05 AM
I have changed the initComponent to:


initComponent : function() {

this.columns = this.buildColumns();
this.tbar = this.buildTbar();
this.bbar = this.buildBbar();
this.store = this.buildStore();

Cerdos.grid.GridPanelBaseCls.superclass.initComponent.call(this);
this.agregarEventos();
},

But still, firebug says: "this.store is undefined".

Maybe when this.store is referering to the bbar store and not to the GridPanel store. How do I specify to be the GridPanel Store.

And thanks for answering.

odrium
19 Nov 2011, 11:26 AM
d Ohk the Paging Bar is working, I just changed the this.store statement before the bbar statement. Now the problem is that the paging bar and the grid function separately as if each one had a different store. So when I press the next button. The php POST is loaded twice. And of course the grid doesnt refresh the data. HELP!!!