PDA

View Full Version : About Store load function



gigas01
25 Sep 2012, 7:07 AM
Hello all,

In this page there is a grideditor panel and the data loaded from the database will be displayed.

The Server side response is like this.

38919

And i want to display all the data

But the problem is, there are some data more than one like Administartor, i want to display it all, but it is overwriting the row like this


38920

I can't figure it out exactly, so i started to track step by step, and i think the problem is the

this.grid1.getStore().load() part

is it only displaying one row if it has a same name of row?

Anyway, can you help me display all the data?

here is the full source.



var comboLoader = new MyApp.plugins.comboLoader();
MyApp.JobActionSummary = Ext.extend(MyApp.CardPanel, {
itemId:'chain-err-job-action-summary',
layout: 'floating-form',
url: MyApp.getApiUrl('JobActionsFinalSummaryController'),
autoScroll: true,
height: 400,
padding: '20',
//defaults: { border: false },

labelAlign: 'top',
constructor: function(cfg) {
cfg = MyApp.constructorHelper(this, cfg);
MyApp.chainErrJobAction.superclass.constructor.call(this, cfg);
},
createItems: function () {
var formItems = [];
var store = new Ext.data.JsonStore({
fields: ['ID','Name','reportToICRole','action'],
url: MyApp.getApiUrl('JobActionsFinalSummaryController'),
writer: new Ext.data.JsonWriter(),
root: 'data',
idProperty: 'ID'
});
var rowActions = new MyApp.RowActions({
autoWidth: false,
header:'Action',

width: 100,
actions: [
{ iconCls: 'icon-edit', tooltip: 'Edit', text: 'Edit' },
{ iconCls: 'icon-delete', tooltip: 'Delete', text: 'Delete' }
]
});
rowActions.on('action', this.onRowAction, this);

//formItems.push({ xtype: 'MyApp-Heading', html:'Job Action Summary'+'<br><br>'});
//formItems.push({ xtype: 'MyApp-normalText', html:'Here is the job action information you have inputted thus far. You can add, edit(change), or delete job action information.'});
formItems.push({ xtype: 'box', width: 800, html: '<br><br>' });

formItems.push(
{
xtype: 'editorgrid',
autoHeight:true,
autoWidth:true,
store: store,
title: 'Job Actions Summary',
id: 'grid1',ref: 'grid1',
plugins: [rowActions,comboLoader],
clicksToEdit: 1,
anchor: '-18',
tbar: {
buttonAlign: 'left',
items: [
{iconCls: 'icon-add', text: 'Add Job action', handler: this.goBack, scope: this}
]
},
columns: [
new Ext.grid.RowNumberer({width: 30}),
{id:'position', header: 'Position', width: 250, dataIndex: 'Name', editor: new Ext.form.TextField({allowBlank: true})},
{id:'reportsTo', header: 'Reports To', width: 150, dataIndex: 'reportToICRole', editor: new Ext.form.TextField({allowBlank: false})},
{id:'immres', header: 'Immediate Responsibilities', width: 150, dataIndex: 'action', editor: new Ext.form.TextField({allowBlank: false})},
{id:'extres', header: 'Extended Responsibilities', width: 150, dataIndex: 'action', editor: new Ext.form.TextField({allowBlank: false})},
rowActions
]
}
);

formItems.push({ xtype: 'box', width: 800, html: '<br><br>' });

return formItems;
},

onAddStaff: function(name, role) {

document.location.hash = "#chain-err-job-action|name=" + name + "&role="+role;
// how should i send the parameter(name) to the next page?
},

onRowAction: function (grid, record, action) {
this.activeRecord = record;
switch (action) {
case "icon-delete":
this.goBack();
break;
case "icon-edit":
this.onAddStaff(record.get('Name'), record.get('reportToICRole'));
break;
}
},

goBack: function() {
document.location.hash = "#chain-err-job-action";
},

loadPanel: function() {
this.grid1.getStore().load({
params: { action: 'list'},
scope: this
});
}


});
Ext.reg('MyApp-chain-err-job-action-summary', MyApp.JobActionSummary);

gigas01
25 Sep 2012, 7:30 AM
Solved it :)


var store = new Ext.data.JsonStore({ fields: ['ID','Name','reportToICRole','action'], url: MyApp.getApiUrl('JobActionsFinalSummaryController'), writer: new Ext.data.JsonWriter(), root: 'data', idProperty: 'ID' });the field ID and idProperty was the problem,this nasty one was the reason, so i deleted