PDA

View Full Version : Single Data Source, Multiple Grids with Grouping



leowyatt
23 Nov 2010, 8:19 AM
I've created 1 editor grid which works perfectly but currently isn't attached to a live data store, e.g database/xml/etc.

I have a second grid which was originally a grouping grid populated by a static data array. I've since attempted to move this over to the dynamically entered data in the first grid.

The store for the editor grid looks like this;



var arrayReader = new Ext.data.ArrayReader( {}, Line);

var lineStore = new Ext.data.Store( {
reader : arrayReader,
data : gridData,
});

The code for the group store is this;


var lineStoreGroup = new Ext.data.GroupingStore({
reader : arrayReader,
data : gridData,
sortInfo:{field: 'item_type', direction: "ASC"},
groupField:'item_type'
});

If I point my 2nd (grouped) grid at lineStore and remove the grouping it fills with data from the first grid. However if I point it to lineStoreGroup it remains blank and does not give me any errors in firebug.

My initial thought is that the code for the editor grid is not populating gridData so lineStoreGroup has nothing to read. I think it's just storing it in memory which is why I get data when I use lineStore.

This is the code which creates a new row in the editor grid (linesGrid)


linesGrid.getStore().insert(0, new Line( {
item_type : line_item_type,
size : line_size,
quantity : line_quantity,
sku_reference : line_sku_reference,
colour : line_colour,
length : line_length,
nett_weight : line_nett_weight,
gross_weight : line_gross_weight,
customer_reference : line_customer_reference,
lot : line_lot,
bank : line_bank,
customs : line_customs
}));

leowyatt
24 Nov 2010, 1:06 AM
What is the best way to check if lineStore is writing to the gridData array?

EDIT: infact if I do a log on the gridData array it seems to be blank. Am I misunderstanding how array stores work?

Condor
24 Nov 2010, 1:13 AM
gridData can't be empty, because it worked in lineStore (at least, that's what you said).

If gridData is empty then there is something else wrong with code you haven't posted yet.

leowyatt
24 Nov 2010, 1:19 AM
gridData can't be empty, because it worked in lineStore (at least, that's what you said).

If gridData is empty then there is something else wrong with code you haven't posted yet.

Well using the code above I can add data to the editor grid using lineStore. However if I do a length check on gridData after each insert I get a value of 0. Yes there are records in the grid, so where are they being stored? They certainly aren't being stored in gridData.

To initialise gridData all I did was this;


var gridData = new Array();

leowyatt
24 Nov 2010, 1:29 AM
Here is the code for the summary grid;


var summaryGrid = new Ext.grid.GridPanel({
store: lineStoreGroup,
colModel : cm,
view: new Ext.grid.GroupingView({
forceFit:true,
groupTextTpl: '{text} ({[values.rs.length]} {[values.rs.length > 1 ? "Items" : "Item"]})'
}),

frame:true,
width: 768,
height: 550,
title: 'Summary'
});

if I change store to lineStore and remove the view config then it get the same data from the previous editorgrid

Condor
24 Nov 2010, 1:45 AM
gridData is only used to initialize the store. It's not used as the actual store storage.

Try:

var recs = [];
lineStore.each(function(rec){
recs.push(rec.copy());
});
lineStoreGroup.add(recs);

leowyatt
24 Nov 2010, 1:47 AM
gridData is only used to initialize the store. It's not used as the actual store storage.

Try:

var recs = [];
lineStore.each(function(rec){
recs.push(rec.copy());
});
lineStoreGroup.add(recs);

Ah I see that is what I was struggling with, trying to understand why the store wasn't using the array as an actual store.

leowyatt
24 Nov 2010, 4:10 AM
Condor,

Is there a particular reason you're using the .copy() function and not just adding the same rec to the group store?

I'm adding functionality to the editor grid so the user can remove individual rows. I've got it working so that the remove updates both grids but the first record in the editor grid remains blank. That is achievable by removing the .copy() from the push function. If I leave the .copy() in the push command the lineStoreGroup grid doesn't update once the rows have been removed.

This should show what I've tried to explain;

23498

Here is the remove code:


WarehouseStock.removeRow = function() {

linesGrid.stopEditing();
var s = linesGrid.getSelectionModel().getSelections();
for(var i = 0, r; r = s[i]; i++){
linesGrid.getStore().remove(r);
lineStoreGroup.remove(r);
}
lineStoreGroup.sort('item_type', 'ASC');
}Here is the function which adds the new row to the editor grid;


WarehouseStock.newRow = function(){
var line_item_type = "";
var line_item_type_id = "";
var line_size = "";
var line_quantity = "";
var line_sku_reference = "";
var line_colour = "";
var line_length = "";
var line_nett_weight = "";
var line_gross_weight = "";
var line_customer_reference = "";
var line_lot = "";
var line_bank = "";
var line_customs = "";


var previousRow = linesGrid.getStore().getAt(0);

if (previousRow) {
line_item_type_id = previousRow.get('type_id');
line_item_type = previousRow.get('item_type');
line_size = previousRow.get('size');
line_colour = previousRow.get('colour');
line_customer_reference = previousRow.get('customer_reference');
line_lot = previousRow.get('lot');
line_bank = previousRow.get('bank');
line_customs = previousRow.get('customs');
}

linesGrid.getStore().insert(0, new Line( {
item_type_id : line_item_type_id,
item_type : line_item_type,
size : line_size,
quantity : line_quantity,
sku_reference : line_sku_reference,
colour : line_colour,
length : line_length,
nett_weight : line_nett_weight,
gross_weight : line_gross_weight,
customer_reference : line_customer_reference,
lot : line_lot,
bank : line_bank,
customs : line_customs
}));

linesGrid.startEditing(0, 0);

linesGrid.getStore().each(function(rec){
lineStoreGroup.add(rec.copy());
});
lineStoreGroup.sort('item_type', 'ASC');
lineStoreGroup.groupBy('item_type');
}

Condor
24 Nov 2010, 4:22 AM
A record can only belong to a single store.

(try setting one of the record field values - you'll notice that it will only update in one of the two grids)

leowyatt
24 Nov 2010, 4:27 AM
A record can only belong to a single store.

(try setting one of the record field values - you'll notice that it will only update in one of the two grids)

I see what you mean. As I'm making a duplicate, how can I remove it from both stores? I thought using your example above I had both stores using the same array as a data source?

leowyatt
24 Nov 2010, 6:19 AM
It seems when copying the record it uses the same id so I'll try and find it using that and remove it from the other store.