ext入门手册

ext入门手册内容摘要：

renderTo:(), ds: ds, cm: cm, width:300, autoHeight:true })。 })。 XX 项目业务需求说明书 第 15 页 共 16 页 这里只做了些简单的示例演示，如果想详细了解表格控件请查阅 EXT 相关资料和书籍 树形控件 树控件由 类定义，控件的名称为 treepanel， TreePanel 类继承自 Panel 面板。 在 ExtJS 中使用树控件其实非常简单，我们先来看下面的代码 一个简单的树 (function(){ var root=new ({ id:root, text:树的根 })。 (new ({ id:c1, text:子节点 2 }))。 (new ({ id:c2, text:子节点 2 }))。 var tree=new ({ renderTo:() , root:root, width:100 })。 XX 项目业务需求说明书 第 16 页 共 16 页 })。 树的节点信息。 ExtJS 的树控件提供了对这种功能的支持，你只需要在创建树控件的时候，通过给树指定一个节点加载器，可以用来从服务器端动态加载树的节点 信息。 我们来看下面的代码： (function(){ =39。 images/default/39。 var root = new ({ expanded:true, text:39。 系统菜单 39。 , id:101,//默认为 0 draggable : false, iconCls:b })。 var tree = new ({ title:39。 树形结构 39。 , root : root, border:false, autoHeight:true, renderTo : (), autoScroll : true,//显示滚动条 animate : true,//true表示使用动画展开 /折叠 enableDD : true,//允许拖放 containerScroll : true,//登记本容器 ScrollManager listeners : {//在加载之前的一个监听事件 XX 项目业务需求说明书 第 17 页 共 16 页 39。 beforeload39。 : function(node) { //alert()。 //得到的节点 = new ({//树节点的数据来源 url : ?id=+,//请求的路径 baseParams : {//请求参数 //id : } })。 } } })。 })。 后台 action 代码 package action。 import。 import。 import。 import。 import。 import。 import。 import。 import。 import。 public class TreeAction extends DispatchAction { public ActionForward getTreeDate(ActionMapping mapping, ActionForm form, HttpServletRequest request, HttpServletResponse response) throws IOException { (charset=UTF8)。 String parentId=(id)。 UserDAO userDao=new UserDAO()。 List lst=(parentId)。 String json=(lst)。 (json)。 ().write(json)。 return null。 } } XX 项目业务需求说明书 第 18 页 共 16 页 这是把 Bean 转换成 JSON和 XML 的帮助类 ，详细内容就不 做 解释了，看代码 就能明白一 切 ， 此类需要加载的 jar包 package util。 import。 import。 import。 import。 import。 import。 import。 public class ExtHelper { //把 list数据转换成 json格式的数据 public static String getJsonFromList(long recordTotal,List beanList){ TotalJson total=new TotalJson()。 (recordTotal)。 (beanList)。 JSONObject jsonArray=(total)。 return ()。 } //把 list数据转换成 xml格式的数据 public static String getXmlFromList(long recordTotal,List beanList){ TotalJson total=new TotalJson()。 (recordTotal)。 List results=new ArrayList()。 (total)。 (beanList)。 XStream xs=new XStream(new DomDriver())。 for (int i = 0。 i ()。 i++) { Class c=(i).getClass()。 String b=()。 String[] temp=(\\.)。 (temp[], c)。 XX 项目业务需求说明书 第 19 页 共 16 页 } String xml=?xml version=\\ encoding=\utf8\?\n+(results)。 return xml。 } //把 list数据转换成 JsonArray格式的数据 public static String listToJsonArray(List obj){ JSONArray json=(obj)。 return ()。 } } TotalJson 类 package bean。 import。 public class TotalJson { private long results。 private List items。 public long getResults() { return results。 } public void setResults(long results) { = results。 } public List getItems() { return items。 } public void setItems(List items) { = items。 } } 表单控件 Form 表单在 web 应用中处于非常重要的地位，时刻都在使用表单收集用户信息与交互，并将收集到的有用信息提交到后台服务器，表单是客户端与服务器之间通信的主要桥梁。 表达能力有限，描述性的东西我就不多说了 ，如果你用上了 Ext 你就慢慢能理解它了。 我们还是先看代码 : XX 项目业务需求说明书 第 20 页 共 16 页 (function(){ =39。 images/default/39。 var formPanel=new ({ title:39。 LOGIN39。 , id:39。 elId39。 , autoHeight:true, x:200, y:200, width:300, renderTo:(), frame:true, cls:39。 textalign:center39。 , labelAlign:39。 center39。 , items:[{ xtype:39。 textfield39。 , name:39。 username39。 , fieldLabel:39。 username39。 , allowBlank:false, blankText:39。 请输入用户名 39。 , msgTarget:39。 under39。 },{ xtype:39。 textfield39。 , fieldLabel:39。 password39。 , name:39。 pwd39。 , allowBlank:false, inputType:39。 password39。 , blankText:39。 密码不能为空 39。 , msgTarget:39。 under39。 }], buttonAlign:39。 center39。 , buttons:[{ xtype:39。 button39。 , text:39。 login39。 , scope:this, handler:login },{ xtype:39。 button39。 , text:39。 reset39。 , scope:this, handler:reset }] })。 //登录方法 XX 项目业务需求说明书 第 21 页 共 16 页 function login(){ ({ clientValidation:true, waitMsg:39。 正在登录系统请稍候 ……39。 , url:39。 ?method=login39。 ,//去到后台服务 器的地址 method:39。 POST39。 , //成功 success:function(form, action){ (39。 提示 39。 ,39。 系统登录成功 39。 )。 }, //失败 failure:function(form,action){ (39。 提示 39。 ,39。 系统登录失败 39。 )。 } })。 } //重置的方法 function reset(){ ()。 } })。 //后台 action的方法 public ActionForward login(。