ext整合DWR小例子.docx

1、ext整合DWR小例子第一步：写个index.jsp页面。 dwr与ext整合 dwr与ext整合 无侵入式整合dwr和ext DWRProxy DWRTreeLoader DWRProxy和Combobox 第二步：分别写出1、2、3、4.jsp.1.jsp 无侵入式整合dwr和ext Ext.BLANK_IMAGE_URL = $ext/resources/images/default/s.gif;Ext.onReady(function() var cm = new Ext.grid.ColumnModel( header:编号,dataIndex:id, header:名称,dataI

2、ndex:name, header:性别,dataIndex:sex, header:邮箱,dataIndex:email, header:电话,dataIndex:tel, header:添加时间,dataIndex:addTime, header:备注,dataIndex:descn ); var store = new Ext.data.JsonStore( fields: id,name,sex,email,tel,addTime,descn ); / 调用dwr取得数据 infoManager.getResult(function(data) store.loadData(data)

3、; ); var grid = new Ext.grid.GridPanel( renderTo: grid, autoHeight:true, store: store, cm: cm );); 无侵入式整合dwr和ext 返回 2.jsp DWRProxy Ext.BLANK_IMAGE_URL = $ext/resources/images/default/s.gif;Ext.onReady(function() var info = Ext.data.Record.create( name: id, type: int, name: name, type: string, name:

4、sex, type: int, name: email, type: string, name: tel, type: string, name: addTime, name: descn, type: string ); var cm = new Ext.grid.ColumnModel( header:编号,dataIndex:id, header:名称,dataIndex:name, header:性别,dataIndex:sex, header:邮箱,dataIndex:email, header:电话,dataIndex:tel, header:添加时间,dataIndex:addT

5、ime, header:备注,dataIndex:descn ); var store = new Ext.data.Store( proxy: new Ext.data.DWRProxy(infoManager.getItems, true), reader: new Ext.data.ListRangeReader( totalProperty: totalSize, root: data, id: id , info), remoteSort: true ); var grid = new Ext.grid.GridPanel( renderTo: grid, /autoHeight:

6、true, height:500, store: store, cm: cm, bbar: new Ext.PagingToolbar( pageSize: 10, store: store, displayInfo: true, displayMsg: 显示第 0 条到 1 条记录，一共 2 条, emptyMsg: 没有记录 ) ); store.load(params:start:0,limit:10);); DWRProxy 返回 3.jsp DWRTreeLoader Ext.BLANK_IMAGE_URL = $ext/resources/images/default/s.gif;

7、Ext.onReady(function() var tree = new Ext.tree.TreePanel( el: tree, loader: new Ext.tree.DWRTreeLoader(dataUrl: treeNodeManager.getTree) ); var root = new Ext.tree.AsyncTreeNode( id: 0, text:偶是根 ); tree.setRootNode(root); tree.render(); root.expand();); DWRTreeLoader 返回 4.jsp DWRProxy和ComboBox Ext.B

8、LANK_IMAGE_URL = $ext/resources/images/default/s.gif;Ext.onReady(function() var info = Ext.data.Record.create( name: id, type: int, name: name, type: string ); var store = new Ext.data.Store( proxy: new Ext.data.DWRProxy(infoManager.getItems, true), reader: new Ext.data.ListRangeReader( totalPropert

9、y: totalSize, root: data, id: id , info) ); var combo = new Ext.form.ComboBox( store: store, displayField: name, valueField: id, triggerAction: all, typeAhead: true, mode: remote, emptyText: 请选择, selectOnFocus: true ); combo.render(combo);); DWRProxy和ComboBox 返回 第三步：public class Info /实体类s private l

10、ong id; private String name; private int sex; private String email; private String tel; private Date addTime; private String descn;加上get和set方法。package dwr;import java.util.ArrayList;import java.util.Date;import java.util.List;import java.util.Map;public class InfoManager private List infoList = new

11、ArrayList(); public InfoManager() for (int i = 0; i 30; i+) Info info = new Info(); info.setId(i); info.setName(name + i); info.setSex(i%2); info.setEmail(xyz20003); info.setTel( + i); info.setAddTime(new Date(); info.setDescn(descn + i); infoList.add(info); public List getResult() return infoList;

12、public ListRange getItems(Map conditions) int start = 0; int pageSize = 10; / int pageNo = (start / pageSize) + 1; try start = Integer.parseInt(conditions.get(start).toString(); pageSize = Integer.parseInt(conditions.get(limit).toString(); / pageNo = (start / pageSize) + 1; catch (Exception ex) ex.printStackTrace(); int end = start