文档章节

数据库分页查询和跨页选中行问题处理

海岸线的曙光
 海岸线的曙光
发布于 2018/07/03 13:51
字数 1097
阅读 680
收藏 14

    今天看到一篇博客,突然想到以前遇到的一个类似的问题,关于分页查询和跨页保持选中行的问题,下面给出答案,一起探讨下吧。

    一、什么是数据库分页查询?

    即在服务端分页,跳到第n页才查询、显示第n页的内容。优点:实时性:跳页才查询。数据量小:只加载当前页的记录进行显示。不同的框架对分页的处理也不一样,有的是集成为类的形式,有的是单独处理。

    这里以MySQL数据库为例:

    查询数据总数:select count(*) from table;

    查询显示的数据集:select * from table limit pageNo,rowsCount;

    关于MySQL分页查询和优化可参考该链接:MySQL大数据量分页查询方法及其优化

    二、跨页保持选中行?

    类似下面的表格:

    跨页保持选中项的处理,这里就不贴出jsp页面代码了,基本都是form-action的模式,处理涉及到jsp页面,js,后端代码,主要是将勾选值存储在隐藏域中,如下:

    (1)jsp页面调整

    添加隐藏域,存储复选框勾选的值,这里存的ID,因为其唯一性:

<input type="hidden" name="CX_IDS" id="CX_IDS" value="${CHECK_IDS }" />

    这里数据是通过循环显示的,varList 是后台传递显示的数据集:

<c:forEach items="${varList}" var="var" varStatus="vs">
   <tr>
      <td class='center' style="width: 30px;">
         <label><input type='checkbox' name='ids' value="${var.STU_ID}" />
         <span class="lbl"></span></label>
      </td>
      <td class='center' style="width: 30px;">${vs.index+1}</td>
      <td>${var.NAME}</td>
      <td>${var.SEX}</td>
      <td>${var.YEAR}</td>
      <td>${var.ISON}</td>
      <td>${var.SPEC}</td>
   </tr>
</c:forEach>

    修改上面复选框 checkbox 的显示:

<td class='center' style="width: 30px;">
	<c:set var="flag" value="0" /> 
	<c:forEach items="${cxList}" var="cx">
	<c:if test="${cx == var.STU_ID }">
	<label><input type='checkbox' name='ids' onClick="isChecked('${var.STU_ID}')" 
    value="${var.STU_ID}" checked />
	<span class="lbl"></span></label>
	<c:set var="flag" value="1" />
	</c:if>
	</c:forEach> 
	<c:if test="${flag != '1' }">
	<label><input type='checkbox' name='ids' onClick="isChecked('${var.STU_ID}')" 
    value="${var.STU_ID}" />
	<span class="lbl"></span></label>
	</c:if>
</td>

    其中:cxList 是后台传递的存储复选框勾选的值的集合,onClick 是点击勾选时的响应事件函数,并将对应ID作为参数传入,通过<c:set>方式显示勾选和不勾选时的状态。

    在使用上面<c:set>或者<c:foreach>时,记得在页面上方添加如下引用,防止出错:

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>

    (2)js函数处理

    在js中处理勾选时的响应事件,主要分为三步:

        将勾选值与存储的所有值一一比较,有则表示删除,无则表示添加;

        将存储后的值以逗号的形式拼接成字符串;

        重新赋值给隐藏域;

function isChecked(ids){
	var str = '';
	//数组下标
	var szXB = '';
	//是否存在标识
	var isHave = new Boolean(false);
	//数组
	var idsArray = new Array();
    //获取隐藏域的值
	var cxIDS = $('#CX_IDS').val(); 
    //解析存入数组中
	idsArray = cxIDS.split(",");
	//数组长度
	var size = idsArray.length; 
	/* 将勾选值与存储的所有值一一比较,有则表示删除,无则表示添加 */			
	for(var i=0;i < size;i++){
		if(idsArray[i] == ids){
			isHave = true;
			szXB = i;
			break;
		}
	}
	if(isHave == true){
		//删除数组元素
		idsArray.splice(szXB,1);
	}else{
		//添加数组元素
		idsArray.push(ids);
	}			
	/* 将存储后的值以逗号的形式拼接成字符串 */
	size = idsArray.length;			
	for(var j=0;j < size;j++){
		if(str == '')
			str += idsArray[j];
		else
			str += ',' + idsArray[j];
	}			
	/* 重新赋值 */
	if(str != ''){
		document.getElementById("CX_IDS").value = str;
	}
}

     (3)后台代码处理

    在后台的form-action响应函数中,主要处理有:

        获取前端页面隐藏域的值;

        解析值于数组中,复制一份于List 数据集;

        将 List 数据集和隐藏域的值传给前端;

    由于后台的代码不尽相同,这里就不全贴出了:

List cxList = new ArrayList<>();
/*获取值*/
cxIDS
/*解析值*/
String[] CX_IDS = null;
if((cxIDS != null) && (!("".equals(cxIDS)))){
  CX_IDS = cxIDS.split(",");
  for(int i=0;i<CX_IDS.length;i++)
    cxList.add(CX_IDS[i]);
}
/*传值*/
mv.addObject("cxList",cxList);
mv.addObject("CHECK_IDS", cxIDS);

        以上是我的处理逻辑,当然针对不同的框架,应作出不同的调整。

© 著作权归作者所有

海岸线的曙光

海岸线的曙光

粉丝 47
博文 54
码字总数 59221
作品 0
朝阳
程序员
私信 提问
PHP分页+Elasticsearch查询

分页,本质上就是根据给定的页码和偏移量从服务器端请求数据。原理很easy,实践起来却有诸多问题,这里总结一下目前使用的分页demo,通过es请求数据,前端自己构建页码。 的页码显示,有4个参...

dragon_tech
03/30
26
0
lyGrid.js 正式开源,源码可加官方群获取,

更新到1.2.0V版本 lyGrid.js 正式开源,源码可加官方群获取, 详细文档请看 http://www.lanyuanoss.com/document.shtml git 地址: https://gitee.com/lanyuan/lyGrid.git lyGrid 蓝缘表格插件 ...

蓝缘Y
2018/01/12
536
0
MySQL多数据源笔记3-分库分表理论和各种中间件

一.使用中间件的好处   使用中间件对于主读写分离新增一个从数据库节点来说,可以不用修改代码,达到新增节点数据库而不影响到代码的修改。因为如果不用中间件,那么在代码中自己是先读写分...

狂小白
2018/03/17
0
0
mysql中order by和limit混用时出现的问题

sql: 问题:分页查询数据,不同页之中出现了相同的数据。 原因:这是Mysql5.7以上的优化 官方文档: 翻译:如果你将Limit rowcount与order by混用,mysql会找到排序的rowcount行后立马返回,...

shimmerkaiye
2018/08/06
30
0
大数据分页方案

软件开发中,常用要用到分页、计算总数,数据量超过千万、上亿的时候,往往 的需要超过 1s 的执行时间,甚至 3-5s,对于一个追求性能的前沿团队来说,这个不能忍啊! 为什么会慢? mysql 会对...

fzxu_05
2016/08/16
126
0

没有更多内容

加载失败,请刷新页面

加载更多

总结:单机与分布式

传统计算方案演变 1、单机并行运算 1,打开数据源 2,统计出有多少个文件。 3,为每个文件执行相同的统计命令 4,等待所有命令执行成功。 5,合并统计后结果输出或执行进一步统计 2、分布式并...

浮躁的码农
24分钟前
5
0
关于怎么解决CENTOS7没有ETH0网卡这个问题

CentOS7系统安装完毕之后,输入ifconfig命令发现没有eth0,不符合我们的习惯。而且也无法远程ssh连接。 1.进入目录/etc/sysconfig/network-scripts/ 2.将文件ifcfg-ens33重命名为ifcfg-eth0;...

无名氏的程序员
31分钟前
5
0
HTML5 Web Storage 存储介绍

Web Storage是HTML5 API提供一个新的重要的特性; 最新的Web Storage草案中提到,在web客户端可用html5 API,以Key-Value形式来进行数据持久存储; 目前主要的浏览器已经支持该功能: 常见的...

前端老手
39分钟前
4
0
安装mxnet出现的错误

我出现下面的错误:是因为我前面的安装步骤都正确,只是这一步出现错误,sudo python setup.py install 其实我看了下我默认的python是3.6,是大于3.5 ,改为sudo python3 setup.py install就...

南桥北木
41分钟前
4
0
boot-组件

一、下拉菜单 二、button组 三、弹框 四、导航 boot提了三种形式的导航:水平导航、选项卡导航、胶囊导航

wytao1995
44分钟前
5
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部