May 09, 2021 Extjs
Packets are used to load and save all the data in the application.
Packets have many classes, but the most important are:
Ext.define('StudentDataModel', { extend: 'Ext.data.Model', fields: [ {name: 'name', mapping : 'name'}, {name: 'age', mapping : 'age'}, {name: 'marks', mapping : 'marks'} ] });
The name here should be the same as the dataIndex we declared in the view, and the mapping should match the static or dynamic data obtained from the database using the store.
Store's base class is Ext.data.Store. /b10> It contains locally cached data that will be rendered on the view with the help of model objects. /b11> The store uses a proxy to get data, and the agent has a path defined for the service to get back-end data.
Stored data can be obtained either statically or dynamically.
For static storage, we will store all the data in the store as follows:
Ext.create('Ext.data.Store', { model: 'StudentDataModel', data: [ { name : "Asha", age : "16", marks : "90" }, { name : "Vinit", age : "18", marks : "95" }, { name : "Anand", age : "20", marks : "68" }, { name : "Niharika", age : "21", marks : "86" }, { name : "Manali", age : "22", marks : "57" } ]; });
You can use agents to get dynamic data. /b10> We can let agents get data from Ajax, Rest and Johnson.
The agent's base class is Ext.data.proxy.Proxy. /b10> Agents are used by models and stores to process the loading and saving of model data.
There are two types of agents:
Client agents include memory stored locally using HTML5 and local storage.
Server agents use Ajax, Json data, and Rest services to process data from remote servers.
Ext.create('Ext.data.Store', { model: 'StudentDataModel', proxy : { type : 'rest', actionMethods : { read : 'POST' // Get or Post type based on requirement }, url : 'restUrlPathOrJsonFilePath', // here we have to include the rest URL path which fetches data from database or Json file path where the data is stored reader: { type : 'json', // the type of data which is fetched is of JSON type root : 'data' }, } });