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.只要其中至少有一个元素符合给定的表达式就 ...
随机推荐
- js数组方法扩展
/** * Created by Administrator on 2016/9/1. */ //数组去重 Array.prototype.unique = function(){ this.sort ...
- centos6.4 挂载新盘并移动mysql数据目录
1 centos 挂载新盘并格式化 以vmware workstation12 中安装的centos6. 虚拟机为例进行演示 关机,添加硬盘 开机,格式化硬盘,并挂载 通过命令查看硬盘 fdisk – ...
- My 1st webUI try
1. Add three control to the UI: StartTime EndTime Weekdays: 2015-11-17 20:26:40 data-model: Html5在ht ...
- 找出A字符串中出现B字符串的起始位置
/** * 找出B出现在A中的起始位置 * @param A * @param lenA * @param B * @param lenB * @date 2016-10-7 * @author sh ...
- Mac下搭建git
一.在本地git库中添加用户名及邮箱 git config --global user.name "username" git config --global user.email ...
- JAVA反射参数传递
引用:http://fish2700.blog.163.com/blog/static/130713192009103035723281/ 使用Method反射调用函数时,我们通常会遇到以下几种情况: ...
- css中子元素浮动,无法自动撑开父元素的解决办法
<div> <div style="float:left;">left</div> <div style="float:righ ...
- Evolution项目(1)
Evolution项目是基于NFine修改的项目 主要改动为: 支持了.net core 1.0 支持了 EF core 1.0 支持数据库自动创建及Demo数据自动灌入 修改了授权方式 新增加了一个 ...
- Qt之添加QLabel的点击事件
QLabel功能为显示了一个字符串或者图片等信息,它本身没有click信号.也就不能够响应click点击事件,有什么办法来实现来,我们可以子类化QLabel,实现MouseXXXEvent.class ...
- vs2010问题:未能安装xxx包
打开vs2010新建c++工程,出现问题如图 原因是重复安装了,之前安装的没有删除干净,导致冲突. 如果你的vs2010安装在c盘,解决方法:http://blog.sina.com.cn/s/blo ...