Struts与Extjs的整合
1、引入以下Jar包
- commons-fileupload-1.2.2.jar
- commons-io-2.0.1.jar
- commons-lang3-3.1.jar
- dom4j-1.6.1.jar
- freemarker-2.3.19.jar
- javassist-3.11.0.GA.jar
- ognl-3.0.6.jar
- struts2-core-2.3.12.jar
- struts2-json-plugin-2.3.12.jar
- xwork-core-2.3.12.jar
2、建立Person类
package com.hpu.pojo;
public class Person {
private int id;
private String name;
private String number;
public Person(int id , String name , String number) {
this.id = id;
this.name = name;
this.number = number;
}
public int getId() {
return id;
}
public void setId(int id) {
this.id = id;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
public String getNumber() {
return number;
}
public void setNumber(String number) {
this.number = number;
}
}
?3、配置struts.xml与web.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> <package name="struts2" namespace="/" extends="json-default"> <action name="getPerson" class="com.hpu.action.PersonAction"> <result type="json"/> </action> <action name="show" class="com.hpu.action.PersonAction" method="in" > <result>/in.jsp</result> </action> </package> </struts>
?
<filter> <filter-name>struts2</filter-name> <filter-class> org.apache.struts2.dispatcher.ng.filter.StrutsPrepareAndExecuteFilter </filter-class> </filter> <filter-mapping> <filter-name>struts2</filter-name> <url-pattern>/*</url-pattern> </filter-mapping>
?
4、编写处理请求的PersonAction
package com.hpu.action;
import java.util.ArrayList;
import java.util.List;
import com.hpu.pojo.Person;
import com.opensymphony.xwork2.ActionSupport;
public class PersonAction extends ActionSupport {
private List<Person> persons;
public List<Person> getPersons() {
return persons;
}
public void setPersons(List<Person> persons) {
this.persons = persons;
}
@Override
public String execute() throws Exception {
Person person1 = new Person(1, "zhangsan", "15426897458");
Person person2 = new Person(2, "lisi", "15236989636");
persons = new ArrayList<Person>();
persons.add(person1);
persons.add(person2);
return SUCCESS;
}
}
?5、写请求页面
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Test.html</title> <link rel="stylesheet" type="text/css" href="../ext_js3/resources/css/ext-all.css"></link> <script type="text/javascript" src="../ext_js3/adapter/ext/ext-base.js"></script> <script type="text/javascript" src="../ext_js3/ext-all-debug.js"></script> <script type="text/javascript" src="Test.js"></script> </head> <body> <div id="show"></div> </body> </html>
?6、编写js文件
Ext.onReady(function() {
Ext.BLANK_IMAGE_URL = "../ext_js3/resources/images/default/s.gif";
var Person = new Ext.data.Record.create([
{name:"id",mapping:"id"},
{name:"name",mapping:"name"},
{name:"number",mapping:"number"}
]);
// Json存储器
var store = new Ext.data.Store({
url:"getPerso