小弟第一次搞easyui 因为框架式spring mvc+hibernate so开始我们的分页之旅。
先看下效果
[img]http://dl2.iteye.com/upload/attachment/0097/4250/a36d66f9-2698-3545-bf44-ac5f6fba56fc.png[/img]
easyui的datagrid的方式有多种,小弟用的是
<table id="dg" class="easyui-datagrid"
style="width:700px;height:250px;" title="您的位置:用户界面"
data-options="rownumbers:true,pagination:true,fitColumns:true,fit:true,pageSize:20,toolbar:'#tb',url:'user/getUserAll.do',method:'post'">
<thead>
<tr>
<th data-options="field:'ck',checkbox:true"></th>
<th data-options="field:'userId',width:100,hidden:true"
align="center"></th>
<th
data-options="field:'userComp',width:100,align:'center',formatter:formatComp">角色名称</th>
<th data-options="field:'userName',width:100,align:'center'">登陆名称</th>
<th data-options="field:'userPass',width:100,align:'center'"
hidden="true">登陆密码</th>
<th data-options="field:'userNickName',width:100,align:'center'">真实姓名</th>
<th data-options="field:'userTime',width:100,align:'center'">添加时间</th>
<th data-options="field:'loginNum',width:100,align:'center'">登陆次数</th>
<th data-options="field:'loginIP',width:200,align:'center'">登陆IP</th>
<th data-options="field:'loginTime',width:200,align:'center'">最近登陆时间</th>
<th data-options="field:'userRemark',width:200,align:'center'">用户备注</th>
</tr>
</thead>
</table>
前台就不说了,主要看后台了.
1.先看Controller
/**
* 根据分页跟查询条件获取数据
*
* @param request
* @return
*/
@RequestMapping(value = "/getUserAll.do", method = RequestMethod.POST)
public @ResponseBody
Map<String, Object> getAll(String userName, HttpServletRequest request) {
Map<String, Object> result = new HashMap<String, Object>();
int page = request.getParameter("page") == null ? 1 : Integer
.parseInt(request.getParameter("page"));
int rows = request.getParameter("rows") == null ? 10 : Integer
.parseInt(request.getParameter("rows"));
Userinfo user = new Userinfo();
user.setUserName(userName);
// 使用spring的BeanUtils工具,复制属性到u里面。
// BeanUtils.copyProperties(this, user);
List<Userinfo> list = userService.getUserAll(page, rows, user);
int total = userService.getTotalPages(user);
if(list==null||list.size()==0){
result.put("rows", "");//
}else{
result.put("rows", list);
}
result.put("total", total);
return result;
}
因为easyui分页格式为这样的 {"total":5,"rows":[{"userName":"admin",}]} 所以这个地方就拼了下
先看下效果
[img]http://dl2.iteye.com/upload/attachment/0097/4250/a36d66f9-2698-3545-bf44-ac5f6fba56fc.png[/img]
easyui的datagrid的方式有多种,小弟用的是
<table id="dg" class="easyui-datagrid"
style="width:700px;height:250px;" title="您的位置:用户界面"
data-options="rownumbers:true,pagination:true,fitColumns:true,fit:true,pageSize:20,toolbar:'#tb',url:'user/getUserAll.do',method:'post'">
<thead>
<tr>
<th data-options="field:'ck',checkbox:true"></th>
<th data-options="field:'userId',width:100,hidden:true"
align="center"></th>
<th
data-options="field:'userComp',width:100,align:'center',formatter:formatComp">角色名称</th>
<th data-options="field:'userName',width:100,align:'center'">登陆名称</th>
<th data-options="field:'userPass',width:100,align:'center'"
hidden="true">登陆密码</th>
<th data-options="field:'userNickName',width:100,align:'center'">真实姓名</th>
<th data-options="field:'userTime',width:100,align:'center'">添加时间</th>
<th data-options="field:'loginNum',width:100,align:'center'">登陆次数</th>
<th data-options="field:'loginIP',width:200,align:'center'">登陆IP</th>
<th data-options="field:'loginTime',width:200,align:'center'">最近登陆时间</th>
<th data-options="field:'userRemark',width:200,align:'center'">用户备注</th>
</tr>
</thead>
</table>
前台就不说了,主要看后台了.
1.先看Controller
/**
* 根据分页跟查询条件获取数据
*
* @param request
* @return
*/
@RequestMapping(value = "/getUserAll.do", method = RequestMethod.POST)
public @ResponseBody
Map<String, Object> getAll(String userName, HttpServletRequest request) {
Map<String, Object> result = new HashMap<String, Object>();
int page = request.getParameter("page") == null ? 1 : Integer
.parseInt(request.getParameter("page"));
int rows = request.getParameter("rows") == null ? 10 : Integer
.parseInt(request.getParameter("rows"));
Userinfo user = new Userinfo();
user.setUserName(userName);
// 使用spring的BeanUtils工具,复制属性到u里面。
// BeanUtils.copyProperties(this, user);
List<Userinfo> list = userService.getUserAll(page, rows, user);
int total = userService.getTotalPages(user);
if(list==null||list.size()==0){
result.put("rows", "");//
}else{
result.put("rows", list);
}
result.put("total", total);
return result;
}
因为easyui分页格式为这样的 {"total":5,"rows":[{"userName":"admin",}]} 所以这个地方就拼了下