Extjs get all store records

Question

I have one question. Is it possible to get all records which are loaded in a store when the filters are being added to store? For example, if I load into the store 34 records and then apply filters and there is only 15 left, could I get those 34 records without clearing filters?

Answer 1

Edit: This was originally answered for Ext 4.2, where snapshot was public and documented. It is gone nowadays. So here's an update for Ext 5 and 6.

Ext 5 / 6

One liner:

var allRecords = (store.getData().getSource() || store.getData()).getRange();

Decomposition:

var data = store.getData();
// get unfiltered collection (will be null if the store has never been filtered)
var snapshot = data.getSource();
// pick the one that exists
var unfilteredCollection = snapshot || data;
// get items in an array
var allRecords = unfilteredCollection.getRange();

Store#getData gives you the store's collection.

Collection#getSource gives you the store's "source", that is the unfiltered collection -- but only if the collection has already been filtered, otherwise it returns null.

In both cases, you'll get a Ext.util.Collection. Use getRange to get an actual array of items.

Ext 5 getUnfiltered method

A getUnfiltered method was introduced at some point in Ext 5 (5.0.1 as far as I can tell, but docs for Ext 5 are offline at the moment...). It was not present in the first versions of Ext 5, and it was gone by Ext 6. So, well... Don't use it! Unless you want to tie your code to Ext 5 for no reasons, use the above method.

Ext 4

(original answer)

The whole loaded dataset is stored in the snapshot property of the store.

It is only created when needed though. That means that the property won't be available before some filters have been applied to the store. So to get the information you want in a safe way, use:

var allRecords = store.snapshot || store.data;

Ext 4 / 5 / 6

(and probably future versions)

You can use query or queryBy.

This seems to be the more forward compatible approach since, contrary to the previous methods, this API hasn't changed across versions.

Unfortunately, that will traverse the collection and incurs extra processing cost... Which may or may not be negligible depending of the size of your collection.

var allRecords = store
  .queryBy(function() { return true; }) // returns a collection
  .getRange(); // returns array of items

Answer 2

Perhaps a more forward compatible approach (i.e. ExtJS version >= 5) is the following:

var allRecords = store.getData().getSource().getRange();

Based on the documentaion, this should work for versions >= 5.0.

Answer 3

For getting all unfiltered data from a loaded store you can try var records = store.getUnfiltered();

Note: I am using Ext Js 5.1. Not sure about earlier versions.

Answer 4

If you want to get raw records from http response only - here is my solution:

Add the getRawRecords function to store class:

    Ext.override(Ext.data.Store, {
        getRawRecords: function(){
            return Ext.Array.map(this.getData().getRange(), function(record){
                return record.data;
            });
        }
    });

Usage:

    var rawData = store.getRawRecords();

Answer 5

For my case with ExtJS 4.2.1 (yeah, I know it's old) with a JSON TreeStore, I had to use: store.proxy.reader.jsonData since store.snapshot, store.data, store.query or store.queryBy did not exist.

Answer 6

In the Latest Extjs 6.2.0 you can use

var allRecs = Store.getData().getSource().items