一: Ajax获取Json对象
Ext.onReady(function(){//声明一个模型类 , 相当于classExt.define("Person",{extend:"Ext.data.Model",fields:[ {name:'name',type:'atuo'}, {name:'age',type:'int'} ], //==>代理类的实例 proxy:{ type:"ajax", url:"fakeData.jsp" //model不用配置 ,因为就生成在model内部 }});var p = Ext.ModelMgr.getModel( "Person" );//用ModelMgr获得相应Model目的是后边的load方法//==>用Model类的load()方法获取数据 (比较底层的方法)p.load( null , { //第一个参数默认是"{id:XX}"scope:this,failure:function(record , operation)//后边三个参数是回调函数 {alert(record);},success: function(record , operation){alert(record.data.name + "__" + record.data.age);},callback:function(record , operation){}});});
同一文件夹下: fakeData.jsp
<%@ page language="java" contentType="text/html" pageEncoding="UTF-8"%><%response.getWriter().write( "{name:'rt' , age:24}" );%>二:用Ext.data.proxy.Ajax对象实现ajax
Ext.onReady(function(){//模型类 , 相当于classExt.define("person",{extend:"Ext.data.Model",fields:[ {name:'name',type:'string'}, {name:'age',type:'int'} ]});//==>代理对象 , 用对象的 doRequest()方法获取数据var ajaxProxyObj = Ext.create("Ext.data.proxy.Ajax",{url : "fakeData.jsp",model : "person",reader : "json",limitParam : "indexParm" //参数未修改前默认叫"limit" , 通过这类描述可以修改字段名称});//拿到回应中的字串( 没decode解码), 和转成原生Js对象ajaxProxyObj.doRequest( new Ext.data.Operation({action:"read",//读方式//后台能拿到其余参数的json对象, 再做处理 最终再返回前台limit:3,//分页数据start:1,sorters:[ //排序数组 Ext.util.Sorter { property:"name", direction:"ASC" },{ property:"age", direction:"ASC" } ]//还可以实现过滤器, 分组}) , function(obj){alert(obj);//chrome的F12调试工具 Sources , 右侧Scope Variablesvar txt = obj.response.responseText;////拿到回应中的字串( 没decode解码)alert( Ext.JSON.decode(txt)['name'] );//解码成一个对象(但是不是model,仅是原生Js对象)});});三: 用localstorage代理 , 代替cookies
Ext.onReady(function(){//模型类 , 相当于classExt.define("person",{extend:"Ext.data.Model",fields:[ {name:'name',type:'string'}, {name:'age',type:'int'} ], //==>代理类 , 用Model类的load()方法获取数据 proxy:{ type:"localstorage"//,本地存储 , 目的是代替cookies不怕禁用cookies . //model: 配置可以省略, 因为就在本model之中//用 type:"ajax"的话需要配置 url:"fakeData.jsp"// type:"sessionstorage" 相当于session 关闭浏览器后会被删除 //id:"twitter-Searches" }})//==>model的集合是storevar store = Ext.create("Ext.data.Store",{model:person});//添加一条store.add({name:"store添加的", age:7 });//异步保存store.sync();//取出展示store.load();var msgArray = [];store.each( function(v){msgArray.push( v.get('name') + "__" + v.get('age'));});alert(msgArray.join("\n"));var p = Ext.ModelMgr.getModel( "person" );//传入名字p.load( null , {scope:this,failure:function(record , operation){alert(record);},success: function(record , operation){alert(record.data.name);},callback:function(record , operation){}});});
