ExtJS入门案例
1、下载extjs-4.1.1.zip和ExtJs4.1.0API中文版V0.4Beta.rar，然后解压。下载地址http://pan.baidu.com/s/1qW1eLkw
2、打开MyEclipse，新建项目java嘛术铹砾web项目extjs，在项目WebRoot下新建JS文件夹，把extjs-4.1.1文件夹里的ext-a造婷用痃ll.js复制到项目JS文件夹和resources文件夹复制到项目WebRoot下。
3、修改index.jsp，改为如下内容<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%><%String path = request.getContextPath();String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html> <head> <base href="<%=basePath%>"> <title>extjs入门案例</title> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="cache-control" content="no-cache"> <meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="This is my page"> <link rel="stylesheet" type="text/css" href="resources/css/ext-all-gray.css"> <script type="text/javascript" src="JS/ext-all.js"></script> </head> <body> <script type="text/javascript"> Ext.onReady(function(){ var store=Ext.create('Ext.data.TreeStore',{ root:{ expanded:true, children:[ { text:"菜单1", expanded:true, children:[ {text:"子菜单1",leaf:true} ] }, { text:"菜单2",leaf:true } ] } }); var viewport=new Ext.Viewport({ layout:'border', renderTo:Ext.getBody(), items:[{ title:'extjs入门案例', region:'north', height:100, minsize:100, maxsize:120 },{ title:'菜单', width:120, store:store, region:'west', rootVisible:false, xtype:'treepanel', split:true, border:true, collapsible:true, minsize:120, maxsize:200, listeners:{ itemclick:function(view,record,item,index,e,eOpts){ alert(index); } } },Ext.create('Ext.panel.Panel',{ id:'center', title:'table', layout:'border', region:'center' })] }) }); </script> </body></html>
4、把项目发布到tomcat,并启动tomcat服务器。
5、打开浏览器，输入http://localhost:8080/extjs,如果出现如下内容则入门案例开发成功。
6、打开ExtJs4.1.0API中文版V0.4Beta文件夹，双击index.html,出现如下界面界面。
7、以Ext.data.TreeStore为例，说明如何查看开发文档。在inde垓矗梅吒x.html搜索框输入Ext.data.TreeStore，出现如下界诹鬃蛭镲面。configs配置项properties属性methods方法events事件。单击configs，选择root配置项，即可查看root如何配置。
