数据代理proxy是进行数据读写的主要途径
结构图:
Ext.data.proxy.Proxy 代理类的根类(他分为客户端(Client)代理和服务器代理(Server))
Ext.data.proxy.Client 客户端代理
Ext.data.proxy.Memory 普通的内存代理 ----[重点]
Ext.data.proxy.WebStorage 浏览器客户端存储代理
Ext.data.proxy.SessionStorage 浏览器级别代理----[重点]
Ext.data.proxy.LocalStorage 本地化的级别代理(不能夸浏览器)----[重点]
Ext.data.proxy.Server 服务器端代理
Ext.data.proxy.Ajax 异步加载的方式----[重点]
Ext.data.proxy.Rest 一种特殊的Ajax--[知道]
Ext.data.proxy.JsonP 跨域交互的代理----[重点] 跨域是有严重的安全隐患的 extjs的跨域也是需要服务器端坐相应的配合
Ext.data.proxy.Direct 命令.
Ext.data.proxy.Memory
(function(){
Ext.onReady(function(){
Ext.regModel("user",{
fields:[
{name:'name',type:'string'},
{anem:'age',type:'int'}
]
});
//不用create方法 我们直接用proxy来创建对象数据
var userData = [
{name:'uspcat.com',age:1},
{name:'yunfengcheng',age:26}
];
//创建model的代理类
var memoryProxy = Ext.create("Ext.data.proxy.Memory",{
data:userData,
model:'user'
})
userData.push({name:'new uspcat.com',age:1});
//update
memoryProxy.update(new Ext.data.Operation({
action:'update',
data:userData
}),function(result){},this);
//就可以做CRUD了
memoryProxy.read(new Ext.data.Operation({
action:'read'
}),function(result){
var datas = result.resultSet.records;
Ext.Array.each(datas,function(model){
alert(model.get('name'));
})
});
});
})();
Ext.data.proxy.WebStorage
(function(){
Ext.onReady(function(){
Ext.regModel("user",{
fields:[
{name:'name',type:'string'}
],
proxy:{
type:'localstorage',
id : 'twitter-Searches'
}
});
//我们用store来初始化数据
var store = new Ext.data.Store({
model:user
});
store.add({name:'uspcat.com'});
store.sync();
store.load();
var msg = [];
store.each(function(rec){
msg.push(rec.get('name'));
});
alert(msg.join("\n"));
})
})();
Ext.data.proxy.SessionStorage
(function(){
Ext.onReady(function(){
Ext.regModel("user",{
fields:[
{name:'name',type:'string'}
],
proxy:{
type:'sessionstorage',
id : 'twitter-Searches'
}
});
//我们用store来初始化数据
var store = new Ext.data.Store({
model:user
});
store.add({name:'yunfengcheng'});
store.sync();
store.load();
var msg = [];
store.each(function(rec){
msg.push(rec.get('name'));
});
alert(msg.join("\n"));
})
})();
Ext.data.proxy.Ajax
(function(){
Ext.onReady(function(){
Ext.regModel("person",{
fields:[
{name:'name',type:'string'}
]
});
var ajaxProxy = new Ext.data.proxy.Ajax({
url:'person.jsp',
model:'person',
reader:'json',
limitParam : 'indexLimit'
});
ajaxProxy.doRequest(new Ext.data.Operation({
action:'read',
limit:10,
start :1,
sorters:[
new Ext.util.Sorter({
property:'name',
direction:'ASC'
})
]
}),function(o){
var text = o.response.responseText;
alert(Ext.JSON.decode(text)['name']); //解码
});
});
})();
Ext.data.proxy.JsonP
后台返回要求:
Ext.data.JsonP.callback1(json对象);
js:
(function(){
Ext.onReady(function(){
Ext.regModel("person",{
fields:[
{name:'name',type:'string'}
],
proxy:{
type:'jsonp',
url:'http://www.uspcat.com/extjs/person.php'
}
});
var person = Ext.ModelManager.getModel('person');
person.load(1,{
scope:this,
success:function(model){
alert(model.get('name'));
}
});
});
})();
- 大小: 13.9 KB
分享到:
相关推荐
### Extjs 学习笔记之九:数据模型(上) #### 概述 本文将深入探讨Extjs框架中至关重要的组成部分——数据模型。数据模型在Extjs中扮演着核心角色,它不仅为开发者提供了强大的数据处理能力,还极大地简化了前端与...
在探讨《ExtJS学习心得笔记》这一主题时,我们不仅会深入理解ExtJS框架的核心概念与实践技巧,还会从新手的角度出发,提炼出一系列有助于快速上手的学习策略,避免常见的学习陷阱,确保学习过程高效而有成效。...
【ExtJs 2.1学习笔记】主要涵盖了ExtJs框架的核心概念、组件使用以及数据通信等方面的知识点。以下是对这些内容的详细解析: 1. **ExtJs 结构树**:这部分内容介绍了ExtJs的组件层次结构,包括如何组织和嵌套组件,...
本学习笔记将深入探讨ExtJS 2.1的关键概念和技术,帮助读者掌握这个框架的核心要素。 1. **ExtJs 结构树** 在ExtJS中,应用程序通常基于组件树构建,每个组件都有自己的属性、方法和事件。理解这种结构对于布局...
在这个例子中,`MemoryProxy`被用作数据源,但也可以替换为`ScriptTagProxy`等其他代理,以便从远程服务器加载数据。最后,`GridPanel`对象被创建,指定了渲染目标、数据源、列模型、选择模型等属性。 ### 总结 ...
包括数据行集合的属性名(root)、数据集中全部记录数的属性名(totalProperty)、数据行中用来作为标识的属性名(idProperty)、远程排序的设置(remoteSort)、数据字段的定义(fields)和数据代理(proxy)。...
Ext.data.Store需要与数据代理Ext.data.DataProxy配合,后者定义了从内存或网络获取数据的方式。同时,Ext.data.DataReader负责将原始数据转换为Store可以使用的形式,而Ext.data.DataWriter则负责将数据保存到...
- **ExtJs2.0学习笔记(Ext.Panel篇一/二/三/四)**:这一系列内容分别讲述了`Ext.Panel`的不同方面,如布局管理、事件处理等。 - **ExtJs2.0学习笔记(组件总论篇)**:这是一个综合性的章节,概括了Ext JS 2.0中各种...
13. **extJs 2.0 学习笔记**:这部分笔记涵盖了EXTJS 2.0版本的主要特性,包括Ajax的使用、数据管理基础、Panel的深入理解等,帮助开发者掌握EXTJS的基本用法。 EXTJS的学习是一个不断深入的过程,从基础组件到高级...