The Store class encapsulates a client side cache of Model objects. Stores load data via a Proxy, and also provide functions for sorting, filtering and querying the model instances contained within it.

Creating a Store is easy - we just tell it the Model and the Proxy to use to load and save its data:

// Set up a model to use in our Store
Ext.regModel('User', {
    fields: [
        {name: 'firstName', type: 'string'},
        {name: 'lastName',  type: 'string'},
        {name: 'age',       type: 'int'},
        {name: 'eyeColor',  type: 'string'}
    ]
});

var myStore = new Ext.data.Store({
    model: 'User',
    proxy: {
        type: 'ajax',
        url : '/users.json',
        reader: {
            type: 'json',
            root: 'users'
        }
    },
    autoLoad: true
});

In the example above we configured an AJAX proxy to load data from the url '/users.json'. We told our Proxy to use a JsonReader to parse the response from the server into Model object - see the docs on JsonReader for details.

Inline data

Stores can also load data inline. Internally, Store converts each of the objects we pass in as data into Model instances:

new Ext.data.Store({
    model: 'User',
    data : [
        {firstName: 'Ed',    lastName: 'Spencer'},
        {firstName: 'Tommy', lastName: 'Maintz'},
        {firstName: 'Aaron', lastName: 'Conran'},
        {firstName: 'Jamie', lastName: 'Avins'}
    ]
});

Loading inline data using the method above is great if the data is in the correct format already (e.g. it doesn't need to be processed by a reader). If your inline data requires processing to decode the data structure, use a MemoryProxy instead (see the MemoryProxy docs for an example).

Additional data can also be loaded locally using add.

Loading Nested Data

Applications often need to load sets of associated data - for example a CRM system might load a User and her Orders. Instead of issuing an AJAX request for the User and a series of additional AJAX requests for each Order, we can load a nested dataset and allow the Reader to automatically populate the associated models. Below is a brief example, see the Ext.data.Reader intro docs for a full explanation:

var store = new Ext.data.Store({
    autoLoad: true,
    model: "User",
    proxy: {
        type: 'ajax',
        url : 'users.json',
        reader: {
            type: 'json',
            root: 'users'
        }
    }
});

Which would consume a response like this:

{
    "users": [
        {
            "id": 1,
            "name": "Ed",
            "orders": [
                {
                    "id": 10,
                    "total": 10.76,
                    "status": "invoiced"
                },
                {
                    "id": 11,
                    "total": 13.45,
                    "status": "shipped"
                }
            ]
        }
    ]
}

See the Ext.data.Reader intro docs for a full explanation.

Filtering and Sorting

Stores can be sorted and filtered - in both cases either remotely or locally. The sorters and filters are held inside MixedCollection instances to make them easy to manage. Usually it is sufficient to either just specify sorters and filters in the Store configuration or call sort or filter:

var store = new Ext.data.Store({
    model: 'User',
    sorters: [
        {
            property : 'age',
            direction: 'DESC'
        },
        {
            property : 'firstName',
            direction: 'ASC'
        }
    ],
    
    filters: [
        {
            property: 'firstName',
            value   : /Ed/
        }
    ]
});

The new Store will keep the configured sorters and filters in the MixedCollection instances mentioned above. By default, sorting and filtering are both performed locally by the Store - see remoteSort and remoteFilter to allow the server to perform these operations instead.

Filtering and sorting after the Store has been instantiated is also easy. Calling filter adds another filter to the Store and automatically filters the dataset (calling filter with no arguments simply re-applies all existing filters). Note that by default sortOnFilter is set to true, which means that your sorters are automatically reapplied if using local sorting.

store.filter('eyeColor', 'Brown');

Change the sorting at any time by calling sort:

store.sort('height', 'ASC');

Note that all existing sorters will be removed in favor of the new sorter data (if sort is called with no arguments, the existing sorters are just reapplied instead of being removed). To keep existing sorters and add new ones, just add them to the MixedCollection:

store.sorters.add(new Ext.util.Sorter({
    property : 'shoeSize',
    direction: 'ASC'
}));

store.sort();

Registering with StoreMgr

Any Store that is instantiated with a storeId will automatically be registed with the StoreMgr. This makes it easy to reuse the same store in multiple views:

//this store can be used several times
new Ext.data.Store({
    model: 'User',
    storeId: 'usersStore'
});

new Ext.List({
    store: 'usersStore',

    //other config goes here
});

new Ext.DataView({
    store: 'usersStore',

    //other config goes here
});

Config Options

autoLoad : Boolean/Object

If data is not specified, and if autoLoad is true or an Object, this store's load method is automatically called afte...

If data is not specified, and if autoLoad is true or an Object, this store's load method is automatically called after creation. If the value of autoLoad is an Object, this Object will be passed to the store's load method. Defaults to false.

autoSave : Boolean

True to automatically sync the Store with its Proxy after every edit to one of its Records. Defaults to false.

clearOnPageLoad : Boolean

True to empty the store when loading another page via loadPage, nextPage or previousPage (defaults to true). Setting...

True to empty the store when loading another page via loadPage, nextPage or previousPage (defaults to true). Setting to false keeps existing records, allowing large data sets to be loaded one page at a time but rendered all together.

data : Array

Optional array of Model instances or data objects to load locally. See "Inline data" above for details.

listeners : Object

A config object containing one or more event handlers to be added to this object during initialization. This should ...

A config object containing one or more event handlers to be added to this object during initialization. This should be a valid listeners config object as specified in the addListener example for attaching multiple handlers at once.

DOM events from ExtJs Components

While some ExtJs Component classes export selected DOM events (e.g. "click", "mouseover" etc), this is usually only done when extra value can be added. For example the DataView's click event passing the node clicked on. To access DOM events directly from a child element of a Component, we need to specify the element option to identify the Component property to add a DOM listener to:

new Ext.Panel({
    width: 400,
    height: 200,
    dockedItems: [{
        xtype: 'toolbar'
    }],
    listeners: {
        click: {
            element: 'el', //bind to the underlying el property on the panel
            fn: function(){ console.log('click el'); }
        },
        dblclick: {
            element: 'body', //bind to the underlying body property on the panel
            fn: function(){ console.log('dblclick body'); }
        }
    }
});

proxy : String/Ext.data.Proxy/Object

The Proxy to use for this Store. This can be either a string, a config object or a Proxy instance - see setProxy for ...

The Proxy to use for this Store. This can be either a string, a config object or a Proxy instance - see setProxy for details.

remoteFilter : Boolean

True to defer any filtering operation to the server. If false, filtering is done locally on the client. Defaults to f...

True to defer any filtering operation to the server. If false, filtering is done locally on the client. Defaults to false.

remoteSort : Boolean

True to defer any sorting operation to the server. If false, sorting is done locally on the client. Defaults to false...

True to defer any sorting operation to the server. If false, sorting is done locally on the client. Defaults to false.

sortOnFilter : Boolean

For local filtering only, causes sort to be called whenever filter is called, causing the sorters to be reapplied aft...

For local filtering only, causes sort to be called whenever filter is called, causing the sorters to be reapplied after filtering. Defaults to true

storeId : String

Optional unique identifier for this store. If present, this Store will be registered with the Ext.data.StoreMgr, mak...

Optional unique identifier for this store. If present, this Store will be registered with the Ext.data.StoreMgr, making it easy to reuse elsewhere. Defaults to undefined.

Properties

batchUpdateMode : String

Sets the updating behavior based on batch synchronization. 'operation' (the default) will update the Store's internal...

Sets the updating behavior based on batch synchronization. 'operation' (the default) will update the Store's internal representation of the data after each operation of the batch has completed, 'complete' will wait until the entire batch has been completed before updating the Store's data. 'complete' is a good choice for local storage proxies, 'operation' is better for remote proxies, where there is a comparatively high latency.

currentPage : Number

The page that the Store has most recently loaded (see loadPage)

data : Ext.util.MixedCollection

The MixedCollection that holds this store's local cache of records

defaultProxyType : String

The string type of the Proxy to create if none is specified. This defaults to creating a memory proxy.

defaultSortDirection : String

The default sort direction to use if one is not specified (defaults to "ASC")

filterOnLoad : Boolean

If true, any filters attached to this Store will be run after loading data, before the datachanged event is fired. De...

If true, any filters attached to this Store will be run after loading data, before the datachanged event is fired. Defaults to true, ignored if remoteFilter is true

filters : Ext.util.MixedCollection

The collection of Filters currently applied to this Store

groupDir : String

The direction in which sorting should be applied when grouping. Defaults to "ASC" - the other supported value is "DES...

The direction in which sorting should be applied when grouping. Defaults to "ASC" - the other supported value is "DESC"

groupField : String

The (optional) field by which to group data in the store. Internally, grouping is very similar to sorting - the group...

The (optional) field by which to group data in the store. Internally, grouping is very similar to sorting - the groupField and groupDir are injected as the first sorter (see sort). Stores support a single level of grouping, and groups can be fetched via the getGroups method.

groupers : Ext.util.MixedCollection

The collection of Groupers currently applied to this Store

isDestroyed : Boolean

True if the Store has already been destroyed via destroyStore. If this is true, the reference to Store should be dele...

True if the Store has already been destroyed via destroyStore. If this is true, the reference to Store should be deleted as it will not function correctly any more.

pageSize : Number

The number of records considered to form a 'page'. This is used to power the built-in paging using the nextPage and p...

The number of records considered to form a 'page'. This is used to power the built-in paging using the nextPage and previousPage functions. Defaults to 25.

snapshot : Ext.util.MixedCollection

A pristine (unfiltered) collection of the records in this store. This is used to reinstate records when a filter is r...

A pristine (unfiltered) collection of the records in this store. This is used to reinstate records when a filter is removed or changed

sortOnLoad : Boolean

If true, any sorters attached to this Store will be run after loading data, before the datachanged event is fired. De...

If true, any sorters attached to this Store will be run after loading data, before the datachanged event is fired. Defaults to true, igored if remoteSort is true

sortToggle : Object

Stores the current sort direction ('ASC' or 'DESC') for each field. Used internally to manage the toggling of sort di...

Stores the current sort direction ('ASC' or 'DESC') for each field. Used internally to manage the toggling of sort direction per field. Read only

sorters : Ext.util.MixedCollection

The collection of Sorters currently applied to this Store

Methods

( String eventName, Function handler, [Object scope] ) : Void

Removes an event handler (shorthand for removeListener.)

Parameters

eventName : String
The type of event the handler was associated with.
handler : Function
The handler to remove. This must be a reference to the function passed into the addListener call.
scope : Object
(optional) The scope originally specified for the handler.

Returns

Void

add( Object data ) : Array

Adds Model instances to the Store by instantiating them based on a JavaScript object. When adding already- instantiat...

Adds Model instances to the Store by instantiating them based on a JavaScript object. When adding already- instantiated Models, use insert instead. The instances will be added at the end of the existing collection. This method accepts either a single argument array of Model instances or any number of model instance arguments. Sample usage:

myStore.add({some: 'data'}, {some: 'other data'});

Parameters

data : Object
The data for each model

Returns

Array The array of newly created model instances

addEvents( Object|String o, string Optional. ) : Void

Adds the specified events to the list of events which this Observable may fire.

Parameters

o : Object|String
Either an object with event names as properties with a value of true or the first event name string if multiple event names are being passed as separate parameters.
Optional. : string
Event name if multiple event names are being passed as separate parameters. Usage:
```
this.addEvents('storeloaded', 'storecleared');
```

Returns

Void

addListener( String eventName, Function handler, [Object scope], [Object options] ) : Void

Appends an event handler to this object.

Parameters

eventName : String
The name of the event to listen for. May also be an object who's property names are event names. See
handler : Function
The method the event invokes.
scope : Object
(optional) The scope (this reference) in which the handler function is executed. If omitted, defaults to the object which fired the event.
options : Object
(optional) An object containing handler configuration. properties. This may contain any of the following properties:
- scope : Object
  The scope (this reference) in which the handler function is executed. If omitted, defaults to the object which fired the event.
- delay : Number
  The number of milliseconds to delay the invocation of the handler after the event fires.
- single : Boolean
  True to add a handler to handle just the next firing of the event, and then remove itself.
- buffer : Number
  Causes the handler to be scheduled to run in an Ext.util.DelayedTask delayed by the specified number of milliseconds. If the event fires again within that time, the original handler is not invoked, but the new handler is scheduled in its place.
- target : Observable
  Only call the handler if the event was fired on the target Observable, not if the event was bubbled up from a child Observable.
- element : String
  This option is only valid for listeners bound to Components. The name of a Component property which references an element to add a listener to.
  This option is useful during Component construction to add DOM event listeners to elements of Components which will exist only after the Component is rendered. For example, to add a click listener to a Panel's body:
```
new Ext.Panel({
    title: 'The title',
    listeners: {
        click: this.handlePanelClick,
        element: 'body'
    }
});
```
  When added in this way, the options available are the options applicable to Ext.core.Element.addListener
Combining Options
Using the options argument, it is possible to combine different types of listeners:

A delayed, one-time listener.
```
myPanel.on('hide', this.handleClick, this, {
single: true,
delay: 100
});
```
Attaching multiple handlers in 1 call
The method also allows for a single argument to be passed which is a config object containing properties which specify multiple events. For example:
```
myGridPanel.on({
    cellClick: this.onCellClick,
    mouseover: this.onMouseOver,
    mouseout: this.onMouseOut,
    scope: this // Important. Ensure "this" is correct during handler execution
});
```
.

Returns

Void

addManagedListener( Observable|Element item, Object|String ename, Function fn, Object scope, Object opt ) : Void

Adds listeners to any Observable object (or Element) which are automatically removed when this Component is destroyed...

Adds listeners to any Observable object (or Element) which are automatically removed when this Component is destroyed.

Parameters

item : Observable|Element
The item to which to add a listener/listeners.
ename : Object|String
The event name, or an object containing event name properties.
fn : Function
Optional. If the ename parameter was an event name, this is the handler function.
scope : Object
Optional. If the ename parameter was an event name, this is the scope (this reference) in which the handler function is executed.
opt : Object
Optional. If the ename parameter was an event name, this is the addListener options.

Returns

Void

capture( Observable o, Function fn, [Object scope] ) : Void

Starts capture on the specified Observable. All events will be passed to the supplied function with the event name + ...

Starts capture on the specified Observable. All events will be passed to the supplied function with the event name + standard signature of the event before the event is fired. If the supplied function returns false, the event will not fire.

Parameters

o : Observable
The Observable to capture events from.
fn : Function
The function to call when an event is fired.
scope : Object
(optional) The scope (this reference) in which the function is executed. Defaults to the Observable firing the event.

Returns

Void

clearFilter( Boolean suppressEvent ) : Void

Revert to a view of the Record cache with no filtering applied.

Parameters

suppressEvent : Boolean
If true the filter is cleared silently without firing the datachanged event.

Returns

Void

clearListeners : Void

Removes all listeners for this object including the managed listeners

clearManagedListeners : Void

Removes all managed listeners for this object.

collect( String dataIndex, [Boolean allowNull], [Boolean bypassFilter] ) : Array

Collects unique values for a particular dataIndex from this store.

Parameters

dataIndex : String
The property to collect
allowNull : Boolean
(optional) Pass true to allow null, undefined or empty string values
bypassFilter : Boolean
(optional) Pass true to collect from all records, even ones which are filtered

Returns

Array An array of the unique values

createAlias( String eventName, Function handler, [Object scope], [Object options] ) : Void

Appends an event handler to this object (shorthand for addListener.)

Parameters

eventName : String
The type of event to listen for
handler : Function
The method the event invokes
scope : Object
(optional) The scope (this reference) in which the handler function is executed. If omitted, defaults to the object which fired the event.
options : Object
(optional) An object containing handler configuration.

Returns

Void

each( Function fn, [Object scope] ) : Void

Calls the specified function for each of the Records in the cache.

Parameters

fn : Function
The function to call. The Record is passed as the first parameter. Returning false aborts and exits the iteration.
scope : Object
(optional) The scope (this reference) in which the function is executed. Defaults to the current Record in the iteration.

Returns

Void

enableBubble( String/Array events ) : Void

Enables events fired by this Observable to bubble up an owner hierarchy by calling this.getBubbleTarget() if present....

Enables events fired by this Observable to bubble up an owner hierarchy by calling this.getBubbleTarget() if present. There is no implementation in the Observable base class.

This is commonly used by Ext.Components to bubble events to owner Containers. See Ext.Component.getBubbleTarget. The default implementation in Ext.Component returns the Component's immediate owner. But if a known target is required, this can be overridden to access the required target more quickly.

Example:

Ext.override(Ext.form.Field, {
//  Add functionality to Field's initComponent to enable the change event to bubble
initComponent : Ext.Function.createSequence(Ext.form.Field.prototype.initComponent, function() {
    this.enableBubble('change');
}),

//  We know that we want Field's events to bubble directly to the FormPanel.
getBubbleTarget : function() {
    if (!this.formPanel) {
        this.formPanel = this.findParentByType('form');
    }
    return this.formPanel;
}
});

var myForm = new Ext.formPanel({
title: 'User Details',
items: [{
    ...
}],
listeners: {
    change: function() {
        // Title goes red if form has been modified.
        myForm.header.setStyle('color', 'red');
    }
}
});

Parameters

events : String/Array
The event name to bubble, or an Array of event names.

Returns

Void

filter( Mixed filters, String value ) : Void

Filters the loaded set of records by a given set of filters.

Parameters

filters : Mixed
The set of filters to apply to the data. These are stored internally on the store, but the filtering itself is done on the Store's MixedCollection. See MixedCollection's filter method for filter syntax. Alternatively, pass in a property string
value : String
Optional value to filter by (only if using a property string as the first argument)

Returns

Void

filterBy( Function fn, [Object scope] ) : Void

Filter by a function. The specified function will be called for each Record in this Store. If the function returns tr...

Filter by a function. The specified function will be called for each Record in this Store. If the function returns true the Record is included, otherwise it is filtered out.

Parameters

fn : Function
The function to be called. It will be passed the following parameters:
- record : Ext.data.Record
  The record to test for filtering. Access field values using Ext.data.Record.get.
- id : Object
  The ID of the Record passed.
scope : Object
(optional) The scope (this reference) in which the function is executed. Defaults to this Store.

Returns

Void

find( String fieldName, String/RegExp value, [Number startIndex], [Boolean anyMatch], [Boolean caseSensitive], Boolean exactMatch ) : Number

Finds the index of the first matching Record in this store by a specific field value.

Parameters

fieldName : String
The name of the Record field to test.
value : String/RegExp
Either a string that the field value should begin with, or a RegExp to test against the field.
startIndex : Number
(optional) The index to start searching at
anyMatch : Boolean
(optional) True to match any part of the string, not just the beginning
caseSensitive : Boolean
(optional) True for case sensitive comparison
exactMatch : Boolean
True to force exact match (^ and $ characters added to the regex). Defaults to false.

Returns

Number The matched index or -1

findBy( Function fn, [Object scope], [Number startIndex] ) : Number

Find the index of the first matching Record in this Store by a function. If the function returns true it is considere...

Find the index of the first matching Record in this Store by a function. If the function returns true it is considered a match.

Parameters

fn : Function
The function to be called. It will be passed the following parameters:
- record : Ext.data.Record
  The record to test for filtering. Access field values using Ext.data.Record.get.
- id : Object
  The ID of the Record passed.
scope : Object
(optional) The scope (this reference) in which the function is executed. Defaults to this Store.
startIndex : Number
(optional) The index to start searching at

Returns

Number The matched index or -1

findExact( String fieldName, Mixed value, [Number startIndex] ) : Number

Finds the index of the first matching Record in this store by a specific field value.

Parameters

fieldName : String
The name of the Record field to test.
value : Mixed
The value to match the field against.
startIndex : Number
(optional) The index to start searching at

Returns

Number The matched index or -1

findRecord( String fieldName, String/RegExp value, [Number startIndex], [Boolean anyMatch], [Boolean caseSensitive], Boolean exactMatch ) : Ext.data.Record

Finds the first matching Record in this store by a specific field value.

Parameters

fieldName : String
The name of the Record field to test.
value : String/RegExp
Either a string that the field value should begin with, or a RegExp to test against the field.
startIndex : Number
(optional) The index to start searching at
anyMatch : Boolean
(optional) True to match any part of the string, not just the beginning
caseSensitive : Boolean
(optional) True for case sensitive comparison
exactMatch : Boolean
True to force exact match (^ and $ characters added to the regex). Defaults to false.

Returns

Ext.data.Record The matched record or null

fireEvent( String eventName, Object... args ) : Boolean

Fires the specified event with the passed parameters (minus the event name). An event may be set to bubble up an Obse...

Fires the specified event with the passed parameters (minus the event name).

An event may be set to bubble up an Observable parent hierarchy (See Ext.Component.getBubbleTarget) by calling enableBubble.

Parameters

eventName : String
The name of the event to fire.
args : Object...
Variable number of parameters are passed to handlers.

Returns

Boolean returns false if any of the handlers return false otherwise it returns true.

first : Ext.data.Model/undefined

Convenience function for getting the first model instance in the store

getAt( Number index ) : Ext.data.Model

Get the Record at the specified index.

Parameters

index : Number
The index of the Record to find.

Returns

Ext.data.Model The Record at the passed index. Returns undefined if not found.

getById( String id ) : Ext.data.Record

Get the Record with the specified id.

Parameters

id : String
The id of the Record to find.

Returns

Ext.data.Record The Record with the passed id. Returns undefined if not found.

getCount : Number

Gets the number of cached records. If using paging, this may not be the total size of the dataset. If the data object...

Gets the number of cached records.

If using paging, this may not be the total size of the dataset. If the data object used by the Reader contains the dataset size, then the getTotalCount function returns the dataset size. Note: see the Important note in load.

getGroupString( Ext.data.Model instance ) : String

Returns the string to group on for a given model instance. The default implementation of this method returns the mod...

Returns the string to group on for a given model instance. The default implementation of this method returns the model's groupField, but this can be overridden to group by an arbitrary string. For example, to group by the first letter of a model's 'name' field, use the following code:

new Ext.data.Store({
    groupDir: 'ASC',
    getGroupString: function(instance) {
        return instance.get('name')[0];
    }
});

Parameters

instance : Ext.data.Model
The model instance

Returns

String The string to compare when forming groups

getGroups : Array

Returns an object containing the result of applying grouping to the records in this store. See groupField, groupDir a...

Returns an object containing the result of applying grouping to the records in this store. See groupField, groupDir and getGroupString. Example for a store containing records with a color field:

var myStore = new Ext.data.Store({
    groupField: 'color',
    groupDir  : 'DESC'
});

myStore.getGroups(); //returns:
[
    {
        name: 'yellow',
        children: [
            //all records where the color field is 'yellow'
        ]
    },
    {
        name: 'red',
        children: [
            //all records where the color field is 'red'
        ]
    }
]

getNewRecords : Array

Returns all Model instances that are either currently a phantom (e.g. have no id), or have an ID but have not yet bee...

Returns all Model instances that are either currently a phantom (e.g. have no id), or have an ID but have not yet been saved on this Store (this happens when adding a non-phantom record from another Store into this one)

getProxy : Ext.data.Proxy

Returns the proxy currently attached to this proxy instance

getRange( [Number startIndex], [Number endIndex] ) : Ext.data.Model[]

Returns a range of Records between specified indices.

Parameters

startIndex : Number
(optional) The starting index (defaults to 0)
endIndex : Number
(optional) The ending index (defaults to the last Record in the Store)

Returns

Ext.data.Model[] An array of Records

getSortState : Object

Returns an object describing the current sort state of this Store.

getTotalCount : Number

Returns the total number of Model instances that the Proxy indicates exist. This will usually differ from getCount w...

Returns the total number of Model instances that the Proxy indicates exist. This will usually differ from getCount when using paging - getCount returns the number of records loaded into the Store at the moment, getTotalCount returns the number of records that could be loaded into the Store if the Store contained all data

getUpdatedRecords : Array

Returns all Model instances that have been updated in the Store but not yet synchronized with the Proxy

hasListener( String eventName ) : Boolean

Checks to see if this object has any listeners for a specified event

Parameters

eventName : String
The name of the event to check for

Returns

Boolean True if the event is being listened for, else false

indexOf( Ext.data.Model record ) : Number

Get the index within the cache of the passed Record.

Parameters

record : Ext.data.Model
The Ext.data.Model object to find.

Returns

Number The index of the passed Record. Returns -1 if not found.

indexOfId( String id ) : Number

Get the index within the cache of the Record with the passed id.

Parameters

id : String
The id of the Record to find.

Returns

Number The index of the Record. Returns -1 if not found.

insert( Number index, Ext.data.Model[] records ) : Void

Inserts Model instances into the Store at the given index and fires the add event. See also add.

Inserts Model instances into the Store at the given index and fires the add event. See also add.

Parameters

index : Number
The start index at which to insert the passed Records.
records : Ext.data.Model[]
An Array of Ext.data.Model objects to add to the cache.

Returns

Void

isFiltered : Boolean

Returns true if this store is currently filtered

isLoading : Boolean

Returns true if the Store is currently performing a load operation

last : Ext.data.Model/undefined

Convenience function for getting the last model instance in the store

load( Object/Function options ) : Void

Loads data into the Store via the configured proxy. This uses the Proxy to make an asynchronous call to whatever stor...

Loads data into the Store via the configured proxy. This uses the Proxy to make an asynchronous call to whatever storage backend the Proxy uses, automatically adding the retrieved instances into the Store and calling an optional callback if required. Example usage:

store.load({
    scope   : this,
    callback: function(records, operation, success) {
        //the operation object contains all of the details of the load operation
        console.log(records);
    }
});

If the callback scope does not need to be set, a function can simply be passed:

store.load(function(records, operation, success) {
    console.log('loaded records');
});

Parameters

options : Object/Function
Optional config object, passed into the Ext.data.Operation object before loading.

Returns

Void

loadData( Array data, Boolean append ) : Void

Loads an array of data straight into the Store

Parameters

data : Array
Array of data to load. Any non-model instances will be cast into model instances first
append : Boolean
True to add the records to the existing records in the store, false to remove the old ones first

Returns

Void

loadPage( Number page ) : Void

Loads a given 'page' of data by setting the start and limit values appropriately. Internally this just causes a norma...

Loads a given 'page' of data by setting the start and limit values appropriately. Internally this just causes a normal load operation, passing in calculated 'start' and 'limit' params

Parameters

page : Number
The number of the page to load

Returns

Void

loadRecords( Array records, Boolean add ) : Void

Loads an array of {@Ext.data.Model model} instances into the store, fires the datachanged event. This should only usu...

Loads an array of {@Ext.data.Model model} instances into the store, fires the datachanged event. This should only usually be called internally when loading from the Proxy, when adding records manually use add instead

Parameters

records : Array
The array of records to load
add : Boolean
True to add these records to the existing records, false to remove the Store's existing records first

Returns

Void

nextPage : Void

Loads the next 'page' in the current data set

observe( Function c, Object listeners ) : Void

Sets observability on the passed class constructor. This makes any event fired on any instance of the passed class al...

Sets observability on the passed class constructor.

This makes any event fired on any instance of the passed class also fire a single event through the class allowing for central handling of events on many instances at once.

Usage:

Ext.util.Observable.observe(Ext.data.Connection);
        Ext.data.Connection.on('beforerequest', function(con, options) {
            console.log('Ajax request made to ' + options.url);
        });

Parameters

c : Function
The class constructor to make observable.
listeners : Object
An object containing a series of listeners to add. See addListener.

Returns

Void

previousPage : Void

Loads the previous 'page' in the current data set

queryBy( Function fn, [Object scope] ) : MixedCollection

Query the cached records in this Store using a filtering function. The specified function will be called with each re...

Query the cached records in this Store using a filtering function. The specified function will be called with each record in this Store. If the function returns true the record is included in the results.

Parameters

fn : Function
The function to be called. It will be passed the following parameters:
- record : Ext.data.Record
  The record to test for filtering. Access field values using Ext.data.Record.get.
- id : Object
  The ID of the Record passed.
scope : Object
(optional) The scope (this reference) in which the function is executed. Defaults to this Store.

Returns

MixedCollection Returns an Ext.util.MixedCollection of the matched records

relayEvents( Object origin, Array events ) : Void

Relays selected events from the specified Observable as if the events were fired by this.

Relays selected events from the specified Observable as if the events were fired by this.

Parameters

origin : Object
The Observable whose events this object is to relay.
events : Array
Array of event names to relay.

Returns

Void

releaseCapture( Observable o ) : Void

Removes all added captures from the Observable.

Removes all added captures from the Observable.

Parameters

o : Observable
The Observable to release

Returns

Void

remove( Ext.data.Model/Array records ) : Void

Removes the given record from the Store, firing the 'remove' event for each instance that is removed, plus a single '...

Removes the given record from the Store, firing the 'remove' event for each instance that is removed, plus a single 'datachanged' event after removal.

Parameters

records : Ext.data.Model/Array
The Ext.data.Model instance or array of instances to remove

Returns

Void

removeAt( Number index ) : Void

Removes the model instance at the given index

Parameters

index : Number
The record index

Returns

Void

removeListener( String eventName, Function handler, [Object scope] ) : Void

Removes an event handler.

Parameters

eventName : String
The type of event the handler was associated with.
handler : Function
The handler to remove. This must be a reference to the function passed into the addListener call.
scope : Object
(optional) The scope originally specified for the handler.

Returns

Void

removeManagedListener( Observable|Element item, Object|String ename, Function fn, Object scope ) : Void

Removes listeners that were added by the mon method.

Parameters

item : Observable|Element
The item from which to remove a listener/listeners.
ename : Object|String
The event name, or an object containing event name properties.
fn : Function
Optional. If the ename parameter was an event name, this is the handler function.
scope : Object
Optional. If the ename parameter was an event name, this is the scope (this reference) in which the handler function is executed.

Returns

Void

resumeEvents : Void

Resume firing events. (see suspendEvents) If events were suspended using the queueSuspended parameter, then all event...

Resume firing events. (see suspendEvents) If events were suspended using the queueSuspended parameter, then all events fired during event suspension will be sent to any listeners now.

setProxy( String|Object|Ext.data.Proxy proxy ) : Ext.data.Proxy

Sets the Store's Proxy by string, config object or Proxy instance

Parameters

proxy : String|Object|Ext.data.Proxy
The new Proxy, which can be either a type string, a configuration object or an Ext.data.Proxy instance

Returns

Ext.data.Proxy The attached Proxy object

sort( String|Array sorters, String direction ) : Void

Sorts the data in the Store by one or more of its properties. Example usage: //sort by a single field myStore.sort('m...

Sorts the data in the Store by one or more of its properties. Example usage:

//sort by a single field
myStore.sort('myField', 'DESC');

//sorting by multiple fields
myStore.sort([
    {
        property : 'age',
        direction: 'ASC'
    },
    {
        property : 'name',
        direction: 'DESC'
    }
]);

Internally, Store converts the passed arguments into an array of Ext.util.Sorter instances, and delegates the actual sorting to its internal Ext.util.MixedCollection.

When passing a single string argument to sort, Store maintains a ASC/DESC toggler per field, so this code:

store.sort('myField');
store.sort('myField');

Is equivalent to this code, because Store handles the toggling automatically:

store.sort('myField', 'ASC');
store.sort('myField', 'DESC');

Parameters

sorters : String|Array
Either a string name of one of the fields in this Store's configured Model, or an Array of sorter configurations.
direction : String
The overall direction to sort the data by. Defaults to "ASC".

Returns

Void

sum( String property, [Number start], [Number end] ) : Number

Sums the value of property for each record between start and end and returns the result.

Sums the value of property for each record between start and end and returns the result.

Parameters

property : String
A field in each record
start : Number
(optional) The record index to start at (defaults to 0)
end : Number
(optional) The last record index to include (defaults to length - 1)

Returns

Number The sum

suspendEvents( Boolean queueSuspended ) : Void

Suspend the firing of all events. (see resumeEvents)

Parameters

queueSuspended : Boolean
Pass as true to queue up suspended events to be fired after the resumeEvents call instead of discarding all suspended events;

Returns

Void

sync : Void

Synchronizes the Store with its Proxy. This asks the Proxy to batch together any new, updated and deleted records in ...

Synchronizes the Store with its Proxy. This asks the Proxy to batch together any new, updated and deleted records in the store, updating the Store's internal representation of the records as each operation completes.

Events

add( Ext.data.Store store, Array records, Number index )

Fired when a Model instance has been added to this Store

Parameters

store : Ext.data.Store
The store
records : Array
The Model instances that were added
index : Number
The index at which the instances were inserted

Returns

Void

beforeload( Ext.data.Store store, Ext.data.Operation operation )

Event description

Parameters

store : Ext.data.Store
This Store
operation : Ext.data.Operation
The Ext.data.Operation object that will be passed to the Proxy to load the Store

Returns

Void

beforesync( Object options )

Called before a call to sync is executed. Return false from any listener to cancel the synv

Parameters

options : Object
Hash of all records to be synchronized, broken down into create, update and destroy

Returns

Void

datachanged( Ext.data.Store this )

Fires whenever the records in the Store have changed in some way - this could include adding or removing records, or ...

Fires whenever the records in the Store have changed in some way - this could include adding or removing records, or updating the data in existing records

Parameters

this : Ext.data.Store
The data store

Returns

Void

load( Ext.data.store this, Array records, Boolean successful )

Fires whenever the store reads data from a remote data source.

Parameters

this : Ext.data.store
records : Array
An array of records
successful : Boolean
True if the operation was successful.

Returns

Void

remove( Ext.data.Store store, Ext.data.Model record, Number index )

Fired when a Model instance has been removed from this Store

Parameters

store : Ext.data.Store
The Store object
record : Ext.data.Model
The record that was removed
index : Number
The index of the record that was removed

Returns

Void

update( Store this, Ext.data.Model record, String operation )

Fires when a Record has been updated

Parameters

this : Store
record : Ext.data.Model
The Model instance that was updated

operation : String

The update operation being performed. Value may be one of:

Ext.data.Model.EDIT
               Ext.data.Model.REJECT
               Ext.data.Model.COMMIT

Returns

Void

Sencha Documentation

Ext.data.Store

Super classes

Sub classes

Mixins

Config Options

Properties

Methods

Parameters

Returns

Parameters

Returns

Parameters

Returns

Parameters

Returns

Parameters

Returns

Parameters

Returns

Parameters

Returns

Parameters

Returns

Parameters

Returns

Parameters

Returns

Parameters

Returns

Parameters

Returns

Parameters

Returns

Parameters

Returns

Parameters

Returns

Parameters

Returns

Parameters

Returns

Parameters

Returns

Parameters

Returns

Parameters

Returns

Parameters

Returns

Parameters

Returns

Parameters

Returns

Parameters

Returns

Parameters

Returns

Parameters

Returns

Parameters

Returns

Parameters

Returns

Parameters

Returns

Parameters

Returns

Parameters

Returns

Parameters

Returns

Parameters

Returns

Parameters

Returns

Parameters

Returns

Parameters

Returns