1、需要用到的jar包、js文件
JSONArray().fromObject()需要的jar包:
(1)commons-beanutils-1.8.3.jar
(2)commons-collections-3.2.1.jar
(3)commons-lang-2.6.jar
(4)commons-logging-1.1.1.jar
(5)ezmorph-1.0.6.jar
(6)json-lib-2.4-jdk15.jar
jqPaginator分页组件:http://jqpaginator.keenwon.com/
(1)jquery-1.11.0.min.js
(2)jqPaginator.min.js
2、
public class NewsListPage { //当前页码
private int pageIndex;
//每页显示的记录条数
private int pageSize;
//总页数
private int pageCount;
//当前页的数据
private List<News> newsList = new ArrayList<News>();
}
1 //获得分页的新闻信息列表
public NewsListPage getNewsListPage(int pageSize,int pageIndex){
NewsListPage newsListPage = new NewsListPage();
List<News> newsList = iFrameDao.getNewsList(pageSize, pageIndex);
int count = iFrameDao.getNewsCount(); //计算需要分的页数
int pageCount = 0;
if(count%pageSize == 0){
pageCount = count/pageSize;
}else{
pageCount = count/pageSize + 1;
}
......
...... return newsListPage;
}
//获得newslist.jsp新闻信息列表
public List<News> getNewsList(int pageSize,int pageIndex){
List<News> newsList = iFrameDao.getNewsList(pageSize,pageIndex);
return newsList;
} //获得新闻记录总数
public int getNewsCount(){
int count = iFrameDao.getNewsCount();
return count;
}
servlet:
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException { IFrameBll iframeBll = new FrameBll(); // 设定默认的每页显示条数
int pageSize = 15;
// 设定默认的页码数
int pageIndex = 1;
String currentIndex = request.getParameter("pageIndex");
if(currentIndex != null){
pageIndex = Integer.parseInt(currentIndex);
}
//获得分页的新闻信息列表
NewsListPage newsListPage = iframeBll.getNewsListPage(pageSize,pageIndex);
JSONArray json = null;
json=new JSONArray().fromObject(newsListPage);
PrintWriter out = response.getWriter();
out.write(json.toString());
out.flush();
out.close();
}
js:
/**
* newslist.jsp
*/
var model = {
pageIndex: 1, //索引页
pageSize: 3, //每页列表的行数
//filterCounts: 1, //筛选后的总行数
pageCount: 1,//总页数
}; $(document).ready(function () {
Filter();
}); function Filter() {
$.ajax({
type:"POST",
dataType:"json",
url:"news.do", //回发到的页面
data:"pageIndex=" + model.pageIndex + "&pageSize=" + model.pageSize,
//async:false,
cache:false,
success: function(data) {
var newsdata = eval(data);
if (newsdata[0].pageCount == 0 ) {
//model.filterCounts = 1;
}else{
model.pageSize = newsdata[0].pageSize;
model.pageCount = newsdata[0].pageCount;
model.pageIndex = newsdata[0].pageIndex;
}
$("#news").empty(); //清空div中内容
$("#news").append('<ul id="ulnews" class="allnews">'+'</ul>'); $.each(newsdata[0].newsList, function (index, content) {
。。。。。
显示的数据,具体样式自定义。
。。。。。
}) paginator(model.pageIndex, model.pageSize,model.pageCount); },
error:function(){
$("#news").empty(); //清空div中内容
$("#news").append('<strong><p style="text-indent:2em">No Contents</p></strong>');
}
});
} function paginator(pageIndex, pageSize, pageCount) {
$.jqPaginator('#jqPaginator', {
totalPages: pageCount,
visiblePages: 10,
currentPage: pageIndex,
pageSize: pageSize,
first: '<li><a href="javascript:void(0);">First<\/a><\/li>',
prev: '<li><a href="javascript:void(0);">Previous<\/a><\/li>',
next: '<li><a href="javascript:void(0);">Next<\/a><\/li>',
last: '<li><a href="javascript:void(0);">Last<\/a><\/li>',
page: '<li><a href="javascript:void(0);">{{page}}<\/a><\/li>',
onPageChange: function (n, type) {
if (type == 'change' && n != model.pageIndex) {
model.pageIndex = n; //点击改变页码时,同步model中的页码
Filter(); //重新生成新表
}
}
});
}
jsp:
<h2>News</h2>
<div id="news" style="height:350px">
<strong><p style="text-indent:2em">No Contents</p></strong>
</div>
<div align="center">
<ul class="pagination" id="jqPaginator"></ul>
</div>
效果图:
『实践』Java Web开发之分页(ajax)的更多相关文章
-
Java Web开发之分页(ajax)
1.需要用到的jar包.js文件 JSONArray().fromObject()需要的jar包: (1)commons-beanutils-1.8.3.jar (2)commons-collecti ...
-
使用Eclipse+Maven+Jetty构建Java Web开发环境(几个教程综合集成2014发行)
工作需要使用Jetty由于web集装箱,得知Eclipse+Maven+Jetty该组合是非常好的,因此,要在网上找了很多教程,但不写或多或少特定的或过时的内容而导致最终的配置失败,易于配置为未来的同 ...
-
『实践』VirtualBox 5.1.18+Centos 6.8+hadoop 2.7.3搭建hadoop完全分布式集群及基于HDFS的网盘实现
『实践』VirtualBox 5.1.18+Centos 6.8+hadoop 2.7.3搭建hadoop完全分布式集群及基于HDFS的网盘实现 1.基本设定和软件版本 主机名 ip 对应角色 mas ...
-
【原创】三分钟教你学会MVC框架——基于java web开发(2)
没想到我的上一篇博客有这么多人看,还有几位看完之后给我留言加油,不胜感激,备受鼓励,啥都别说了,继续系列文章之第二篇.(如果没看过我第一篇博客的朋友,可以到我的主页上先浏览完再看这篇文章,以免上下文对 ...
-
个人的java web开发书单
首发至个人博客http://www.zidafone.com/blog/36 以下是对一些读过的书和一些买后随便翻了翻的书的个人感觉.都是java web开发的程序员可能接触的书,其他的如设计/手机开 ...
-
《Java web 开发实战经典》读书笔记
去年年末,也就是大四上学期快要结束的时候,当时保研的事情确定了下来,终于有了一些空闲的时间可以学点实用的技术. 之前做数据库课程设计的时候,也接触过java web的知识,当时做了一个卖二手书籍的网站 ...
-
SpringMVC内容略多 有用 熟悉基于JSP和Servlet的Java Web开发,对Servlet和JSP的工作原理和生命周期有深入了解,熟练的使用JSTL和EL编写无脚本动态页面,有使用监听器、过滤器等Web组件以及MVC架构模式进行Java Web项目开发的经验。
熟悉基于JSP和Servlet的Java Web开发,对Servlet和JSP的工作原理和生命周期有深入了解,熟练的使用JSTL和EL编写无脚本动态页面,有使用监听器.过滤器等Web组件以及MVC架构 ...
-
《Java Web开发实战》——Java工程师必备干货教材
一年一度毕业季,又到了简历.offer漫天飞,失望与希望并存的时节.在IT行业,高校毕业生求职时,面临的第一道门槛就是技能与经验的考验,但学校往往更注重学生的理论知识,忽略了对学生实践能力的培养,因而 ...
-
java web 开发三剑客 -------电子书
Internet,人们通常称为因特网,是当今世界上覆盖面最大和应用最广泛的网络.根据英语构词法,Internet是Inter + net,Inter-作为前缀在英语中表示“在一起,交互”,由此可知In ...
随机推荐
-
npm全局安装和本地安装和本地开发安装(npm install --g/--save/--save-dev)
详细说明参考:http://www.cnblogs.com/PeunZhang/p/5629329.html 我个人理解: 1.全局安装(npm install -g)是为了用命令行,比如在windo ...
-
【整理】--C++三种参数传递方式
在C++中,共有三种参数传递方式: 按值传递(pass by value) 地址传递(pass by pointer) 引用传递(pass by reference) (1)按值传递的过程为:首先计算 ...
-
Node.js使用fs.renameSync报cross-device link not permitted错误
在Node.js中,我们可以使用formidable模块来轻松地实现文件上传功能,代码如下: var Q = require('q'); var util = require('util'); var ...
-
day6_1
一.加密模块 1.hashlib >>> data=hashlib.md5() >>> data.update(b'hello') >>> pri ...
-
C语言下WebService的使用方式
用gSoap工具: 1.在dos环境中到gSoap工具对应的目录gsoap_2.8.18\gsoap-2.8\gsoap\bin\win32路径下,执行wsdl2h -c -o *.h ht ...
-
cocos2d-x实战 C++卷 学习笔记--第4章 win32平台下中文乱码问题
前言: 将GBK编码的字符串转为UTF-8编码.(通俗点说就是解决中文乱码问题) 简要介绍: 在Win32平台下通过 log 输出中文字符时,会出现中文乱码问题.同样的代码在 ios 和 Androi ...
-
[转]Virtualbox主机和虚拟机之间文件夹共享及双向拷贝(Windows<;->;Windows, Windows<;->;Linux)
本文转自:https://www.jb51.net/article/97271.htm 最近学习Virtualbox的一些知识,记录下,Virtualbox下如何实现主机和虚拟机之间文件夹共享及双向拷 ...
-
C#执行JavaScript脚本代替Compute
DataTable.Compute不支持round之类的函数,可以调用JScript实现. 1.添加引用Microsoft.Vsa和Microsoft.JScript2.例子代码 object ret ...
-
Linux:写一个简单的服务器
开始了新篇章:Linux网络编程. 基础知识: 套接字概念 Socket本身有"插座"的意思,在Linux环境下,用于表示进程间网络通信的特殊文件类型.本质为内核借助缓冲区形成的伪 ...
-
msyql [note] mysqld (mysqld 5.6.40) starting as process xxxx...
my.ini有2个配置一个是客户端[client],一个是服务器端[mysqld] 如果把2个都设置为utf8,那么中文会显示乱码,或者无法插入中文 而把客户端设置为gbk,把服务器端设置为utf8就 ...