grid项目

来源:互联网 发布:开淘宝店好还是天猫好 编辑:程序博客网 时间:2024/05/19 23:28

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);       

}

 

}