Ext.js Data - Ext JS

What is the use of Data package in ExtJS?

Data package is used for loading and saving data in the application. Data package has various number of classes but the most important classes are:

  1. Modal
  2. Store
  3. Proxy


Base class for modal is Ext.data.Model and it represents an entity in the application. It binds the store data to view and has mapping of backend data objects to view dataIndex. Data is fetched with the help of store.

Creating a Model:

Ext.data.Model class has to be extended for creating a model and field name and mapping should be defined.

Here the name should be same as dataIndex which is declared in the view. Mapping should match the data either static or dynamic from database which is to be fetched using store.


Base class for store is Ext.data.Store and it contains the data locally cached with the help of model objects which is to be rendered on view. Store fetches data using proxies which has path defined for services for fetching backend data. Store data can be fetched in two ways static or dynamic.

Static store:

For static store, all the data present in the store as shown below:

Dynamic store:

Dynamic data can be fetched from Ajax, Rest and Json using proxy.


Base class for proxy is Ext.data.proxy.Proxy and is used by Models and Stores for handling loading and saving of Model data.

There are 2 types of proxies:

  1. Client Proxy
  2. Server Proxy

Client Proxy

Client proxies include Memory and Local Storage using HTML5 local storage.

Server Proxy

Server proxies handle data from remote server using Ajax, Json data and Rest service.

Defining proxies in the server:

All rights reserved © 2018 Wisdom IT Services India Pvt. Ltd DMCA.com Protection Status

Ext JS Topics