struts2.18整合json和ExtJs4.0实例

struts2.18整合json和ExtJs4.0实例

    博客分类: 
  • ext4.0

用到的jar包有:

commons-beanutils-1.7.0.jar、commons-collections-3.2.jar、commons-fileupload-1.2.1.jar、commons-io-1.3.2.jar、commons-lang-2.3.jar、commons-logging-1.0.4.jar、freemarker-2.3.15.jar、json-lib-2.1.jar、ognl-2.7.3.jar、struts2-core-2.1.8.1.jar、struts2-json-plugin-2.1.8.1.jar、xwork-core-2.1.6.jar

这些包在struts2.1.8的lib文件夹中都有,还需要加上一个ezmorph-1.0.4.jar,本实例中没有用到jsonplugin-0.33.jar包。

一、首先写一个javabean:Person.java

 

Java代码   收藏代码
  1. package com.leo.bean;  
  2.   
  3. public class Person {  
  4.     private String name;  
  5.     private int age;  
  6.     private String sex;  
  7.     private String birthday;  
  8.   
  9.     public Person(String name, int age, String sex, String birthday) {  
  10.         super();  
  11.         this.name = name;  
  12.         this.age = age;  
  13.         this.sex = sex;  
  14.         this.birthday = birthday;  
  15.     }  
  16.   
  17.     public String getName() {  
  18.         return name;  
  19.     }  
  20.   
  21.     public void setName(String name) {  
  22.         this.name = name;  
  23.     }  
  24.   
  25.     public int getAge() {  
  26.         return age;  
  27.     }  
  28.   
  29.     public void setAge(int age) {  
  30.         this.age = age;  
  31.     }  
  32.   
  33.     public String getSex() {  
  34.         return sex;  
  35.     }  
  36.   
  37.     public void setSex(String sex) {  
  38.         this.sex = sex;  
  39.     }  
  40.   
  41.     public String getBirthday() {  
  42.         return birthday;  
  43.     }  
  44.   
  45.     public void setBirthday(String birthday) {  
  46.         this.birthday = birthday;  
  47.     }  
  48.   
  49. }  

 

 二、写Action:ExtjsAction.java

 

Java代码   收藏代码
  1. package com.leo.action;  
  2.   
  3. import java.util.ArrayList;  
  4. import java.util.List;  
  5.   
  6. import com.leo.bean.Person;  
  7. import com.opensymphony.xwork2.ActionSupport;  
  8.   
  9. public class ExtjsAction extends ActionSupport {  
  10.     private long results;  
  11.     private List items;  
  12.   
  13.     public long getResults() {  
  14.         return results;  
  15.     }  
  16.   
  17.     public void setResults(long results) {  
  18.         this.results = results;  
  19.     }  
  20.   
  21.     public List getItems() {  
  22.         return items;  
  23.     }  
  24.   
  25.     public void setItems(List items) {  
  26.         this.items = items;  
  27.     }  
  28.   
  29.     public String execute() throws Exception {  
  30.         this.results = 3;  
  31.         Person p1 = new Person("张三"29"男""1990-10-22");  
  32.         Person p2 = new Person("李四"28"男""1991-03-30");  
  33.         Person p3 = new Person("王五"27"女""1993-08-17");  
  34.         this.items = new ArrayList<Person>();  
  35.         this.items.add(p1);  
  36.         this.items.add(p2);  
  37.         this.items.add(p3);  
  38.         return SUCCESS;  
  39.     }  
  40. }  

 

 三、写配置文件

1.web.xml

 

Xml代码   收藏代码
  1. <?xml version="1.0" encoding="UTF-8"?>  
  2. <web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"  
  3.     xmlns="http://java.sun.com/xml/ns/javaee" xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"  
  4.     xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"  
  5.     version="2.5">  
  6.     <display-name>struts2</display-name>  
  7.     <welcome-file-list>  
  8.         <welcome-file>index.jsp</welcome-file>  
  9.     </welcome-file-list>  
  10.     <filter>  
  11.         <filter-name>struts2</filter-name>  
  12.         <filter-class>org.apache.struts2.dispatcher.FilterDispatcher</filter-class>  
  13.     </filter>  
  14.     <filter-mapping>  
  15.         <filter-name>struts2</filter-name>  
  16.         <url-pattern>/*</url-pattern>  
  17.     </filter-mapping>  
  18. </web-app>  

 

 2.struts.xml

 

Xml代码   收藏代码
  1. <?xml version="1.0" encoding="UTF-8"?>  
  2. <!DOCTYPE struts PUBLIC "-//Apache Software Foundation//DTD Struts Configuration 2.1//EN"   
  3. "http://struts.apache.org/dtds/struts-2.1.dtd">  
  4. <struts>  
  5.     <include file="struts-default.xml" />  
  6.     <package name="json" namespace="/" extends="json-default">  
  7.         <action name="extjs" class="com.leo.action.ExtjsAction">  
  8.             <result type="json"></result>  
  9.         </action>  
  10.     </package>  
  11. </struts>      

 

 四、最后写jsp

index.jsp

 

Html代码   收藏代码
  1. <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>  
  2. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
  3. <html>  
  4.     <head>  
  5.   
  6.         <title>ExtJs与Struts2结合</title>  
  7.         <meta http-equiv="pragma" content="no-cache">  
  8.         <meta http-equiv="cache-control" content="no-cache">  
  9.         <meta http-equiv="expires" content="0">  
  10.         <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">  
  11.         <meta http-equiv="description" content="This is my page">  
  12.         <link rel="stylesheet" type="text/css"  
  13.             href="../../ext-4.0.7/resources/css/ext-all.css" />  
  14.         <script type="text/javascript" src="../../ext-4.0.7/bootstrap.js"></script>  
  15.         <script type="text/javascript"  
  16.             src="../../ext-4.0.7/locale/ext-lang-zh_CN.js"></script>  
  17.         <script type="text/javascript">  
  18.     Ext.onReady(function() {  
  19.         Ext.create('Ext.grid.Panel', {  
  20.             title : '人员列表',  
  21.             renderTo : Ext.getBody(),  
  22.             width : 400,  
  23.             height : 170,  
  24.             frame : true,  
  25.             store : {  
  26.                 fields : [ 'name', 'age', 'sex', 'birthday' ],  
  27.                 proxy : {  
  28.                     type : 'ajax',  
  29.                     url : '/s2json/extjs.action',  
  30.                     reader : {  
  31.                         type : 'json',  
  32.                         root : 'items'  
  33.                     }  
  34.                 },  
  35.                 autoLoad : true  
  36.             },  
  37.             columns : [ new Ext.grid.RowNumberer(), {  
  38.                 header : "姓名",  
  39.                 width : 80,  
  40.                 dataIndex : 'name',  
  41.                 sortable : true  
  42.             }, {  
  43.                 header : "年龄",  
  44.                 width : 80,  
  45.                 dataIndex : 'age',  
  46.                 sortable : true  
  47.             }, {  
  48.                 header : "性别",  
  49.                 width : 80,  
  50.                 dataIndex : 'sex',  
  51.                 sortable : true  
  52.             }, {  
  53.                 header : "生日",  
  54.                 width : 80,  
  55.                 dataIndex : 'birthday',  
  56.                 sortable : true  
  57.             } ]  
  58.         });  
  59.     });  
  60. </script>  
  61.     </head>  
  62.     <body>  
  63.     </body>  
  64. </html>  

 

 

五、效果图

struts2.18整合json和ExtJs4.0实例_第1张图片

你可能感兴趣的:(struts2.18整合json和ExtJs4.0实例)