java技术编程Struts2+Json+EsayUI+datagrid小例子

 

需要的jar 包

web-xml 文件

<filter>
<description>Struts2 过滤器</description>
<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>

Struts-xml文件

<package name= “myApp-json-default” namespace= “/” extends= “json-default” >

<action name= “Student” class= “com.naga.action.StudentAction” method=”execute”>
<result name= “success” type= “json” >
<param name=”root”>result<!– result是action中设置的变量名，也是页面需要返回的数据，该变量必须有setter和getter方法 –></param>
</result>
</action>

Action类示例

package com.naga.action;

import java.util.HashMap;
import java.util.List;
import java.util.Map;

import javax.servlet.http.HttpServletRequest;

import org.apache.struts2.ServletActionContext;

import net.sf.json.JSONObject;

import com.naga.dao.Conn;
import com.naga.domain.Student;
import com.opensymphony.xwork2.ActionSupport;
import com.sun.net.httpserver.HttpContext;

public class StudentAction extends ActionSupport {

private Student student;
private Map<String, Object> map;
int Rows;
int page;
String start;
String end;

JSONObject result;
public JSONObject getResult() {
return result;
}

public void setResult(JSONObject result) {
this.result = result;
}

public int getRows() {
return Rows;
}

public void setRows(int rows) {
Rows = rows;
}

private Conn conn = new Conn();

public Student getStudent() {
return student;
}

public void setStudent(Student student) {
this.student = student;
}

public Map<String, Object> getMap() {
return map;
}

public void setMap(Map<String, Object> map) {
this.map = map;
}

public int getPage() {
return page;
}

public void setPage(int page) {
this.page = page;
}

@Override
public String execute() throws Exception {
// TODO Auto-generated method stub

Map<String, Object> map = new HashMap<String, Object>();
List<Student> li = null;
li = conn.getPageDate(this.getPage(), this.getRows());

int a = 10000;
// int a=conn.getCount();
map.put(“total”, a);
map.put(“rows”, li);
// JSONArray json1 =JSONArray.fromObject(map);
result = JSONObject.fromObject(map);

return SUCCESS;

}

public String getStart() {
return start;
}

public void setStart(String start) {
this.start = start;
}

public String getEnd() {
return end;
}

public void setEnd(String end) {
this.end = end;
}
}

dao层方法类

package com.naga.dao;

import java.sql.SQLException;
import java.util.List;

import org.apache.commons.dbutils.QueryRunner;
import org.apache.commons.dbutils.handlers.BeanHandler;
import org.apache.commons.dbutils.handlers.BeanListHandler;

import com.naga.action.StudentAction;
import com.naga.domain.Student;
import com.naga.util.JdbcUtil;

public class Conn {

/**
*这是一个分页的方法
*/
public List<Student> getPageDate(int page, int rows) {

System.out.println(“页数为” + page);
int start = (page – 1) * rows;
int end = start + rows;

String sql = “select * from student id limit ?,?”;

QueryRunner runner = new QueryRunner(JdbcUtil.getDataSource());
Object[] objs = { start, end };
try {
List<Student> list = (List<Student>) runner.query(sql, objs,
new BeanListHandler(Student.class));
return list;
} catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}

return null;
}

/**
* 这是条件查询的代码
*/

public List<Student> getSelect(String start, String end) {

String sql = “select *from student where birthday >=?and birthday <=? ;”;
// String sql = “select * from student where 1=1 “;
//
// if(!Utils.isEmpty(start)) {
// sql += “and birthday >= ” + start + ” “;
// }
// if(!Utils.isEmpty(end)) {
// sql += “and birthday <= ” + end + ” “;
// }
// start = “1 or 1=1 “;
// sql = “select * from student where 1=1 “;
QueryRunner runner = new QueryRunner(JdbcUtil.getDataSource());
Object[] objs = { start, end };
try {
List<Student> list = (List<Student>) runner.query(sql, objs,
new BeanListHandler(Student.class));
return list;
} catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}

return null;
}

/**
* 这是一个查询所有的数据方法
* */
public int getCount() {
String sql = “select count(*) as totalCount from student”;
QueryRunner runner = new QueryRunner(JdbcUtil.getDataSource());
try {
StudentAction page = (StudentAction) runner.query(sql,
new BeanHandler(StudentAction.class));
return page.getRows();
} catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
return 0;
}

}

html文件

<!DOCTYPE html>
<html>
<head>
<meta charset=”UTF-8″>
<title>Aligning Columns in DataGrid – jQuery EasyUI Demo</title>
<script type=”text/javascript” src=”js/jquery-easyui-1.4/jquery.min.js”></script>
<script type=”text/javascript” src=”js/jquery-easyui-1.4/jquery.easyui.min.js”></script>
<script type=”text/javascript” src=”js/jquery-easyui-1.4/locale/easyui-lang-zh_CN.js”></script>
<link rel=”stylesheet” type=”text/css” href=”js/jquery-easyui-1.4/themes/default/easyui.css” >
<link rel=”stylesheet” type=”text/css” href=”js/jquery-easyui-1.4/themes/icon.css”>
<script type=”text/javascript”>
$(document).ready(function(){
$(‘#datagrid’).datagrid({
toolbar:’#tb’,
url : ‘Student’,
title:’Load Data’,
nowarp:false, //内容多自动换行
columns : [ [ {
field : ‘id’,
width : ‘100’,
checkbox:true
},{
field : ‘name’,
title : ‘姓名’,
width : ‘100’,
align : ‘center’
}, {
field : ‘age’,
title : ‘年龄’,
width : ‘100’,
align : ‘center’,
}, {
field : ‘sex’,
title : ‘性别’,
width : ‘100’,
align : ‘center’,
}, {
field : ‘clas’,
title : ‘班级’,
width : ‘100’,
align : ‘center’,
}, {
field : ‘birthday’,
title : ‘生日’,
width : ‘100’,
align : ‘center’,
}, {
field : ‘idcard’,
title : ‘身份证’,
width : ‘100’,
align : ‘center’,
}, {
field : ‘tel’,
title : ‘电话’,
width : ‘100’,
align : ‘center’,
}, {
field : ‘address’,
title : ‘地址’,
width : ‘100’,
align : ‘center’,
}, {
field : ‘teacher’,
title : ‘老师’,
width : ‘100’,
align : ‘center’,
}

] ],
idField:’id’,
loadMsg:’Processing, please wait …’,
pagination:true
});

});
//设置分页控件
var p = $(‘#datagrid’).datagrid(‘getPager’);
$(p).pagination({
pageSize: 20,//每页显示的记录条数，默认为10
pageList: [5,20,15],//可以设置每页记录条数的列表
beforePageText: ‘第’,//页数文本框前显示的汉字
afterPageText: ‘页 共 {pages} 页’,
displayMsg: ‘当前显示 {from} – {to} 条记录 共 {total} 条记录’,
/*onBeforeRefresh:function(){
$(this).pagination(‘loading’);
alert(‘before refresh’);
$(this).pagination(‘loaded’);
}*/
});

</script>
</head>
<body>
<h2>Basic DataGrid</h2>
<div class=”demo-info”>
<div class=”demo-tip icon-tip”></div>
<div>The DataGrid is created from markup, no JavaScript code needed.</div>
</div>
<div style=”margin:10px 0;”></div>
<table id=”datagrid” class=”easyui-datagrid” style=”width:1000px;height:400px;verflow:auto;” >
</table>

<div id=”tb” style=”padding:5px;height:auto”>
<div style=”margin-bottom:5px”>
<a href=”#” class=”easyui-linkbutton” iconCls=”icon-add” plain=”true”>add</a>
<a href=”#” class=”easyui-linkbutton” iconCls=”icon-edit” plain=”true”>edit</a>
<a href=”#” class=”easyui-linkbutton” iconCls=”icon-cut” plain=”true”>delete</a>
</div>
<div>
Date From:<input id=”start” class=”easyui-datebox” style=”width:80px”>
To: <input id=”end” class=”easyui-datebox” style=”width:80px”>
<a href=”#” class=”easyui-linkbutton” onclick=”getVal();” iconCls=”icon-search”>Search</a>
</div>
</div>
</body>
</html>