PDA

View Full Version : grid update upon form submit



5 Aug 2009, 11:59 AM
Hello,

I have a problem with my grid : It doesn't update when I submit a form where the user selects 2 fileds from 2 comboboxes (Date and NW Element). The returned json seems good
My grid is :


TME.grid = {
gridaccessibilite: new Ext.grid.GridPanel({
store: TME.data.gridstoreaccessibilite,
columns: [
{id:'DATE',header: "DATE", width: 80, sortable: true, dataIndex: 'DATE'},
{header: "ELT", width: 100, sortable: true, dataIndex: 'ELT'}
],
height:200,
width:900,
title:'Accessibilite par jour'
})
}
My stores are :


TME.data = {
mydays: new Ext.data.JsonStore({
url: 'TME_FormHandler.php',
baseParams: {task:'indYears'},
root: 'dates',
fields: ['DATE'],
autoLoad : true
}),
gridstoreaccessibilite: new Ext.data.JsonStore({
url: 'TME_FormHandler.php',
baseParams: {DATE:'', TOPO:'', task:'gridstoreaccessibilite'},
root: 'accessibilite',
fields: ['DATE', 'ELT'],
autoLoad : true
}),
}
My Form :


TME.field = {
day: new Ext.form.ComboBox({
fieldLabel: 'DATE',
hiddenName: 'DATE',
store: TME.data.mydays,
valueField: 'DATE',
displayField: 'DATE',
editable: false,
forceSelection: true,
// mode: 'local',
triggerAction: 'all',
anchor: '55%',
allowBlank: false,
emptyText: 'Select DATE...',
}),

topo: new Ext.form.ComboBox({
fieldLabel: 'TOPO',
hiddenName: 'TOPO',
store: ['RNC','PLAQUE','AGGLO','ZONE_MKT','DR','NODEB'],
valueField: 'TOPO',
displayField: 'TOPO',
editable: false,
forceSelection: true,
// mode: 'local',
triggerAction: 'all',
anchor: '55%',
allowBlank: false,
emptyText: 'Select TOPO...',
})
}
TME.fieldset = {
aggregation: new Ext.form.FieldSet({
title: 'Spatial and temporal Aggregations',
collapsible: true,
autoHeight: true,
labelWidth: 65,
items: [{
layout: 'column',
defaults: {layout: 'form'},
items:[
TME.field.day,
TME.field.topo
]
}]
}),
}
TME.form = new Ext.FormPanel({
labelWidth: 70,
frame: true,
bodyStyle: 'padding:10px 10px 0',
width: 500,
height : 200,
items: [
TME.fieldset.aggregation,
]
});
submit button :


TME.Button = {
// Submit button
submit: TME.form.addButton({
text: 'Requete',
disabled: false,

handler: function(){
Ext.MessageBox.alert('hi');

TME.form.form.submit({
url:'TME_FormHandler.php',
method: 'POST',
reset: false,
params: {task: 'gridstoreaccessibilite'},
waitMsg:'Generating Request...',
});

}
})
}
the returned json :


{"accessibilite":[{"DATE":"2009-07-20","ELT":"Bourg-en-Bresse"},{"DATE":"2009-07-20","ELT":"Hors globuleH3"},{"DATE":"2009-07-20","ELT":"Lyon_Centre_1_2"},{"DATE":"2009-07-20","ELT":"Lyon_Centre_3_7_8"},{"DATE":"2009-07-20","ELT":"Lyon_Est"},{"DATE":"2009-07-20","ELT":"Lyon_Nord"},{"DATE":"2009-07-20","ELT":"Lyon_Ouest"},{"DATE":"2009-07-20","ELT":"Lyon_Sud"},{"DATE":"2009-07-20","ELT":"TGV"}]}


The grid does not update/refresh.

Any hints? What do I do wrong ?

thanks

cedric

Animal
5 Aug 2009, 12:23 PM
YOu have to DO something with any returned value from a form submit.

Anyway, that's not a valid return packet. Read the docs!

http://extjs.com/deploy/dev/docs/?class=Ext.form.BasicForm&member=doAction

http://extjs.com/deploy/dev/docs/?class=Ext.form.Action.Submit

httpdotcom
5 Aug 2009, 1:21 PM
Animal is right. Just returning values from your form submission doesn't populate them into the grid. It sounds more like you need to post your form and then, on success, pass those values to your store loader and re-load the store...or, instead of posting your form,


...handler: function() {
gridaccessibilite.getStore().load( { params: TME_form.getForm().getValues() } ) ;
}

recommendation: don't name something "value" dot "value" (see TME.form). It looks too much like an object property or method (unless you extend the object to include new properties or methods). Stick with the underscore.

This is all conjecture (since we can't see your backend code) and your baseParams config may conflict, so YMMV.

Animal
5 Aug 2009, 9:10 PM
You will use the response to call loadData on your Store.

Read those links to find out what to do.