您的位置:首页 > 编程语言 > Java开发

Flexigrid的使用(整合Struts2)

2016-01-02 10:11 525 查看
Flexigrid是一个jQuery表格插件 下载地址:http://download.csdn.net/detail/itmyhome/7613879

用法:

一、相关资源文件的引入

<link rel="stylesheet" type="text/css" href="css/flexigrid.css">
<script type="text/javascript" src="js/jquery-1.8.0.min.js"></script>
<script type="text/javascript" src="js/flexigrid.js"></script>


二、JSP页面显示

<table class="flexigrid" style="display: none"></table>
<script type="text/javascript">
$(function() {
$(".flexigrid").flexigrid( {
url : 'getUserAction.action',
dataType : 'json',
colModel : [
{display : '名称',name : 'username',width : 120,sortable : true,align : 'center'},
{display : '组织名称',name : 'orgname',width : 120,sortable : true,align : 'center'} ,
{display : '状态',name : 'state',width : 100,sortable : true,align : 'center'} ,
{display : '登录名',name : 'loginname',width : 120,sortable : true,align : 'center'},
{display : '创建时间',name : 'ctime',width : 120,sortable : true,align : 'center'},
{display : '备注',name : 'note',width : 120,sortable : true,align : 'center'}
],
buttons : [
{name: '新增', bclass: 'add', onpress : add},
{name: '删除', bclass: 'delete', onpress : del},
{name: '编辑', bclass: 'edit', onpress : edit}
],
sortorder : "asc",
usepager : true,
title : '人员信息列表',
useRp : true,
rp : 10,  //每页默认结果数
pagestat: '显示记录从{from}到{to},总数 {total} 条', //汉化显示样式
pagetext: '当前页',
outof: '总页数',
showTableToggleBtn : false,
resizable : true,
width : 'auto',
height : 265
});
function add(){
alert("Add");
}
function del(){
alert("Delete");
}
function edit(){
alert("Edit");
}
})
</script>


三、Struts配置

<package name="user_json" extends="json-default">
<action name="getUserAction" method="queryAll" class="com.home.web.UserAction">
<result name="success" type="json"></result>
</action>
</package>


四、后台代码实现

import java.io.IOException;
import java.sql.Connection;
import java.sql.ResultSet;
import java.sql.ResultSetMetaData;
import java.sql.SQLException;
import java.sql.Statement;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
import com.home.util.ConnectionManager;

public class UserAction {
// 结果集
private List<Map<String, Object>> rows = new ArrayList<Map<String, Object>>();

private Integer page = 1;  //当前页
private Integer total;     //总记录数
private Integer rp;        //每页记录数

public String queryAll() throws IOException {

Statement sta = null;
ResultSet rs = null;
try {
Connection conn = ConnectionManager.getConnection();
sta = conn.createStatement();
//mysql分页
String sql = "select username,orgname,state,loginname,ctime,note from e_user limit "+(page-1)*rp+","+rp;
rs = sta.executeQuery(sql);
ResultSetMetaData md = rs.getMetaData(); // 获得结果集结构信息,元数据
int columnCount = md.getColumnCount();
while (rs.next()) {
Map<String, Object> rowData = new HashMap<String, Object>();
for (int i = 1; i <= columnCount; i++) {
rowData.put(md.getColumnName(i), rs.getObject(i));
}
rows.add(rowData);
}
total = ConnectionManager.getRows();
ConnectionManager.closeAll(rs, sta, conn); //关闭资源
} catch (SQLException e) {
e.printStackTrace();
}
return "success";
}

public String forSend() {
return "success";
}

public List<Map<String, Object>> getRows() {
return rows;
}

public void setRows(List<Map<String, Object>> rows) {
this.rows = rows;
}

public Integer getPage() {
return page;
}

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

public Integer getTotal() {
return total;
}

public void setTotal(Integer total) {
this.total = total;
}

public Integer getRp() {
return rp;
}

public void setRp(Integer rp) {
this.rp = rp;
}
}

页面效果:



后台数据查询代码是基于mysql、JDBC。

源代码下载:http://download.csdn.net/detail/itmyhome/7613879

转载请注明出处:/article/1396626.html
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: