//这里假定了解servlet的web.xml的配置,这里不再赘述
//关于spring mvc、mybatis、spring怎么整合及整合要配置什么文件,怎么配置也省略
//本人数据库用的是mysql,开发工具window+eclipse
1、userMapper.xml(mybatis)
<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd" > <mapper namespace="demo.mapper.UserLimitMapper"> <select id="userLimit" parameterType="map" resultType="demo.model.User"> select * from cn_user limit #{pageNumRow},#{pageRow} </select> <select id="userCount" resultType="int"> select count(*) from cn_user </select> </mapper>
2、Dao层
package demo.mapper;
import java.util.List;
import java.util.Map;
import demo.model.User;
public interface UserLimitMapper {
public List<User> userLimit(Map map);
public int userCount();
}
3、测试Dao
package demo.UserTest;
import java.util.HashMap;
import java.util.Iterator;
import java.util.List;
import java.util.Map;
import javax.sql.DataSource;
import org.junit.Test;
import org.springframework.context.ApplicationContext;
import org.springframework.context.support.ClassPathXmlApplicationContext;
import demo.mapper.UserLimitMapper;
import demo.model.User;
public class AppTest {
@Test
public void test1() {
String str = "spring/spring-core.xml";
ApplicationContext ap = new ClassPathXmlApplicationContext(str);
UserLimitMapper mapper = ap.getBean("userLimitMapper", UserLimitMapper.class);
int a=mapper.userCount();
System.out.println(a);
Map<String, Object> map = new HashMap<String, Object>();
//这儿写死是为了测试userMapper中的分页是否好用
map.put("pageNumRow", 0);
map.put("pageRow", 3);
List<User> users = mapper.userLimit(map);
for (User user : users) {
System.out.println(user);
}
}
}
4、Service层
package demo.service;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import demo.mapper.UserLimitMapper;
import demo.model.User;
@Service
public class UserService {
@Autowired
private UserLimitMapper mapper;
public int userCountService(){
return mapper.userCount();
}
public List<User> UserLimitService(int row,int page){
Map<String, Object> map = new HashMap<String, Object>();
int pageNumRow =(page-1)*row;
map.put("pageNumRow", pageNumRow);
map.put("pageRow", row);
return mapper.userLimit(map);
}
}
5、Controller层
package demo.controler;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import demo.model.User;
import demo.service.UserService;
@Controller
@RequestMapping(value = "/src")
public class UserController {
@Autowired
private UserService service;
@RequestMapping(value = "/user.do")
@ResponseBody
public Map<String, Object> controller(int page, int rows) {//接收从前台传递的两个参数row,page(字段名不可变)
List<User> list = service.UserLimitService(rows, page);
Map<String, Object> map = new HashMap<>();
int totalrows = service.userCountService();
map.put("total", totalrows);
map.put("rows", list);
return map;//向前台传递了一个map集合,这里有些疑惑,必须是map集合么?
}
}
6.JSP datagrid 页面
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!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>员工列表</title>
<link rel="stylesheet" type="text/css" href="themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="themes/icon.css">
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript" src="jquery.easyui.min.js"></script>
</head>
<body>
<table class="easyui-datagrid" style="width: 100%; height: 800px"
data-options="url:'<%=request.getContextPath()%>/src/user.do',fitColumns:true,singleSelect:true,rownumbers:true,pagination:true">
<thead>
<tr>
<th data-options="field:'cn_user_id',width:100">id</th><!--field属性为实体类字段名 -->
<th data-options="field:'cn_user_name',width:100">name</th>
<th data-options="field:'cn_user_password',width:100">password</th>
<th data-options="field:'cn_user_token',width:100">token</th>
<th data-options="field:'cn_user_desc',width:100">desc</th>
</tr>
</thead>
</table>
</body>
</html>
7.总结
easy UI 中datagrid依赖关系为
panel、resizable、linkbutton、pagination
pagination组件中的按钮会触发事件,发送ajax请求,向后台传递两个参数
page:1;rows:10
所以在Controller要接收参数并返回map,通过@ResponseBody 标签向前台页面传递json对象
{total: 11, rows: [,…]}
rows: [,…]
0: {cn_user_id: "03590914-a934-4da9-ba4d-b41799f917d1", cn_user_name: "zhouj", cn_user_password: "123456"}
1: {cn_user_id: "2273f742-61ec-4440-b88a-42cf48db19ff", cn_user_name: "zhoujia123",…}
2: {cn_user_id: "333c6d0b-e4a2-4596-9902-a5d98c2f665a", cn_user_name: "test1", cn_user_password: "123456"}
3: {cn_user_id: "39295a3d-cc9b-42b4-b206-a2e7fab7e77c", cn_user_name: "zhoujia",…}
4: {cn_user_id: "48595f52-b22c-4485-9244-f4004255b972", cn_user_name: "demo", cn_user_password: "123456"}
5: {cn_user_id: "524f7440-7283-4b2d-8af5-4a67570e892e", cn_user_name: "pc", cn_user_password: "123456"}
6: {cn_user_id: "52f9b276-38ee-447f-a3aa-0d54e7a736e4", cn_user_name: "wsf", cn_user_password: "123456"}
7: {cn_user_id: "6f339f0a-2068-4db1-8fef-8e68f444c72c", cn_user_name: "saipi", cn_user_password: "123456"}
8: {cn_user_id: "974375a8-8557-4308-bd36-9455c7863239", cn_user_name: "zhoujia1231",…}
9: {cn_user_id: "bf9d2885-f34e-4c78-9ae5-2723f62aa2b5", cn_user_name: "saipi", cn_user_password: "123456"}
total: 11