当前位置: 代码迷 >> JavaScript >> extjs proxy reader store 用法及例证
  详细解决方案

extjs proxy reader store 用法及例证

热度:716   发布时间:2012-08-11 20:50:31.0
extjs proxy reader store 用法及例子

Ext.onReady(function(){

?var cities=[

?[1,"北京"],

?[2,"上海"],

?[3,"广州"],

?[4,"深圳"],

?[5,"天津"]

?];

?var city=Ext.data.Record.create([

?{

? name:"cid",type:"int",mapping:0

?},

?{

? ?name:"cname",type:"string",mapping:1

?}

?]);

?var proxy=new Ext.data.MemoryProxy(cities);

?var reader=new Ext.data.ArrayReader({},city);

?var store=new Ext.data.Store({

?proxy:proxy,

?reader:reader,

?autoLoad:true//即使加载

?});

?var box=new Ext.form.ComboBox({

?renderTo:Ext.getBody(),

?store:store,

?triggerAction:"all",

?displayField:"cname",

?valueField:"cid",

?mode:"local",

?emptyText:"请选择一线城市名称:"

?});

});


ext.data 最主要的功能是获取和组织数据结构,并和特定控件联系起来,于是,Ext.data成了数据的来源,控制负责显示数据。


?DataProxy:获取想要的数据,通过他能得到来自不同地方的数据,如数组、远程服务?

器,并组织成不同的格式。?

?DataReader:定义数据项的逻辑结构,一个数据项有很多列,每列的名称是什么,分别?

是什么数据类型,都由该类来定义。另外,还负责对不同格式的数据进行读取和解析。?

?Store:存储器,用于整合 Proxy 和 Reader,控索取数据时通常和他打交道。?

?Ext.data. DataProxy 就是来源这样一种灵感。?


?Ext.data.DataProxy ?是获取数据的代理,数据可能来自于内存,可能来自于同一域的远?

程服务器数据,更有可能来自于不同域的远程服务器数据。?


?但是,在实际应用中,我们不会直接使用 ?Ext.data.DataProxy,而是使用他的子类:?

?MemoryProxy、HttpProxy 和 ScriptTagProxy,他们的作用分别是:?

?MemoryProxy:获取来自内存的数据,可以是数组、json 或者 xml。?

?HttpProxy:使用 HTTP 协议通过 ajax 从远程服务器获取数据的代理,需要指定 url。?

?ScriptTagProxy:功能和 HttpProxy 一样,但支持跨域获取数据, ? 是实现时有点偷鸡摸?

狗。?


我们定义了一个 City 的结构,通过 Ext.data.Record.create 创建,参数是一个 json 对象数组,name 和 type 分别表示每一列的名称和数据类型,mapping 是列值与数组元素的映射关?

Record ?创建 好 后 , 必须 和 ?DataReader ?关 联 , DataReader ?也 同样有 三 个 子 类:?

Ext.data.ArrayReader、Ext.data.JsonReader、Ext.data.XmlReader。我之前说过 DataReader从来不单独行动,使用哪一个子类主要取决 ? ? DataProxy 中封装的数据类型,如果是数组,则使用 Ext.data.ArrayReader;如果是 json,则使用 Ext.data.JsonReader;如果是 xml,则使用?

Ext.data.XmlReader。在本教程中,我打算将 ?xml ?封杀。我不喜欢这个东西(尽管有时候不?

得不面对) ?。相对而言,我更热衷 ? ?轻量级的 jsonObject。?


Ext.data.Record 并没有固定的结构,他保存的是一个 json 对 象数组,数组的元素个数由列的数量来决定。


  相关解决方案