How to add/merge multiple Ext.data.JsonStore together in ExtJS 3.4

Question

I want to add/merge multiple Ext.data.JsonStore and array data to a single Ext.data.JsonStore.

Below the code -

Store1: function (s) {
         var tmp = [];
         var store = new Ext.data.JsonStore({
             autoDestroy: true,
             url: 'url1,
             root: 'rows', 
             listeners: {
                 load: {
                     fn: function (store, records, options) {
                         store.data.each(function (item, index, totalItems) {
                             tmp.push([item.data.Index, item.data.Method]);
                         });
                         s.loadData(tmp);
                     }
                 }
             },
             fields: ['Index','Method']
         });
         store.load();
     },
Store2: function (s) {
             var tmp = [];
             var store = new Ext.data.JsonStore({
                 autoDestroy: true,
                 url: 'url2,
                 root: 'rows', 
                 listeners: {
                     load: {
                         fn: function (store, records, options) {
                             store.data.each(function (item, index, totalItems) {
                                 tmp.push([item.data.ID, item.data.Type]);
                             });
                             s.loadData(tmp);
                         }
                     }
                 },
                 fields: ['ID', 'Type']
             });
             store.load();
         },

Store3: function () {
             var tmpGuests = [];
             var partyInfo = Ext.getCmp('party-tree');

         var parties = partyInfo.root.childNodes;

         Ext.each(parties, function (party) {
             Ext.each(party.childNodes, function (guest) {
                 tmpGuests.push([guest.id, guest.text]);
             }, this);
         }, this);

         return tmpGuests;
     }

And Tried like this -

AllStore: function (s) {
         var tmp = [];
         var storeTest;
         storeTest = new Ext.data.JsonStore({
             autoDestroy: true,
             url: 'Url1,
             root: 'rows', 
             listeners: {
                 load: {
                     fn: function (store, records, options) {
                         store.data.each(function (item, index, totalItems) {
                             tmp.push([item.data.Index, item.data.Method]);
                         });
                         s.loadData(tmp);
                         Store2.loadData(records, true);
                     }
                 },
             },
             fields: ['ID', 'Type']
         });
         storeTest.load();
     }

Which is not working, also I need to add array data (Store3) too. How can this possible?

Im using extJS 3.4

Answer 1

Not sure how robust your solution should be but you should be able to take advantage of the add and getRange methods.

Assuming all the stores have been loaded you can do something like:

var allStore = new Ext.data.JsonStore();
allStore.add(store1.getRange());
allStore.add(store2.getRange());
//..

If they haven't been loaded yet you can add them with a common listener, something like this:

var allStore = new Ext.data.JsonStore(),
    addToAllStore = function(store) {
        allStore.add(store.getRange());
    }

    store1.on('load', addToAllStore);
    store2.on('load', addToAllStore);
    store3.on('load', addToAllStore);