Hands-On Sencha Touch 2

Chapter 9. Data Stores

A data store is a mechanism to cache your data and is part of the Ext.data package. It is like a bucket full of data records. You can pick (select) a record out of this bucket (the data store) and add or remove records. Stores also provide functions for sorting, filtering, and grouping the model instances. You’ll need to give a model structure to the store with data. You can do this inline by setting the fields and data arrays (hardcoded), but a better MVC approach is to bind a model to the data store.

Sencha Touch has data-aware components—such as lists, dataviews, and charts—that need to be hooked up to a store in order to display data. I will discuss those in Chapter 11.

In this chapter, you’ll learn:

• How to load data in a store
• How to sort a data store locally
• How to sort data on a server
• How to group a data store
• How to filter a data store locally
• How to filter a data store on a server
• How to save/sync data in a store

Loading Data in a Store

For the FindACab app to be able to display the data, the data needs to be contained in the store. By default, when you create a store (and the data is not hardcoded), you will have to load the model data into your store.

When autoLoad is not enabled, you have to manually load the store from your code, or from your developer’s console:

Ext.getStore('MyStore').load(this, records, successful, operation, eOpts);

Note

Ext.getStore("MyStore") is a lookup method; it finds a store (if the store is registered ...