EXT实现表格显示

以下是JS代码：

1. Ext.onReady(function() {
3.             // 定义表头
4.             var cm = new Ext.grid.ColumnModel([{
5.                         header : "id",
6.                         dataIndex : "id"
7.                     }, {
8.                         header : "姓名",
9.                         dataIndex : "name"
10.                     }, {
11.                         header : "性别",
12.                         dataIndex : "sex"
13.                     },{
14.                         header : "email",
15.                         dataIndex : "email"
16.                     },  {
17.                         header : "年龄",
18.                         dataIndex : "age"
19.                     }]);
21.             // 相当于数据库字段的描述
22.             // 数据库定义结构
23.             var ff = ["id", "name", "email", "sex", "age"];
25.             
26.             
27.             
28.           //***********************************************         
29.             var data = [["1", "ACCP1", "shenzhen_zsw@163.com", "男", "20"],
30.                     ["2", "ACCP2", "shenzhen_zsw1@163.com", "男", "20"],
31.                     ["3", "ACCP3", "shenzhen_zsw2@163.com", "男", "20"],
32.                     ["4", "ACCP4", "shenzhen_zsw3@163.com", "男", "20"],
33.                     ["5", "ACCP5", "shenzhen_zsw4@163.com", "男", "20"]];
35.             var store = new Ext.data.SimpleStore({
36.                         fields : ff,
37.                         data : data
38.                     });
39.          //***********************************************
40.                     
41.                                       
42.                     
43.                     
44.             //创建一个表格面板
45.             var grid = new Ext.grid.GridPanel({
46.                         title:'ACCP_ZSW', //表格标题
47.                         cm : cm,          //表格的表头
48.                         store : store,    //表格
49.                         width:500,
50.                         height:200
51.                     });
53.             grid.render('zsw'); //加载当页面中相应的标签
55.         });

 

以下是html代码：

1. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
2. <link rel="stylesheet" type="text/css" href="ext/resources/css/ext-all.css" />
3. <script type="text/javascript" src="ext/ext-base.js"></script>
4. <script type="text/javascript" src="ext/ext-all.js"></script>
5. <script type="text/javascript" src="ext/ext-lang-zh_CN.js"></script>
7. <script type="text/javascript" src="js/table.js"></script>
8.         SimpleStore:<br>
9.         fields : ff 和 data : data,
10.  <div id="zsw"></div>