以前Ext和后台交互都通过了Dwr,dwr返回一个Object,然后将object赋值给一个javascript变量，然后将它和datagrid绑定。
这几天做页面改造想把dwr去掉不使用dwr获取数据，而使用ext直接获取，传输格式为Json
cw_gxzt.js 此页面显示用户构造Datagrid
Ext.namespace('com.greatchn.finance.js.view');com.greatchn.finance.js.view.cw_gxzt = function() {};Ext.applyIf(com.greatchn.finance.js.view.cw_gxzt.prototype, { cw_gxztservice:null, init:function(){ this.cw_gxztservice=new com.greatchn.finance.js.service.cw_gxztService(); var wjsZtInfoStore=this.cw_gxztservice.queryWjsZtInfo('cwGxzt.do?method=queryWjsZtlinkAndQyinfo','post','');//为接收的帐套store /***grid**/ this.wjsgxztGrid=new Ext.grid.EditorGridPanel({ title: '未接受的帐套', header: false, viewConfig: { forceFit:true }, applyTo:'mydiv', frame:true, height:500, width:520, autoScoll:true, layout:"fit", store:wjsZtInfoStore, sm: new Ext.grid.CheckboxSelectionModel(), columns: [new Ext.grid.RowNumberer(), new Ext.grid.CheckboxSelectionModel(), { header: "帐套名称", dataIndex: "ztmc", sortable: true } ] }); }});
cw_gxztService.js 获取store
Ext.namespace("com.greatchn.finance.js.service");com.greatchn.finance.js.service.cw_gxztService = function() {};Ext.applyIf(com.greatchn.finance.js.service.cw_gxztService.prototype, { /**获取store信息**/ queryWjsZtInfo : function(url, method, condition) { var store = new com.greatchn.finance.js.store.cw_gxztStore().getStore(); var conn = Ext.lib.Ajax.getConnectionObject().conn; conn.open(method, url, false); conn.send(condition); //alert(conn.responseText); var data=Ext.util.JSON.decode(conn.responseText); store.loadData(data); return store; },})
cw_gxztStore.js 创建grid所需的记录集的格式
Ext.namespace("com.greatchn.finance.js.store");com.greatchn.finance.js.store.cw_gxztStore = function(){};Ext.applyIf( com.greatchn.finance.js.store.cw_gxztStore.prototype, { getStore: function() { /* 定义记录集 */ var Cwgxzt = Ext.data.Record.create ( [ {name: "ztmc", mapping: "ztmc"}//mapping对应json,name对应gridpanel的dataIndex ] ); /* 定义JsonReader的元数据对象 */ var meta = { root:"Ztdm",//对应json最前面的{Ztdm:[{....}]} id:'ztdm' }; /* 创建JsonReader数据解析器 */ var JsonReader = new Ext.data.JsonReader(meta, Cwgxzt); /* 创建内存代理 */ var memoryProxy = new Ext.data.MemoryProxy(); /* 创建数据集对象 */ var store = new Ext.data.Store ( { proxy:memoryProxy, reader:JsonReader } ); return store; } });
后台请求的action
public ActionForward queryWjsZtlinkAndQyinfo(ActionMapping mapping, ActionForm form, HttpServletRequest request, HttpServletResponse response)throws Exception { // TODO Auto-generated method stub I_0000_ZTManageService service = (I_0000_ZTManageService)this.getService("I_0000_ZTManageService"); List list=service.getZtlinkAndQyinfoListForZtstate("U000019", "G01"); net.sf.json.JSONArray arr = net.sf.json.JSONArray.fromObject(list);//通过JSONLIB将list转成JSON response.setCharacterEncoding("UTF-8"); response.setHeader("Pragma","No-Cache"); response.setHeader("Cache-Control","No-Cache"); response.setDateHeader("Expires", 0); System.out.println(arr.toString()); response.getWriter().write("{Ztdm:"+arr.toString()+"}");//返回给EXT的JSON return null; }
