分页demo 前端+后台 （union 与union all 的区别 以及分页limit,offset的应用）

 

记重点   

1.UNION去重且排序,UNION ALL不去重不排序。

2.
sql 中 limit 与 limit，offset连用的区别

① select * from table limit 2,1;                 

//含义是跳过2条取出1条数据，limit后面是从第2条开始读，读取1条信息，即读取第3条数据

② select * from table limit 2 offset 1;      

//含义是从第1条（不包括）数据开始取出2条数据，limit后面跟的是2条数据，offset后面是从第1条开始读取，即读取第2,3条

来源： http://blog.csdn.net/yplee_8/article/details/52252549
 
通过limit和offset 或只通过limit可以实现分页功能。
假设 numberperpage 表示每页要显示的条数，pagenumber表示页码，那么 返回第pagenumber页，每页条数为numberperpage的sql语句：

代码示例:
语句3：select * from studnet limit (pagenumber-1)*numberperpage,numberperpage
语句4：select * from student limit numberperpage offset (pagenumber-1)*numberperpage

例子：

前端：

<div class="div-rs">
	<div class="maplist">
		<div style="text-align:right;color:#999;" class="totalnum pr10 pt10">共 0 个</div>
			 <ul>
				<li>
											
				</li>
						
			</ul>
		</div>
	<div style="padding:15px 0;text-align:center;display: none" class="gspager">
		<div class="prev">上页</div>
				<div class="indi">
					<div class="now">1</div> /
						<div class="total">1</div>
					</div>
				    <div class="next">下页</div>
		        </div>
	</div>
</div>

效果：

                                                

js:

分页
// 查询 翻页
	$('#searchall-result').on('click', '.gspager .next,.gspager .prev', function() {
		var gspager = $(this).closest('.gspager');
		var nowobj = gspager.find('.now');
		var total = gspager.find('.total');

		var num = nowobj.text() * 1;

		if($(this).hasClass('next')) {
			nowobj.text(num + 1);
			if(nowobj.text() * 1 == total.text() * 1) {
				gspager.find('.next').hide();
				gspager.find('.prev').show();

			}
		} else {
			nowobj.text(num - 1);
			if(nowobj.text() * 1 == 0) {
				gspager.find('.prev').hide();
				gspager.find('.next').show();

			}
		}

		$('#form-searchall').trigger('submit');
	})

	/**
	 * @param pager:翻页div;allsize 总数据条数；pagesize：条数； pagenum：页码；
	 */
	var renderPage = function(pager, allsize, pagesize, pagenum) {
		pagenum = pagenum * 1;
		//翻页数字更新
		var num = Math.ceil(allsize.count * 1 / pagesize * 1);
		pager.find('.total').text(num + "");
		pager.find('.now').text(pagenum + "");

		if(pagenum == 1) {
			pager.find('.prev').hide();
		} else {
			pager.find('.prev').show();
		}
		if(pagenum == num) {
			pager.find('.next').hide();
		} else {
			pager.find('.next').show();
		}
		if(num > 1) {
			pager.show();
		} else {
			pager.hide();
		}
	}

$weixiuhistory.on('change', 'select', function() {
		var pagesize = 1,
			gspager = $weixiuhistory.find('.gspager');
		pagenum = 1; //默认查第一页
		var userid = JSON.parse(localStorage.getItem('sysuser')).userid;
		history_list(userid, PageSize_history, pagenum);
	})

	$('#weixiuhistory').on('click', '.gspager .next,.gspager .prev', function() {
		var gspager = $(this).closest('.gspager');
		var nowobj = gspager.find('.now');
		var total = gspager.find('.total');
		var num = nowobj.text() * 1;
		if($(this).hasClass('next')) {
			nowobj.text(num + 1);
			if(nowobj.text() * 1 == total.text() * 1) {
				gspager.find('.next').hide();
				gspager.find('.prev').show();
			}
		} else {
			nowobj.text(num - 1);
			if(nowobj.text() * 1 == 0) {
				gspager.find('.prev').hide();
				gspager.find('.next').show();

			}
		}
		var userid = JSON.parse(localStorage.getItem('sysuser')).userid;
		userid === "" ? 'c9ffe1ae4f5043d5bd3c091198f313bf' : userid;
		history_list(userid, PageSize_history, gspager.find('.now').text());
	})

})

java：

分页： sql最后ssql += "limit @pagesize OFFSET @pagestart";

            int pagesize = allp.getInt("pagesize");
            int pagenum = allp.getInt("pagenum") - 1;
            int pagestart = pagenum * pagesize;
            sql.params().set("pagesize", pagesize);
            sql.params().set("pagestart", pagestart);    
            sql.vars().set("likemassage", likemassage); 

postgreSql:

with tmp_obj as (select d.name,'' as adress,'point' as category,st_astext(geom) as geom from ytqpoint d where  d.name like '%科技二路%'
union all
select b.name,'','line',st_astext(geom) as geom from ytqline b  where  b.name  like '%科技二路%' 
union all
select c.name,'','area',st_astext(geom) as geom from ytqmian c where  c.name like '%科技二路%' 
union all
select a.name,a.adress,a.category,st_astext(geom) as geom from ytcypoi a  where  (a.name  like '%科技二路%' or a.category like  '%科技二路%')) 
select distinct on(name) name,adress,category,geom,st_astext(ST_Centroid(geom)) as center from tmp_obj   limit 4 OFFSET 0

上面是搜索科技二路的sql

分页功能搞定