<%@ 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>My JSP 'MyJsp.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<script type="text/javascript" src="<%=path%>/js/ext-base.js"></script>
<script type="text/javascript" src="<%=path%>/js/ext-all.js"></script>
<link rel="stylesheet" type="text/css" href="<%=path%>/resources/css/ext-all.css">
<script type="text/javascript">
Ext.onReady(function()
{
var myData = [
['Apple',29.89,0.24,0.81,'9/1 12:00am'],
['Ext',83.81,0.28,0.34,'9/12 12:00am'],
['Google',71.72,0.02,0.03,'10/1 12:00am'],
['Microsoft',52.55,0.01,0.02,'7/4 12:00am'],
['Yahoo!',29.01,0.42,1.47,'5/22 12:00am']
];
var ds = new Ext.data.Store({
proxy: new Ext.data.MemoryProxy(myData),
reader: new Ext.data.ArrayReader({id: 0}, [
{name: 'company'},
{name: 'price', type: 'float'},
{name: 'change', type: 'float'},
{name: 'pctChange', type: 'float'},
{name: 'lastChange', type: 'date', dateFormat: 'n/j h:ia'}
])
});
ds.load();
var colModel = new Ext.grid.ColumnModel([
{header: "Company",sortable: true, dataIndex: 'company'},
{header: "Price", sortable: true, dataIndex: 'price'},
{header: "Change", sortable: true, dataIndex: 'change'},
{header: "% Change", sortable: true, dataIndex: 'pctChange'},
{header: "Last Updated", sortable: true,
renderer: Ext.util.Format.dateRenderer('m/d/Y'), dataIndex: 'lastChange'}
]);
var grid = new Ext.grid.GridPanel({
ds: ds,
//layout:'fit',
autoHeight:true,
autoWidth:true,
//renderTo:'grid-example',
cm: colModel
});
var grid1 = new Ext.grid.GridPanel({
ds: ds,
//layout:'fit',
autoHeight:true,
autoWidth:true,
//renderTo:'grid-example',
cm: colModel
});
var grid2 = new Ext.grid.GridPanel({
ds: ds,
//layout:'fit',
autoHeight:true,
autoWidth:true,
cm: colModel
});
var vport=new Ext.Viewport(
{
layout:"border",
items:[
{
title:"面板",
region:"north",//位置
height:100,
//width:300,
html:"<h1>XXXXXXXX管理系统1</h1>"
},
{
title:"面板",
autoScroll : true,
tools:[{id:'close'},{id:'maximize'}],
region:"south",
height:300,
autoScroll : true,
items:[grid2]
},
{
title:"菜单",
autoScroll : true,
tools:[{id:'close'},{id:'maximize'}],
region:'west',
width:"30%",
items:[grid1]
},
{
title:"菜单",
autoScroll : true,
tools:[{id:'close'},{id:'maximize'}],
region:'center',
items:[grid]
}
]
});
});
</script>
</head>
<body>
<div id='grid-example'><div id="id_button"></div></div>
</body>
</html>
