本文以jquery ui中的自动完成(autocomplete)插件, easy ui中的(tree)树形菜单插件,(grid)网格插件的综合运用为例来展示插件的魅力.
开发环境:struts2.3 jquery UI1.10.4 jdk1.7 EasyUI 1.4.5
一 插件介绍
1.1 自动完成(autocomplete)
目前Web2.0时代网络的一个重要特点就是用户体验效果更好,页面交互更多,这种特点无处不在。以百度搜索为例,如图1.1所示,百度网首页上的搜索功能就使用了自动完成技术。当用户输入任意一个信息后,自动帮助用户将与输入信息有关的数据显示在搜索框下方,以供用户选择,极大地提高了用户的使用体验度。
图1.1 百度查询自动完成效果
要想实现图1.1中自动完成功能的效果需要用到JQuery UI提供的autocomplete插件。语法如下。
语 法
$(selector).autocomplete([settings]);
在语法中:
参数settings:$(selector).autocomplete()方法的参数列表,用于配置autocomlete的键值对集合。详细配置参数如表1-2和表1-3所示。
表1-2 autocomplete插件常用参数
参 数 | 说 明 |
String Source Array Source fLinctionSource(Object reuqest,functionresponse(Object data)) | 用于指定数据来源,类型为String、Array、functionString:用于Ajax请求的服务器端地址,返回Array(JSON格式)Array:字符串数组或JSON数组function(request,response):通过request.term获得输入的值(term为默认参数名),response([Array])来提供呈现数据 |
Number minLength | 当输入框内字符串长度达到minLength时,激活autocomplete |
Boolean autoFocus | 肖autocomplete选择菜单弹出时,自动选中第一个 |
Number delay | 延迟多少毫秒激活autocomplete |
表1-3 autocomplete插件常用事件
事 件 | 说 明 |
function create(Event event,Object ui) | autocomplete创建时触发,可以在此事件中,对外观进行一些控制 |
function search(Event event, Object ui) | 在开始查找请求之前触发,可以在此事件中返吲false来取消请求 |
function open(Event event,Object ui) | autocomplete的结果列表弹出时触发 |
function focus(Event event,Obj ect ui) | autocomplete的结果列表任意一项获得焦点时触发,ui.item为获得焦点的项 |
续表
事 件 | 说 明 |
function select(Event event,Object ui) | autocomplete的结果列表任意一项选中时触发,ui .item为选中的项 |
function close(Event event,Object ui) | autocomplete的结果列表关闭时触发 |
function change(Event event,Object ui) | 当值改变时触发,ui.item为选中的项 |
了解了autocomplete插件的使用语法和常用参数列表之后,下面使用autocomplete插件实现类似百度搜索的自动完成功能,主要步骤如下。
(l)引入autocomplete插件及样式文件。
(2)定义一个输入框。
(3)定义数据来源。
(4)使用autocomplete方法,并通过其source参数指定数据来源。
1.2 树形菜单插件(tree)
tree插件的使用语法如下。
$("#tree").tree({...});
在语法中:
参数settings:$(selector).tree()方法的参数列表,是用于配置tree的键值对集合。详细配置参数如表1-5 -表1-7所示。
表1-5 tree插件常用参数
参数 | 说 明 | 默认值 |
String url | 获取远程数据的URL | null |
String method | 获取数据的HTTP method | post |
boolean animate | 定义当节点展开折叠时是否显示动两效果 | false |
boolean checkbox | 定义是否在每个节点前边显示checkbox | false |
booiean cascadeCheck | 定义是否级联选中 | true |
boolean onlyLeafCheck | 定义是否只在叶节点前显示checkbox | false |
boolean dnd | 定义是否启用拖放 | false |
Array data | 加载的节点数据 | riull |
表1-6 tree插件常用方法
方 法 | 说 明 |
loadData(data) | 如载树的数据 |
getNode(target) | 获取指定的节点对象 |
getData(target) | 获取指定的节点数据,包括它的子节点 |
reload(target) | 重新加载树的数据 |
getRoot() | 获取根节点,返回节点对象 |
getParent(target) | 获取父节点,target参数指节点的DOM对象 |
getChildren(target) | 获取予节点,target参数指节点的DOM对象 |
getChecked( ) | 获取所有选中的节点 |
getSelected( ) | 获驭选中的节点并返回它,如果没有选中节点,就返回null |
find(id) | 找到指定的节点并返回此节点对缘 |
select(target) | 选中一个节点,target参数表示节点的DOM对象 |
check(target) | 把指定节点设置为勾选状态 |
uncheck(target) | 把指定节点设置为未勾选状态 |
collapse(target) | 折叠一个节点,target参数表示节点的DOM对象 |
expand(target) | 展开一个节点,target参数表示节点的DOM对象 |
collapseAll(target) | 折叠所有的节点 |
expandAll(target) | 展开所有的节点 |
expandTo(target) | 从指定节点的根部展开 |
续表
方 法 | 说 明 |
append(param) | 追加一些子节点到一个父节点,param参数有两个特性:parent: DOM对象,追加到的父节点,如果没有分配,则追加为根节点data:数组,节点的数据 |
toggle(target) | 切换节点的展开/折叠状态,target参数表示节点的DOM对象 |
表1-7 tree插件常用事件
事件 | 说 明 |
onClick(node) | 当用户单击一个节点时触发,node参数包含下列属性: id:节点的id text:节点的文字 checked:节点是否被选中 attributes:节点自定义属性 target:被单目标的DOM对象 |
onDbIClick(node) | 当用户双击一个节点时触发 |
onBeforeLoad(node, param) | 当加载数据的请求发出前触发,返回false就取消加载动作 |
onLoadSuccess(node,data) | 当数据加载成功时触发 |
onLoadError(arguments) | 当数据加载失败时触发,arguments参数与JQuery.ajax的‘error’函数一样 |
了解了tree插件的使用语法和常用参数列表之后,接下来使用tree插件来实现树形功能菜单效果。大致实现岁骤与普通JQuery UI插件相同,这里不再赘述。
1.3 网格(datagrid)插件
在实际开发中,网格组件是比树形菜单使用频率更高的组件之一。接下来将向大家介绍使用easy UI中的datagrid插件实现列表展示功能,该插件使用语法如下。
语 法
$(selector).datagrid([settings]);
在语法中:
参数settings:用于配置datagrid的键值对集合。详细配置参数如表1-9 -表1-11所示。
表1-9 datagrid插件常用参数
参数 | 说 明 | 默认值 |
Array columns . | datagrid的colurnn的配置对象,更多详细信息参见column的特性 | Null |
boolean striped | 若为true,则把行条纹化(即奇偶行使用不同背景色) | False |
String method | 请求远程数据的method类型 | Post |
String url | 从远程站点请求数据的URL | Niill |
String loadMsg | 当从远程站点加载数据时,显示的提示信息 | Processing. pleasewait- |
boolean pagination | 若为true,则在datagrid的底部显示分页栏 | False |
boolean rowNumbers | 若为true.则显示行号的列 | False |
boolean singleSelect | 若为true,则只允许选中一行 | False |
Number pageNumber | 当设置了paglnation特性时,初始化页码 | l |
Number pageSize | 当设置了pagination特性时,初始化页码尺寸 | 10 |
Array pageList | 当设置了pagination特性时,初始化页面尺寸的选择列表 | [10,20,30j40,50] |
function rowStyler | 返回如'background:red'的样式,该函数需要两个参数: rowIndex:行的索引,从O开始 rowData:此行相应的记录 |
|
function loadFilter | 返回过滤的数据并显示。这个函数需要…个参数fdatal,表示原始数据 可以把原始数据变成标准数据格式,此函数必须返回标准数据对象,含有’total’和’rows’特性 |
|
表1-10 datagrid插件常用方法
方 法 | 说 明 |
options() | 返回options对象 |
getPager() | 返回pager 对象 |
load(param) | 加载并显示第一页的行,如果指定param参数,它将替换queryParams特性 |
续表
方 法 | 说 明 |
reload(param) | 重新加载行,就像load方法一样,但是保持在当前页 |
loadData(data) | 加载本地数据,旧的行会被移除 |
getData() | 返回加载的数据 |
getRows() | 返回当前页的行 |
getRowln dex(row) | 返回指定行的索引,row参数可以是一个行记录或者一个id字段的值 |
getSelected( ) | 返回第一个选中的行或者null |
getSelections( ) | 返回所有选中的行,当没有选中的记录时,将返回空数组 |
表1-11 datagrid插件常用事件
事 件 | 说 明 |
onLoadSuccess(data) | 当数据加载成功时触发 |
onLoadError( ) | 加载远程数据发生某些错误时触发 |
onBeforeLoad(param) | 发送加载数据的请求前触发,如果返卿false加载动作就会取消 |
onClickRow(rowIndex,rowData) | 当用卢单击一行时触发,参数包括: rowIndex:被单击行的索引,从0开始 rowData:被单击行对应的记录 |
onDblClickRow(rowIndex,rowData) | 当用户双击一行时触发,参数包括: rowIndex:被双击行的索引,从O开始 rowData:被双击行对应的记录 |
onClickCell(rowIndex.field.value) | 当用户单击一个单元格时触发 |
onDblClickCell(rowIndex, field,value) | 当用户双击一个单元格时触发 |
onSelect(rowIndex,rowData) | 当用户选中一行时触发,参数包括: rowIndex:选中行的索引,从0开始 rowData:选中行对应的记录 |
datagrid的Column是一个数组对象,它的每个元素也是一个数组。它定义了每个列的字段。关于column对象的详细参数说明如表1-12所示。
表1-12 column常用属性参数
参 数 | 说 明 |
String title | 列的标题文字 |
String field | 列的字段名 |
Number width | 列的宽度 |
Number rowspan | 指一个单元格占据多少行 |
Number colspan | 指一个单元格占据多少列 |
String align | 指如何对齐此列的数据,可以用'left'、'right'、'center' |
boolean hidden | 若为true,则隐藏此列 |
boolean checkbox | 若为true,则显示checkbox |
function formatter | 单元格的格式化函数,需要3个参数: value:字段的值 rowData:行的记录数据 rowIndex:行的索引 |
续表
参 数 | 说 明 |
function styler | 单元格的样式函数,返回样式字符串来自定义此单元格的样式,如'background:red'。此函数需要3个参数: value:字段的值 rowData:行的记录数据 rowIndex:行的索引 |
function sorter | 自定义字段的排序函数,需要两个参数: a:第一个字段值 b:第二个字段值 |
了解了这些组件之后,接下来我们来看综合运用的案例!
二 综合案例
工程目录
sql代码
CREATE TABLE department
(
deptId SMALLINT PRIMARY KEY,
departName VARCHAR(20) NOT NULL,
address VARCHAR(20)
)
;
CREATE TABLE student
(
stuId INT PRIMARY KEY AUTO_INCREMENT,
stuName VARCHAR(20) NOT NULL,
gender VARCHAR(2),
age SMALLINT,
address VARCHAR(200) DEFAULT '学生宿舍',
deptIdd SMALLINT,
FOREIGN KEY(deptIdd) REFERENCES department(deptId)
)AUTO_INCREMENT=100
;
INSERT INTO department VALUES (10,'计算机系','计算机楼302');
INSERT INTO department VALUES (11,'艺术系','艺术楼211');
INSERT INTO department VALUES (12,'经管系','商学院911');
INSERT INTO department VALUES (13,'工程系','工程楼301');
INSERT INTO department VALUES (14,'土木系','建筑楼355');
--
INSERT INTO Student(stuName,gender,age,address,deptIdd) VALUES ('王燕','女',18,DEFAULT,10);
INSERT INTO Student(stuName,gender,age,address,deptIdd) VALUES ('张栋','男',21,DEFAULT,10);
INSERT INTO Student(stuName,gender,age,address,deptIdd) VALUES ('李波','男',21,DEFAULT,11);
INSERT INTO Student(stuName,gender,age,address,deptIdd) VALUES ('陈建','男',19,DEFAULT,11);
INSERT INTO Student(stuName,gender,age,address,deptIdd) VALUES ('王江洪','男',25,DEFAULT,12);
INSERT INTO Student(stuName,gender,age,address,deptIdd) VALUES ('潘将','男',24,DEFAULT,13);
INSERT INTO Student(stuName,gender,age,address,deptIdd) VALUES ('张斌','男',22,DEFAULT,14);
INSERT INTO Student(stuName,gender,age,address,deptIdd) VALUES ('张斌','女',20,DEFAULT,10);
--
INSERT INTO Student(stuName,gender,age,address,deptIdd) VALUES ('刘大海','男',28,DEFAULT,10);
INSERT INTO Student(stuName,gender,age,address,deptIdd) VALUES ('刘德华','男',31,DEFAULT,10);
INSERT INTO Student(stuName,gender,age,address,deptIdd) VALUES ('周润发','男',41,DEFAULT,11);
INSERT INTO Student(stuName,gender,age,address,deptIdd) VALUES ('张学友','男',37,DEFAULT,11);
INSERT INTO Student(stuName,gender,age,address,deptIdd) VALUES ('周星驰','男',42,DEFAULT,12);
INSERT INTO Student(stuName,gender,age,address,deptIdd) VALUES ('刘亦菲','女',24,DEFAULT,13);
INSERT INTO Student(stuName,gender,age,address,deptIdd) VALUES ('胡歌','男',32,DEFAULT,14);
INSERT INTO Student(stuName,gender,age,address,deptIdd) VALUES ('范冰冰','女',20,DEFAULT,10);
INSERT INTO Student(stuName,gender,age,address,deptIdd) VALUES ('杨幂','女',26,DEFAULT,14);
INSERT INTO Student(stuName,gender,age,address,deptIdd) VALUES ('刘涛','女',27,DEFAULT,13);
INSERT INTO Student(stuName,gender,age,address,deptIdd) VALUES ('周迅','女',21,DEFAULT,13);
INSERT INTO Student(stuName,gender,age,address,deptIdd) VALUES ('古力娜扎','女',19,DEFAULT,10);
INSERT INTO Student(stuName,gender,age,address,deptIdd) VALUES ('黑山老妖','妖',99,DEFAULT,12);
页面代码
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<c:set var="path" value="${pageContext.request.contextPath}"></c:set>
<c:set var="scheme" value="${pageContext.request.scheme}"></c:set>
<c:set var="serverName" value="${pageContext.request.serverName}"></c:set>
<c:set var="serverPort" value="${pageContext.request.serverPort}"></c:set>
<c:set var="basePath" value="${scheme}://${serverName }:${serverPort }${path }/"></c:set>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="${basePath }">
<title>jquery 常用插件</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<!-- jQuery UI样式文件 -->
<link rel="stylesheet" type="text/css" href="jqueryUI/jquery-ui-1.10.4.custom.css">
<!-- easy UI样式文件 -->
<link rel="stylesheet" type="text/css" href="easyui/easyui.css">
<link rel="stylesheet" type="text/css" href="easyui/icon.css">
<style type="text/css">
#tree{width:110px; float: left;}
#content{ float: left;}
#key{margin-bottom: 2px;}
</style>
<!--jQuery基础脚本库-->
<script type="text/javascript" src="easyui/jquery.min.js"></script>
<!-- easy ui 脚本库 -->
<script type="text/javascript" src="easyui/jquery.easyui.min.js"></script>
<!--jquery ui插件脚本库 需要写在easy ui脚本库的后面 -->
<script src="jqueryUI/jquery-ui-1.10.4.custom.js"></script>
<script>
$(document).ready(function(e){
//初始化树
$("#tree").tree({
url:'basic_tree_data.json',//远程加载tree数据的URL路径
animate:true, //是否可以折叠
checkbox:true, //是否显示复选框
cascadeCheck:true, //是否级联
onlyLeafCheck:true, //是否只有叶子节点选中
dnd:true, //是否启用拖放
onClick:function(node){
var idStr=node.id+"";
var url=node.attributes.url;
var data={};//一个json对象
//获得父节点
var theParent=$("#tree").tree('getParent',node.target);
if(idStr.length==2){
data={"departName":node.text};
}
if(idStr.length==3){
data={"departName":theParent.text,"gender":node.text};
}
//加载网格控件
$("#dg").datagrid('load',data);
}
});
//初始化网格控件
$('#dg').datagrid({
url:'ShowStudents.php', //远程请求数据的url路径
pagination:true, //显示底部分页栏
pageSize:3, //默认每页记录数
pageList:[3,5,8], //显示列表记录数的下拉框选项
columns:[[
{field:'stuId',title:'学生编号'},
{field:'stuName',title:'学生名称'},
{field:'gender',title:'性别'},
{field:'age',title:'年龄'},
{field:'departName',title:'部门名称'}
]],
singleSelect:false, //单选还是多选
rownumbers:true, //显示序号
iconCls: 'icon-add', //左上角的一个图标
fitColumns:true,//自适应宽度,防止水平滚动
striped:true,//隔行变色
loadMsg:"正努力为您加载中......"
});
//初始化自动完成控件
$("#myCom").autocomplete({
minLength:1, //至少输入1个字符才触发下拉框
source:function(request,response){
$.post("ShowNames.php","queryStr="+request.term,function(data){
var result=$.parseJSON(data); // 解析服务器传入的json数据
response(result); //把数据展示到下拉框
});
}
});
$("[value=搜索]").click(function(e){
var keyValue=$("[name=keyStr]").val();
$("#dg").datagrid('load',{"queryStr":keyValue});
});
});
</script>
</head>
<body>
<div id="tree"></div>
<div id="content">
<div style="margin-bottom: 2px;">
<h2 style="margin: 0px;"><input type="text" name="keyStr" id="myCom">
<input type="button" value="搜索"/></h2>
</div>
<table id="dg" title="学生列表" class="easyui-grid" style="width:400px;" ></table>
</div>
</body>
</html>
树形菜单json数据格式
[{
"id":1,
"text":"全部",
"attributes":{
"url":"ShowStudents.php"
},
"children":[{
"id":11,
"text":"计算机系",
"attributes":{
"url":"ShowStudents.php"
},
"children":[{
"id":111,
"text":"男",
"attributes":{
"url":"ShowStudents.php"
},
"iconCls":"icon-search"
},{
"id":112,
"text":"女",
"attributes":{
"url":"ShowStudents.php"
},
"iconCls":"icon-add"
}]
},
{
"id":12,
"text":"艺术系",
"attributes":{
"url":"ShowStudents.php"
},
"state":"open",
"children":[{
"id":121,
"text":"男",
"attributes":{
"url":"ShowStudents.php"
}
},{
"id":122,
"text":"女",
"attributes":{
"url":"ShowStudents.php"
},
"iconCls":"icon-search"
}]
},{
"id":13,
"text":"经管系",
"attributes":{
"url":"ShowStudents.php"
},
"state":"open",
"children":[{
"id":131,
"text":"男",
"attributes":{
"url":"ShowStudents.php"
}
},{
"id":132,
"text":"女",
"attributes":{
"url":"ShowStudents.php"
}
}]
}]
}]
jquery ui和easy ui该引入的文件
实体类pageentity
package com.accp.entitys;
import java.io.Serializable;
public class PageEntity implements Serializable{
private static final long serialVersionUID = -1387826548078174866L;
private int pageNo=1; //当前页码
private int pageSize=3; //每页显示多少条
private String keyStr=""; //搜索关键字,根据学生名称
private String gender=""; //性别
private String departName=""; //系名称
public PageEntity() {
}
public PageEntity(int pageNo, int pageSize, String keyStr,
String gender, String departName) {
super();
this.pageNo = pageNo;
this.pageSize = pageSize;
this.keyStr = keyStr;
this.gender = gender;
this.departName = departName;
}
public int getPageNo() {
return pageNo;
}
public void setPageNo(int pageNo) {
this.pageNo = pageNo;
}
public int getPageSize() {
return pageSize;
}
public void setPageSize(int pageSize) {
this.pageSize = pageSize;
}
public String getKeyStr() {
return keyStr;
}
public void setKeyStr(String keyStr) {
this.keyStr = keyStr;
}
public String getGender() {
return gender;
}
public void setGender(String gender) {
this.gender = gender;
}
public String getDepartName() {
return departName;
}
public void setDepartName(String departName) {
this.departName = departName;
}
}
dao层代码
package com.accp.dao;
import java.sql.*;
import java.util.*;
import com.accp.entitys.JoinEntity;
import com.accp.entitys.PageEntity;
public class StudentDaoImpl implements IStudentDao{
//分页查询
public List<JoinEntity> queryPage(PageEntity page) {
List<JoinEntity> stuList=new ArrayList<JoinEntity>();
String sqlStr="SELECT stuId,stuName,gender,age,departName,d.address"
+" FROM student s LEFT JOIN department d"
+" ON s.deptIdd=d.deptId"
+" where 1=1";
if(page.getKeyStr()!=null && !page.getKeyStr().equals("")){
sqlStr=sqlStr+" and s.stuName like '%"+page.getKeyStr()+"%'";
}
if(page.getGender()!=null && !page.getGender().equals("")){
sqlStr=sqlStr+" and s.gender = '"+page.getGender()+"'";
}
if(page.getDepartName()!=null && !page.getDepartName().equals("")){
sqlStr=sqlStr+" and d.departName = '"+page.getDepartName()+"'";
}
sqlStr=sqlStr+" order by s.age limit "
+(page.getPageNo()-1)*page.getPageSize()+" , "
+page.getPageSize();
System.out.println("pageSql:"+sqlStr);
Connection conn=null;
PreparedStatement psmt=null;
ResultSet rs=null;
try {
conn=BaseDao.getConn();
psmt=conn.prepareStatement(sqlStr);
rs=psmt.executeQuery();
JoinEntity stu=null;
while(rs.next()){
stu=new JoinEntity();
stu.setAge(rs.getInt("age"));
stu.setDeptAddress(rs.getString("address"));
stu.setDeptName(rs.getString("departName"));
stu.setGender(rs.getString("gender"));
stu.setStuId(rs.getInt("stuId"));
stu.setStuName(rs.getString("stuName"));
stuList.add(stu);
}
} catch (Exception e) {
e.printStackTrace();
}finally{
BaseDao.closeConn(rs, psmt, conn);
}
return stuList;
}
//根据名称模糊查询所有的名称(为自动完成组件服务的)
public List<String> queryStuNames(String theName) {
List<String> nameList=new ArrayList<String>();
String sqlStr="select stuName from student where stuName like '%"+theName+"%'";
Connection conn=null;
PreparedStatement psmt=null;
ResultSet rs=null;
try {
conn=BaseDao.getConn();
psmt=conn.prepareStatement(sqlStr);
rs=psmt.executeQuery();
while(rs.next()){
nameList.add(rs.getString("stuName"));
}
} catch (Exception e) {
e.printStackTrace();
}finally{
BaseDao.closeConn(rs, psmt, conn);
}
return nameList;
}
//查询总条数
public int queryRows(PageEntity page) {
int rows=0;
String sqlStr="SELECT count(*) "
+" FROM student s LEFT JOIN department d"
+" ON s.deptIdd=d.deptId"
+" where 1=1";
if(page.getKeyStr()!=null && !page.getKeyStr().equals("")){
sqlStr=sqlStr+" and s.stuName like '%"+page.getKeyStr()+"%'";
}
if(page.getGender()!=null && !page.getGender().equals("")){
sqlStr=sqlStr+" and s.gender = '"+page.getGender()+"'";
}
if(page.getDepartName()!=null && !page.getDepartName().equals("")){
sqlStr=sqlStr+" and d.departName = '"+page.getDepartName()+"'";
}
Connection conn=null;
PreparedStatement psmt=null;
ResultSet rs=null;
try {
conn=BaseDao.getConn();
psmt=conn.prepareStatement(sqlStr);
rs=psmt.executeQuery();
if(rs.next()){
rows=rs.getInt(1);
}
} catch (Exception e) {
e.printStackTrace();
}finally{
BaseDao.closeConn(rs, psmt, conn);
}
return rows;
}
}
action代码
package com.accp.actions;
import java.io.*;
import java.util.List;
import com.accp.dao.IStudentDao;
import com.accp.dao.StudentDaoImpl;
import com.accp.entitys.JoinEntity;
import com.accp.entitys.PageEntity;
import com.alibaba.fastjson.JSONArray;
import com.alibaba.fastjson.JSONObject;
import com.opensymphony.xwork2.ActionSupport;
public class StudentAction extends ActionSupport {
private static final long serialVersionUID = -2564481343306358141L;
private String queryStr;
private String gender;
private String departName;
//分页控件自动传过来的
private int rows; //每页显示多少条
private int page; //当前页码
private InputStream bis;
public InputStream getBis() {
return bis;
}
//分页查询
public String queryPage() throws Exception {
IStudentDao stuDao = new StudentDaoImpl();
JSONObject finalJson = new JSONObject();
JSONArray students = new JSONArray();
JSONObject oneStu = null;
System.out.println("departName:"+departName+",gender:"+gender+",queryStr:"+queryStr);
//分页实体类
PageEntity thePage=new PageEntity(page, rows, queryStr, gender, departName);
List<JoinEntity> stuList=stuDao.queryPage(thePage);
for (int i = 0; i < stuList.size(); i++) {
oneStu = new JSONObject();
oneStu.put("stuId", stuList.get(i).getStuId());
oneStu.put("stuName", stuList.get(i).getStuName());
oneStu.put("gender", stuList.get(i).getGender());
oneStu.put("age", stuList.get(i).getAge());
oneStu.put("departName", stuList.get(i).getDeptName());
students.add(oneStu);
}
finalJson.put("total", stuDao.queryRows(thePage));
finalJson.put("rows", students);
System.out.println(finalJson.toString());
bis = new ByteArrayInputStream(finalJson.toString().getBytes("utf-8"));
return this.SUCCESS;
}
//查询学生的名称
public String queryStuName() throws Exception {
IStudentDao stuDao = new StudentDaoImpl();
JSONArray names = new JSONArray();
JSONObject oneStu = null;
List<String> nameList=stuDao.queryStuNames(queryStr);
for(String theName : nameList){
oneStu=new JSONObject();
oneStu.put("label", theName);
names.add(oneStu);
}
System.out.println(names.toString());
bis = new ByteArrayInputStream(names.toString().getBytes("utf-8"));
return this.SUCCESS;
}
public String getQueryStr() {
return queryStr;
}
public void setQueryStr(String queryStr) {
this.queryStr = queryStr;
}
public int getRows() {
return rows;
}
public void setRows(int rows) {
this.rows = rows;
}
public int getPage() {
return page;
}
public void setPage(int page) {
this.page = page;
}
public String getGender() {
return gender;
}
public void setGender(String gender) {
this.gender = gender;
}
public String getDepartName() {
return departName;
}
public void setDepartName(String departName) {
this.departName = departName;
}
}
struts配置代码
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE struts PUBLIC
"-//Apache Software Foundation//DTD Struts Configuration 2.3//EN"
"struts-2.3.dtd">
<struts>
<constant name="struts.action.extension" value="action,do,php"></constant>
<package name="stu" extends="struts-default">
<action name="ShowStudents" class="com.accp.actions.StudentAction"
method="queryPage">
<result type="stream">
<param name="contentType">text/html</param>
<param name="inputName">bis</param>
</result>
</action>
<action name="ShowNames" class="com.accp.actions.StudentAction"
method="queryStuName">
<result type="stream">
<param name="contentType">text/html</param>
<param name="inputName">bis</param>
</result>
</action>
</package>
</struts>
运行结果