Ext.onReady(function(){
var cm=new Ext.grid.ColumnModel([{
header:"id",// 列名
dataIndex:"id" // 與fields一一對應
},{
header:"姓名",
dataIndex:"name" // 與fields一一對應
},{
header:"Email",
dataIndex:"email" // 與fields一一對應
},{
header:"性別",
dataIndex:"sex" // 與fields一一對應
},{
header:"年齡",
dataIndex:"age" // 與fields一一對應
}]);
var fields=["id","name","email","sex","age"];// 字段的描述,指列
var data=[["1","lang","[email protected]","0","20"],
["2","lang","[email protected]","0","20"],
["3","lang","[email protected]","0","20"],
["4","lang","[email protected]","0","20"],
["5","lang","[email protected]","0","20"]];// 行,與field一一匹配,本地數據取值方式
// store表示數據存儲器
var store=new Ext.data.SimpleStore({
fields:fields,
data:data
})
var grid=new Ext.grid.GridPanel({
title:'gridpanel',
cm:cm,
store:store,
autoHeight:true
})
grid.render(Ext.getBody());
})
<%@ page language="java" contentType="text/html; charset=gb2312"
pageEncoding="gb2312"%>
<%
request.setAttribute("base", request.getContextPath());
%>
<html>
<head>
<title>gridpanel數據展示</title>
<link rel="stylesheet" type="text/css"
href="${base}/script/ext/resources/css/ext-all.css">
<script type="text/javascript"
src="${base}/script/ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="${base}/script/ext/ext-all.js"></script>
<script type="text/javascript" src="${base}/user/grid_simple.js"></script>
</head>
<body>
</body>
</html>
