Ajax异步刷新分页功能-MySQL
1.Servlet中代码
/** 条件Map */
Map<String, Object> map=new HashMap<String, Object>(); /** 分页配置 */
int index = request.getParameter("index")==null?1:Integer.parseInt(request.getParameter("index"));
int size=2;
map.put("index", (index-1)*size);
map.put("size", size);
/** 根据用户不同的请求进入不同的响应操作 */
String method = request.getParameter("method");
boolean mark=false;
if(method!=null){
if(method.equals("paging")){
/**执行分页操作 */
mark=true;
}
}
/** 得到用户添加到购物车中的商品集合 */
List<Entry> entrys = session.getMapper(EntryDao.class).selectUsEntry(map);
if(mark){
String entrysJson = JSONArray.fromObject(entrys).toString();
out.print(entrysJson);
return;
}
/** 得到总条数 算出总页数 */
Integer entryCount = session.getMapper(EntryDao.class).entryCount(map);
int totalPage=entryCount%size==0?entryCount/size:entryCount/size+1;
/** 响应结果 */
request.setAttribute("entrys", entrys);//得到用户的购物车
request.setAttribute("totalPage", totalPage);//总条数 /** 转发跳转 */
request.getRequestDispatcher("page/crat_page.jsp").forward(request, response);
此为JSP的代码
<body>
<table id="ver-minimalist" >
<thead>
<tr>
<th>类别</th>
<th>商品名字</th>
<th>普通价格</th>
<th>会员价格</th>
<th>数量</th>
<th>操作</th>
</tr>
</thead>
<tbody id="tbodyEntry" >
<c:forEach items="${requestScope.entrys}" var="entry" >
<tr>
<td>${entry.commodity.variety.nickName }</td>
<td>${entry.commodity.nickName }</td>
<td>${entry.commodity.ordinaryPrice }</td>
<td>${entry.commodity.memberPrice }</td>
<td>${entry.quantity }</td>
<td align="center">
<input type="button" value="删除" onclick="" />
</td>
</tr>
</c:forEach>
</tbody>
<thead>
<tr>
<th colspan="6" align="right" ><input type="button" value="结算" onclick="" /></th>
</tr>
</thead>
<tbody>
<tr>
<td colspan="6" align="right"" width="30px" >
<input type="button" value="首页" id="firstpage" />
<input type="button" value="上页" id="beforepage" />
<input type="button" value="下页" id="nextpage" />
<input type="button" value="尾页" id="lastpage" />
<span id="index" >1</span>\<span id="totalPage" >${requestScope.totalPage}</span><!-- 此为当前页，与总页数 -->
</td>
</tr>
</tbody>
此为JQuerty的代码
/** 全局变量 */
var index = 1;
var totalPage = 0; /** 分页窗体事件 */
$(function () {
/**取从Servlect中传到JSP页面的总条数信息 给全局变量totalPage 赋值
* 下为JSP页面中显示当前页和总页数
* <span id="index" >1</span>\<span id="totalPage" >${requestScope.senior.totalPage}</span>
*/
totalPage=$("#totalPage").html();
//首页
$('#firstpage').click(function () {
if (index != 1) {
index = 1;
paging();/** 点击分页异步刷新函数 */
}
return false;
});
//尾页
$('#lastpage').click(function () {
if (index != totalPage) {
index = totalPage;
paging();
}
return false;
});
//上一页
$("#beforepage").click(function () {
if (index != 1) {
index = index - 1;
paging();
}
return false;
}); //下一页
$("#nextpage").click(function () {
if (index < totalPage) {
index = index + 1;
paging();
}
return false;
}); }) /** 点击分页 */
function paging(){
ajaxBase("cartPageServlet?method=paging","index="+index,"paging");
/** 给页面显示当前页赋值 */
$("#index").html(index);
} /** ajax函数工具类
* @param url:地址
* @param data:请求参数
* @param method:方法信号，作用判断进行什么操作
*/
function ajaxBase(url,data,method){
$.ajax({
type:'post',
url:''+url+'',
cache:false,
data:data,
dataType:'text',
success:function(result){
alert("ajax函数工具类:success");
/** 调用请求成功后的操作函数 */
success(result,method);
},
error:function(){
alert("ajax函数工具类:error");
}
});
} /** 根据method方法信号判断进行什么操作
* @param result:服务端响应的数据
* @param method:方法信号，作用判断进行什么操作
*/
function success(result,method){
if(method=="paging"){
$("#tbodyEntry").children().remove();
var result = eval("("+result+")");
var append="";
for(var rst in result){
append=append+""
+"<tr>"
+"<td>"+result[rst].commodity.variety.nickName+"</td>"
+"<td>"+result[rst].commodity.nickName+"</td>"
+"<td>"+result[rst].commodity.ordinaryPrice +"</td>"
+"<td>"+result[rst].commodity.memberPrice +"</td>"
+"<td>"+result[rst].quantity +"</td>"
+"<td align='center'>"
+"<input type='button' value='删除' onclick='javascript:alert('执行删除操作：'"+result[rst].id +")' />"
+"</td>"
+"</tr>"
}
$("#tbodyEntry").append(append);
}
}
Ajax异步刷新分页功能-MySQL的更多相关文章
- springmvc结合ajax的分页功能
var itemCount;//符合查找条件的商品总页数,分页参考 var pageIndex = 0;//当前页,默认为0 var pageSize = 8;//每页显示个数为8 //按条件查找用户 ...
- 分页功能实现之通过ajax实现表单内容刷新
拿代码来说话 我们的需求就是点击翻页功能,实现表格内容局部刷新且能够翻到对应的页面上,不明白? 那么就看看下面的图,需要达到的效果如下所示: 现在要实现的功能就是把红线框起来的表单内容 在点击翻页的时 ...
- Jquery、Ajax实现新闻列表页分页功能
前端页面官网的开发,离不开新闻列表,新闻列表一般都会有分页的功能,下面是我自己总结加查找网上资料写的一个分页的功能,记录一下. 首先,官网的开发建立在前后端分离的基础上: 再有,后端小伙伴们提供列表页 ...
- 2018.2.28 PHP中使用jQuery+Ajax实现分页查询多功能如何操作
PHP中使用jQuery+Ajax实现分页查询多功能如何操作 1.首先做主页Ajax_pag.php 代码如下 <!DOCTYPE html> <html> <head& ...
- 纯手写实现ajax分页功能
前言 最近用到了这个功能,百度大半天,网上的不是有各种问题就是需要引入其他的插件,无奈,只能自己写,大致功能已经完成.前端页面用bootstrap做样式,分页功能用ajax实现,没用其他插件哦,只引入 ...
- 原生PHP实现Mysql数据分页功能
一. 思路整理 实现一个数据分页功能,需要有数据的总条数,每页展示的条数,和当前在第几页这三个参数 通过⌈总条数/每页展示的条数⌉可以得到总页数,比如某留言板有101条留言,每页展示10条,一那就需要 ...
- PHP中使用jQuery+Ajax实现分页查询多功能操作
1.首先做主页面Ajax_pag.php 代码如下: <!DOCTYPE html> <html> <head> <meta charset="UT ...
- java ssm框架实现分页功能 （oracle）
java web 实现分页功能 使用框架:ssm 数据库:oracle 话说 oracle 的分页查询比 mysql 复杂多了,在这里简单谈一下: 查询 前十条数据: SELECT * FROM( S ...
- jPList – 实现灵活排序和分页功能的 jQuery 插件
jPList 是一个灵活的 jQuery 插件,可以用于任何 HTML 结构的排序,分页和筛选.它支持的数据源包括:PHP + MySQL,ASP.NET + SQL Server,PHP + SQL ...
随机推荐
- Codeforces Round #379 (Div. 2) E. Anton and Tree 缩点 直径
E. Anton and Tree 题目连接: http://codeforces.com/contest/734/problem/E Description Anton is growing a t ...
- 进入做Mvc项目的时候 返现某个文件夹下面css js png等静态文件都访问不了
原来是我在该文件夹下面添加了一个web.config 里面 静止了所有的文件 直接访问 <system.web> <httpHandlers> <add ...
- Ubuntu apt命令
http://www.tecmint.com/useful-basic-commands-of-apt-get-and-apt-cache-for-package-management/ apt-ca ...
- 发布FTP服务，防火墙配置
最近需要在Web服务器上发布一下FTP,不想安装Server-U之类的,就用IIS的了,安装好后,发现外网无法连接.经过测试,发现是防火墙的问题. 查找了下关于FTP的资料,ftp server支持两 ...
- 关于IT概念的一些思考
同事提及“软件工程.软件生命周期.项目管理.CMMI.IPD.RUP.UML及UML建模.面向对象分析与设计.需求分析.系统分析与设计……等等,它们到底是什么?它们之间有什么关系?” 下面是个人见 ...
- 电商O2O-11种最佳运营模式
免费模式,是在这种矛盾下应运而生的新型模式.免费模式在未来的几年中,将会不断的渗透到各个行业中,这不单单是加速了行业内部的洗牌速度,更是加速了行业之间的洗牌速度. 未来,免费模式会让行业之间的界限变得 ...
- POJ 3903 Stock Exchange
Stock Exchange Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 2954 Accepted: 1082 De ...
- 实现让Lync client也能够"潜水"隐身聊天
看到MSN或QQ,都支持隐身聊天. Lync Server 2013也是支持的. 1.Server端:Lync 2013 Server 缺省策略是没有设置显示脱机功能.(设置前截图) 2.直 ...
- failed jobs because of past close date，关工单报错
今天会计反映关不了工单.我们公司关工单的程序是自己开发的,可以整批关.报如下错误.我试着用Standad程序关,可以.看来应该是我们开发的程序有问题.后来发现,是抛到WIP_DJ_CLOSE_TEMP ...
- js获取url参数值的方法
index.htm?参数1=数值1&参数2=数值2&参数3=数据3&参数4=数值4&...... 静态html文件js读取url参数 根据获取html的参数值控制htm ...