PDA

View Full Version : Grid, reload() and doRender problem



realjax
30 Oct 2009, 4:37 AM
Hi,

I have a grid and a store, the store gets 3 records from a database.
When I remove a record from the store and then do a store.reload({add:true}) all is fine, grid is updated nicely with missing record.
When I do NOT remove a row and then do a store.reload({add:true})
gridViews doRender method errors with : r is undefined
on this line :
p.value = c.renderer(r.data[c.name], p, r, rowIndex, i, ds);

I can't figure out what's going on here, from the API I understood that what I'm trying to do should be ok, allthough all three records are replaced.

Animal
30 Oct 2009, 5:08 AM
You can't reload with {add: true}

That implies reloading the current page of records, but leaving the current page of records in there!

And when you remove a record from a store, why are you reloading? You don't need to.

realjax
30 Oct 2009, 5:24 AM
Allright, let me explain what I'm trying to accomplish then.

I would like to have a grid that visually shows row(s) were added. These new rows come from a backend database, added by a different user. In order to do something with visualisation I need to monitor the rowsinserted event, fired by GridView... If there's a better way to accomplish this please let me know..

ps. you *can* reload with {add: true}. That is, according to the API. Existing records ( based on ID) are simply replaced.

Jaitsu
30 Oct 2009, 5:29 AM
reload() on a store just loads data from the specified source using the same parameters... ie. replaces all existing store data with that from the reload event

realjax
30 Oct 2009, 5:34 AM
From the API:

Reloads the Record cache from the configured Proxy using the configured Reader (http://www.extjs.com/deploy/dev/docs/output/Ext.data.Reader.html) and the options from the last load operation performed. Note: see the Important note in load (http://www.extjs.com/deploy/dev/docs/output/Ext.data.Store.html#Ext.data.Store-load).
Parameters:

options : Object(optional) An Object containing loading options (http://www.extjs.com/deploy/dev/docs/output/Ext.data.Store.html#Ext.data.Store-load) which may override the options used in the last load (http://www.extjs.com/deploy/dev/docs/output/Ext.data.Store.html#Ext.data.Store-load) operation. See load (http://www.extjs.com/deploy/dev/docs/output/Ext.data.Store.html#Ext.data.Store-load) for details (defaults to null, in which case the lastOptions (http://www.extjs.com/deploy/dev/docs/output/Ext.data.Store.html#Ext.data.Store-lastOptions) are used).

Jaitsu
30 Oct 2009, 5:37 AM
That is, according to the API. Existing records ( based on ID) are simply replaced.

That's a completely different point, you provide options which are passed to the proxy, but it will still replace all your records in the store.

EDIT: ignore me, i misread your earlier post

realjax
30 Oct 2009, 5:43 AM
no worries :-)

Jaitsu
30 Oct 2009, 5:50 AM
back to your problem though, whats the response object from the server when you receive the error? and what is being posted?

realjax
30 Oct 2009, 5:57 AM
The object from the server is just plain a json object. It is is the same one it originally loaded.
The problem is somewhere in Ext.grid.GridView...

Animal
30 Oct 2009, 5:58 AM
It is not going to work.

If you have 50 rows and then load using {add: true} , it's going to fire the "add" event claiming to have added 50 rows starting at index 50.

See here:



add : function(records){
records = [].concat(records);
if(records.length < 1){
return;
}
for(var i = 0, len = records.length; i < len; i++){
records[i].join(this);
}
var index = this.data.length;
this.data.addAll(records);
if(this.snapshot){
this.snapshot.addAll(records);
}
this.fireEvent('add', this, records, index);
},


Thre GridView then reacts with this listener:



onAdd : function(ds, records, index){
this.insertRows(ds, index, index + (records.length-1));
},


Which tries to add Records at indexes 50 to 99 into the view.

It's not going to work.

Animal
30 Oct 2009, 6:02 AM
Allright, let me explain what I'm trying to accomplish then.

I would like to have a grid that visually shows row(s) were added. These new rows come from a backend database, added by a different user. In order to do something with visualisation I need to monitor the rowsinserted event, fired by GridView... If there's a better way to accomplish this please let me know..

ps. you *can* reload with {add: true}. That is, according to the API. Existing records ( based on ID) are simply replaced.

I don't understand any of that.

I just can't understand the concept of REload and specifying add: true!

realjax
30 Oct 2009, 6:11 AM
I don't understand any of that.

I just can't understand the concept of REload and specifying add: true!

There's no other way to fire rowsinserted.. but I agree it sounds dumb.



It is not going to work.
...
It's not going to work.

Ok, cool thanks.

I'll think of something then..

Animal
30 Oct 2009, 6:38 AM
What's this rowinserted thing? Why do you listen for it? What's the whole purpose?

realjax
30 Oct 2009, 6:40 AM
So I can .highlight() a row when it appears new in the grid. New because it was not in the previous result set coming from the server.

Animal
30 Oct 2009, 6:49 AM
Reload means a reload.

Everything is going to be highlighted then.

realjax
30 Oct 2009, 6:56 AM
Nope, it only highlighted the 'new' record.
But it's clearly not the way to go. Using reload({add:true}) on an unchanged store crashes GridView.

Doesn't matter, I'm going to see if I can get things working in a different way.

Thanks!