PDA

View Full Version : Is row edit save meant to cause whole store to be saved?



neilios
11 Dec 2011, 10:38 AM
I am new to Ext4.0.
I have created a store, model and view for a table dataset on my server and am trying to figure out what Ext will sent to my server on a save.

What I'm seeing is that if I do a row edit and then click update then ALL records are send to the server. Similarly, if I use cellediting with autosync set to true then, again, ALL records are sent to the server.

Is this expected behavior?

I have very little configuration at this point. For RowEditing I have the following code:

Store:

Ext.define('MVRZ.store.Sources', {
extend: 'Ext.data.Store',
requires: 'MVRZ.model.Sources',
model: 'MVRZ.model.Sources',
storeId: MVRZGC.DATASET_SOURCE,
autoSync: false
});


Model:

Ext.define('MVRZ.model.Sources', {
extend: 'Ext.data.Model',
fields: MVRZ.Dataset.getFieldsList(MVRZGC.DATASET_SOURCE),


proxy: {
type: 'ajax',
noCache: true,
url: MVRZ.Dataset.getServerUrl(MVRZGC.DATASET_SOURCE),
reader: {
type: 'json',
root: 'results'
}
}


});


View:

Ext.define('MVRZ.view.SourcesList', {
extend: 'Ext.grid.Panel',
alias: 'widget.sourceslist',
title: 'Sources Grid',


store: 'Sources',
stateful: true,
stateId: 'sourcesListGrid',
plugins: [
Ext.create('Ext.grid.plugin.RowEditing', {
clicksToEdit: 2
})
],

viewConfig: {
stripeRows: true
},
initComponent: function() {
this.columns = MVRZ.Dataset.getColumnsList(MVRZGC.DATASET_SOURCE, {includeKey:false})


this.callParent();
}
});


Controller:


Ext.define('MVRZ.controller.Sources', {
extend: 'Ext.app.Controller',
refs: [{
ref: 'sourcesList',
selector: 'sourceslist'
}],


stores: ['Sources'],

init: function() {
// Start listening for events on views
this.control({
'sourceslist': {
selectionchange: this.onSourcesSelect
},
});
},

onLaunch: function() {
var sourcesStore = this.getSourcesStore();
sourcesStore.load({
callback: this.onSourcesLoad,
scope: this
});
},


onSourcesLoad: function() {
var sourcesList = this.getSourcesList();
sourcesList.getSelectionModel().select(0);
},

onSourcesSelect: function(selModel, selection) {
// Fire an application wide event
this.application.fireEvent('sourcesstart', selection[0]);
}

});

mitchellsimoens
12 Dec 2011, 12:10 PM
You shouldn't do this as a property, it should be done in a method:


plugins: [
Ext.create('Ext.grid.plugin.RowEditing', {
clicksToEdit: 2
})
],

That plugin will be shared among all instances.

neilios
12 Dec 2011, 1:45 PM
You shouldn't do this as a property, it should be done in a method:



plugins: [
Ext.create('Ext.grid.plugin.RowEditing', {
clicksToEdit: 2
})
],


I was following the way that the Grid example shows in the Learning section. Where should this be done, then - in the initComponent function?



That plugin will be shared among all instances.


Does this go some way to stop the saving of all data items in the store?

Thanks

mitchellsimoens
12 Dec 2011, 1:49 PM
Yes, initComponent is a perfect place for it. Will it solve your problem.. I'm not sure what other mistakes are in your code... this particular one will probably not solve it.

neilios
12 Dec 2011, 2:08 PM
Yes, initComponent is a perfect place for it. Will it solve your problem.. I'm not sure what other mistakes are in your code... this particular one will probably not solve it.

I have no code of my own that does the saving - like the examples I was following, I was expecting to click Update after editing a row and have Ext save the changed record automatically. I have set autoSync to true in the Store and it saves every record each time I click Update on a Row edit.

Am I not understanding the mechanisms correctly? It clearly knows that it needs to save something - how do I make it just save the records that have changed? Does setting autoSync to true force it to save every record, or should it only save changed records?

Thanks

sliks
14 Dec 2011, 8:11 AM
I ran into this issue before. The way I get around it is to use RESTful proxy. The grid itself will then save the updated row when it detects it.


Ext.define('SomeName', {
extend: 'Ext.data.Store',
model: 'someModel',
storeId: 'someStoreId',
//autoLoad: true,
autoSync: true,
proxy: {
type: 'rest',
api: {
read: 'url1',
create: 'url2',
update: 'url3',
destroy: 'url4'
},
reader: {
type: 'json',
root: 'data'
},
writer: {
type: 'json',
root: 'data',
encode: true
}
}
});

neilios
14 Dec 2011, 2:49 PM
Thia was helpful for debugging the issue further. The system was doing a "create" for each item in the store, so I guess it thinks that the items are all newly added. It makes sense that it tries to create them if they are new additions.

However, they are not new additions and it turns out that the store is not getting the correct uniqueId for my store and defaulting to "id". I didn't even think of that until now as the learning examples all assume the default and don't mention it. After adding that I see the correct behavior.

Thank you for your help.