grid项目
commons-fileupload-1.2.2.jar
commons-io-2.0.1.jar
commons-lang-2.5.jar
commons-logging-1.1.1.jar
commons-logging-api-1.1.jar
freemarker-2.3.16.jar
javassist-3.11.0.GA.jar
ognl-3.0.1.jar
servlet-api.jar
struts2-core-2.2.3.jar
struts2-json-plugin-2.2.3.jar
xwork-core-2.2.3.jar
GridPanel.js
Ext.define('Ext.ux.grid.Panel', {
extend: 'Ext.grid.Panel',
//extend: 'Ext.panel.Table',
requires: ['Ext.grid.View', 'Ext.panel.Table'],
//alias: ['widget.gridpanel', 'widget.grid'],
alternateClassName: ['Ext.list.ListView', 'Ext.ListView', 'Ext.grid.GridPanel'],
viewType: 'gridview'
});
index.jsp
<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%@ taglib prefix="s" uri="/struts-tags" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="stylesheet" type="text/css" href="./js/ext/resources/css/ext-all.css" />
<!--
<link rel="stylesheet" type="text/css" href="./js/ext/shared/example.css" />
-->
<script type="text/javascript" src="./js/ext/bootstrap.js"></script>
<script type="text/javascript" src="./js/ext/ux/GridPanel.js"></script>
<script type="text/javascript" src="./js/ext/ux/TreeCombobox.js"></script>
<script type="text/javascript" src="./js/Store.js"></script>
<script type="text/javascript">
Ext.Loader.setConfig({enabled: true});
Ext.Loader.setPath('Ext.ux', './js/ext/ux');
Ext.require([
'Ext.data.*',
'Ext.grid.*',
'Ext.util.*',
'Ext.ux.data.PagingMemoryProxy',
'Ext.ux.ProgressBarPager'
]);
Ext.onReady(function(){
var myData = [
['3m Co',71.72,0.02,0.03,'9/1 12:00am'],
['Alcoa Inc',29.01,0.42,1.47,'9/1 12:00am'],
['Altria Group Inc',83.81,0.28,0.34,'9/1 12:00am'],
['American Express Company',52.55,0.01,0.02,'9/1 12:00am'],
['American International Group, Inc.',64.13,0.31,0.49,'9/1 12:00am'],
['AT&T Inc.',31.61,-0.48,-1.54,'9/1 12:00am'],
['Boeing Co.',75.43,0.53,0.71,'9/1 12:00am'],
['Caterpillar Inc.',67.27,0.92,1.39,'9/1 12:00am'],
['Citigroup, Inc.',49.37,0.02,0.04,'9/1 12:00am'],
['E.I. du Pont de Nemours and Company',40.48,0.51,1.28,'9/1 12:00am'],
['Exxon Mobil Corp',68.1,-0.43,-0.64,'9/1 12:00am'],
['General Electric Company',34.14,-0.08,-0.23,'9/1 12:00am'],
['General Motors Corporation',30.27,1.09,3.74,'9/1 12:00am'],
['Hewlett-Packard Co.',36.53,-0.03,-0.08,'9/1 12:00am'],
['Honeywell Intl Inc',38.77,0.05,0.13,'9/1 12:00am'],
['Intel Corporation',19.88,0.31,1.58,'9/1 12:00am'],
['International Business Machines',81.41,0.44,0.54,'9/1 12:00am'],
['Johnson & Johnson',64.72,0.06,0.09,'9/1 12:00am'],
['JP Morgan & Chase & Co',45.73,0.07,0.15,'9/1 12:00am'],
['McDonald/'s Corporation',36.76,0.86,2.40,'9/1 12:00am'],
['Merck & Co., Inc.',40.96,0.41,1.01,'9/1 12:00am'],
['Microsoft Corporation',25.84,0.14,0.54,'9/1 12:00am'],
['Pfizer Inc',27.96,0.4,1.45,'9/1 12:00am'],
['The Coca-Cola Company',45.07,0.26,0.58,'9/1 12:00am'],
['The Home Depot, Inc.',34.64,0.35,1.02,'9/1 12:00am'],
['The Procter & Gamble Company',61.91,0.01,0.02,'9/1 12:00am'],
['United Technologies Corporation',63.26,0.55,0.88,'9/1 12:00am'],
['Verizon Communications',35.57,0.39,1.11,'9/1 12:00am'],
['Wal-Mart Stores, Inc.',45.45,0.73,1.63,'9/1 12:00am']
];
// example of custom renderer function
function change(val){
if(val > 0){
return '<span style="color:green;">' + val + '</span>';
}else if(val < 0){
return '<span style="color:red;">' + val + '</span>';
}
return val;
}
// example of custom renderer function
function pctChange(val){
if(val > 0){
return '<span style="color:green;">' + val + '%</span>';
}else if(val < 0){
return '<span style="color:red;">' + val + '%</span>';
}
return val;
}
// register model
Ext.define('Company', {
extend: 'Ext.data.Model',
fields: [
{name: 'name'},
{name: 'type'}
]
});
/*
Ext.define('Company', {
extend: 'Ext.data.Model',
idProperty: 'company',
fields: [
{name: 'company'},
{name: 'price', type: 'float'},
{name: 'change', type: 'float'},
{name: 'pctChange', type: 'float'},
{name: 'lastChange', type: 'date', dateFormat: 'n/j h:ia'}
]
});*/
// create the data store
var store = new Ext.data.Store({
model: 'Company',
pageSize : 1,
proxy: {
type: 'ajax',
url : 'grid1.action',
reader:
{
type: 'json',
root: 'data'
}
},
listeners: {
beforeload: function(store, operation){
store.proxy.extraParams = {
query1: "11",
query2: "22"
};
}
},
autoLoad: true
});
/*
var store = Ext.create('Ext.data.Store', {
model: 'Company',
remoteSort: true,
pageSize: 10,
proxy: {
type: 'pagingmemory',
data: myData,
reader: {
type: 'array'
}
}
});
*/
//
var bbar = Ext.create('Ext.PagingToolbar', {
pageSize: 1,
store: store,
displayInfo: true,
plugins: Ext.create('Ext.ux.ProgressBarPager', {})
});
// create the Grid
var grid = Ext.create('Ext.ux.grid.Panel', {
title:'Progress Bar Pager',
store: store,
columns:
[
{
id:'name',
text: '名称',
sortable: true,
dataIndex: 'name',
flex: 1
},
{
text: '类别',
sortable: true,
dataIndex: 'type',
width: 75
}
],
/*
columns: [{
id:'company',
text: 'Company',
sortable: true,
dataIndex: 'company',
flex: 1
},{
text: 'Price',
sortable: true,
renderer: Ext.util.Format.usMoney,
dataIndex: 'price',
width: 75
},{
text: 'Change',
sortable: true,
renderer: change,
dataIndex: 'change',
width: 75
},{
text: '% Change',
sortable: true,
renderer: pctChange,
dataIndex: 'pctChange',
width: 75
},{
text: 'Last Updated',
sortable: true,
dataIndex: 'lastChange',
width: 75
}],
*/
stripeRows: true,
height:320,
width:600,
frame:true,
//resizable: {
// handles: 's',
// minHeight: 100
//},
bbar: bbar
});
//grid.render('grid-example');
store.load();
var p = 'aaa';
var window = Ext.create('Ext.window.Window', {
id:'main-panel',
baseCls:'x-plain',
tbar :
[
{
text: '刷新html内容1',
height:200,
handler: function()
{
//this.ownerCt.ownerCt.body.update('323423<script>alert("aasdfasdf");<//script>',true,function(){alert("asdfasdfa");});
var d_id = Ext.id();
this.ownerCt.ownerCt.update("<script>p = 'aaabbbbbcccc';<//script><script type=/"text/javascript/" src=/"./js/test.js/"><//script><div id='"+d_id+"'><//div>",true,function(){grid.render(d_id);bb();});
//var str = "bb();";
//eval(str);
}
},
{
text: '刷新html内容2',
handler: function()
{
}
}
],
html:"b"//,
//items:[grid]
});
window.show();
Ext.create('Ext.Button', {
text: 'Click me1',
renderTo: 'btn-1',
handler: function() {
bb();
alert(a);
Ext.getCmp("main-panel");
//Ext.getCmp("main-panel").doAutoRender();
}
});
Ext.create('Ext.Button', {
text: 'Click me2',
renderTo: 'btn-2',
handler: function() {
alert(Ext.getCmp("main-panel").body);
Ext.getCmp("main-panel").html = "555555555";
Ext.getCmp("main-panel").doAutoRender();
}
});
var store_tree = Ext.create('Ext.data.TreeStore', {
proxy: {
type: 'ajax',
url: 'tree.action'
},
sorters: [{
property: 'leaf',
direction: 'ASC'
}, {
property: 'text',
direction: 'ASC'
}]
});
Ext.create('Ext.TreeCombo', {
store: store_tree,
renderTo:'tree_div',
autoScroll:true,
animate:true,
enableDD:true,
containerScroll: true,
displayField:'text',
id: Ext.id()
});
});
</script>
<title>首页</title>
</head>
<body>
<div id="grid-example"></div>
<div id="btn-1"></div>
<div id="btn-2"></div>
<div id="tree_div"></div>
<p><a href="<s:url action='grid'/>">Hello World</a></p>
</body>
</html>
struts.xml
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE struts PUBLIC
"-//Apache Software Foundation//DTD Struts Configuration 2.0//EN"
"http://struts.apache.org/dtds/struts-2.0.dtd">
<struts>
<constant name="struts.devMode" value="true" />
<package name="basicstruts2" extends="json-default">
<action name="index">
<result>/index.jsp</result>
</action>
<action name="grid" class="Action.GridAction" method="test">
<result name="success">/html/HelloWorld.jsp</result>
</action>
<action name="grid1" class="Action.GridAction" method="test1">
<result type="json" >
<param name="total">true</param>
<param name="data">true</param>
</result>
</action>
<action name="tree" class="Action.GridAction" method="tree">
</action>
</package>
</struts>
GridAction.java
package Action;
import java.util.ArrayList;
import java.util.List;
import java.util.Map;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import org.apache.struts2.*;
import org.apache.struts2.interceptor.ServletRequestAware;
import org.apache.struts2.interceptor.ServletResponseAware;
import org.apache.struts2.interceptor.SessionAware;
import Vo.GridJson;
import com.opensymphony.xwork2.ActionContext;
import com.opensymphony.xwork2.ActionSupport;
/**
* ext列表控制类
* @param <HttpServletRequest>
* */
public class GridAction extends ActionSupport implements SessionAware, ServletRequestAware, ServletResponseAware {
private Map session;
private HttpServletRequest request;
private HttpServletResponse response;
public void setSession(Map session) {
this.session = session;
}
public void setServletRequest(HttpServletRequest request) {
this.request = request;
}
public void setServletResponse(HttpServletResponse response) {
this.response = response;
}
private static final long serialVersionUID = 1L;
private Long total;
private List data;
public Long getTotal() {
return total;
}
public void setTotal(Long total) {
this.total = total;
}
public List getData() {
return data;
}
public void setData(List data) {
this.data = data;
}
/**
* @param args
*/
public static void main(String[] args) {
// TODO Auto-generated method stub
}
public String test() throws Exception
{
return SUCCESS;
}
public String test1() throws Exception
{
total = new Long(2);
data = new ArrayList();
GridJson vo1 = new GridJson();
vo1.setName("vo1_name");
vo1.setType("vo1_type");
data.add(vo1);
GridJson vo2 = new GridJson();
vo2.setName("vo2_name");
vo2.setType("vo2_type");
data.add(vo2);
return SUCCESS;
}
public void tree() throws Exception
{
String str = "[{'text':'top1','cls':'folder','expanded':true,'children':[{'text':'t_c_1','leaf':true},{'text':'t_c_2','leaf':true}]},"
+ "{'text':'top2','cls':'folder','expanded':true,'children':[{'text':'t_2_1','leaf':true},{'text':'t_2_2','leaf':true}]}]";
response.setCharacterEncoding("UTF-8");
response.getWriter().write(str);
}
}