jQuery EasyUI教程之datagrid应用(二)
上次写到了让数据库数据在网页datagrid显示,我们只是单纯的实现了显示,仔细看的话显示的信息并没有达到我们理想的效果,这里我们丰富一下:
上次显示的结果是这样的
点击查看上篇:jQuery EasyUI教程之datagrid应用(一)

这里不难发现生日的格式是毫秒(long型数据),并不是我们想要的年月日的格式,那我们就修改一下
我们在js中写入格式时间的方法,并在生日一列用formatter来调用方法格式时间,
//格式化时间
//把long型日期转为想要类型
function getDate(date)
{
//得到日期对象
var d = new Date(date) ; //得到年月日
var year = d.getFullYear() ;
var month = (d.getMonth()+ 1) ;
var day = d.getDate() ; //封装
var tt = year+"-"+(month<?"0"+month: month)+"-"+(day<10?"0"+day:day) ; return tt ;
}

此时,我们在查看页面,我们就发现生日栏变成我们想要的结果了

接下来就是分页了,原理 :datagrid有分页功能,我们只要把分页打开就好,当发送请求时,他会自己传递两个参数到Servlet,我们接受下再传递给dao,Hibernate也提供了分页功能,我们一结合就好了,
1.我们现在dao层修改下上次的代码,将参数传递过去
//查询联系人
public List<Phone> showAll(int page, int rows)
{
init() ; List<Phone> list = null ; String hql = "from Phone where 1=1 " ; list = se.createQuery(hql)
.setMaxResults(rows)
.setFirstResult((page - 1) * rows )
.list() ; destroy(); return list;
}
2.并且还要增加一个查询总数的方法
这里我们要查询总数,值得注意的是我们这用的是Object类型的List集合
//获取联系人记录条数
public int getTotal()
{
init() ; int rtn = 0 ; List<Object> list = null ; String hql = "select count(1) from Phone where 1=1 " ; list = se.createQuery(hql).list() ; if(list != null && list.size() > 0 )//判断获取的集合非空及长度
{
rtn = Integer.parseInt(list.get(0).toString()) ;//给变量rtn赋值
} destroy(); return rtn;
}
3.接下来我们再在service层修改下我们的方法,将记录的条数添加进去
public String getPageJSON(int page, int rows)
{
String rtn = "{\"total\":0,\"rows\":[ ]}";//定义变量并初始化JSON格式的结果集 PageJSON<Phone> pjson = new PageJSON<Phone>() ;//封装Rate类 int total = new PhoneDAO().getTotal() ; if(total > 0)
{
List<Phone> list = new PhoneDAO().showAll(page, rows) ;//定义List集合并赋值 String json_list = JSONArray.toJSONString(list) ; //将List集合转为JSON集合 /*
* 通过set方法给实例化的对象赋值
*/
pjson.setRows(list);
pjson.setTotal(total); rtn = JSONArray.toJSONString(pjson) ; //将对象JSON类型的数组
} return rtn ; //返回JSON类型的结果集
}
4.最后我们在修改下Servlet的doGet方法
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
//转码
request.setCharacterEncoding("UTF-8");
response.setCharacterEncoding("UTF-8");
response.setContentType("text/html");
//接收请求
//1每页行数
String rows = request.getParameter("rows") ;
//2页码
String page = request.getParameter("page") ;
if(rows != null && page != null)//非空判断
{
int rowss = Integer.parseInt(rows) ;//类型转换
int pagess = Integer.parseInt(page) ;//类型转换
String json_list = new PhoneService().getPageJSON(pagess, rowss) ;//方法调用
response.getWriter().write(json_list) ;
}
else
{
response.getWriter().write("{\"total\":0,\"rows\":[ ]}") ;
}
}
到这里我们的分页功能就实现了。
下篇datagrid增删改
jQuery EasyUI教程之datagrid应用(二)的更多相关文章
- jQuery EasyUI教程之datagrid应用(三)
今天继续之前的整理,上篇整理了datagrid的数据显示及其分页功能 获取数据库数据显示在datagrid中:jQuery EasyUI教程之datagrid应用(一) datagrid实现分页功能: ...
- jQuery EasyUI教程之datagrid应用(一)
最近一段时间都在做人事系统的项目,主要用到了EasyUI,数据库操作,然后抽点时间整理一下EasyUI的内容. 这里我们就以一个简洁的电话簿软件为基础,具体地说一下datagrid应用吧 datagr ...
- jQuery EasyUI教程之datagrid应用
一.利用jQuery EasyUI的DataGrid创建CRUD应用 对网页应用程序来说,正确采集和管理数据通常很有必要,DataGrid的CRUD功能允许我们创建页面来列表显示和编辑数据库记录.本教 ...
- jQuery EasyUI教程之datagrid应用-1
一.利用jQuery EasyUI的DataGrid创建CRUD应用 对网页应用程序来说,正确采集和管理数据通常很有必要,DataGrid的CRUD功能允许我们创建页面来列表显示和编辑数据库记录.本教 ...
- jQuery EasyUI教程之datagrid应用-2
二.DataGrid的扩展应用 上一份教程我们创建的一个CRUD应用是使用对话框组件来增加或编辑用户信息.本教程将教你如何创建一个CRUD 数据表格(datagrid). 为了让这些CRUD功能正常工 ...
- jQuery EasyUI API - Grid - DataGrid [原创汉化官方API]
最近在学习jQuery EasyUI,发现中文的文档好少,部分文档不错但它是鸟语的,为了大家也为了自己学习吧,汉化做一下笔记. 有没有说清楚的,或者翻译不正确的地方还请大家谅解指出.. 由于工作时间原 ...
- 关于Jquery EasyUI中的DataGrid服务器端分页随记
一.关于DataGrid的分页和排序参数 对于分页参数不需要用户指定,程序在AJAX请求的时候会带上分页和排序需要的参数 每页显示条数:rows 当前页:page 排序字段:sort [multiS ...
- 【Jquery EasyUI + Servlet】DataGrid,url请求带中文出现乱码的解决方案
demo.jsp: <% String name = "乱码"; %> $(function(){ $('#dg').datagrid({ url: 'DemoServ ...
- jQuery基础教程之is()方法和has() 方法
is()方法 —— 用于筛选 语法: jQueryObject.is( expr )返回值: is()函数的返回值为Boolean类型.true或者false.只要其中至少有一个元素符合给定的表达式就 ...
随机推荐
- DS-5建工程
DS-5教程-使用ARM DS-5 和DSTREAM仿真器调试裸机程序 http://bbs.elecfans.com/jishu_453909_1_1.html i2c( 楼主 )2014-10-1 ...
- Hadoop基础知识
摘要:Hadoop的安装目录了解.etc的核心配置项.hadoop的启动.HDFS文件的block块级副本的存放策略.checkpoint触发设置. 1.hadoop目录了解 bin:可执行文件,命令 ...
- PAT线性结构_一元多项式求导、按给定步长反转链表、出栈序列存在性判断
02-线性结构1. 一元多项式求导 (25) 设计函数求一元多项式的导数.(注:xn(n为整数)的一阶导数为n*xn-1.) 输入格式:以指数递降方式输入多项式非零项系数和指数(绝对值均为不超过100 ...
- C/C++ 结构体 指针 函数传递
#include <stdio.h> #include <stdlib.h> struct student{ int num; ]; double dec; }; void s ...
- sql要点
oracle 并操作 union 自动去除重复 如果想保留重复,需要使用union all 交操作intersect 自动去除重复 如果想保留重复,需要使用intersect all ...
- 总结Android中遇见的OOM
一 .Android应用中内存泄漏几种的原因: 1.单例模式导致的内存泄漏: 当调用getInstance时,如果传入的context是Activity的context.只要这个单例没有被释放,这个A ...
- peoplesoft SQR language
Understanding SQR Data Elements !Variables!Variables are storage places for text or numbers that you ...
- htm5l,第一个script代码练习
<body> <canvas id="mycanvas" width="500" height="300"> ...
- Android中top命令字段含义
PID PR CPU% S #THR VSS RSS PCY UID Name 1 ...
- 关于缺少nvToolsExt64_1.lib时的PhysX的处理
我本人之所以缺少这个文件是因为我的PhysX如果你的PhysX是从UE4源代码中提取的,那么可能会出现如下错误,提示找不到nvToolsExt64_1.lib(本机是64bit的操作系统) 那就执行u ...