PageInfo 前台分页js,带分页栏
在使用mybatis3,并且使用分页,PageHelper 接口,分页还是很好使用的。使用pageInfo的后台分页接口。
- /**
- *
- * @param switchPage方法,切换页码方法
- *
- * function switchPage(pageNum){
- $("input[name='pageNum']").val(pageNum);
- $("#blgTable tr:gt(0)").remove();
- getLuoJiaoDianResult();
- }
- *
- * @getResult() 获取结果集方法
- *
- * function getLuoJiaoDianResult(){
- var dat=serializeObject("#dizhi");
- $.post("${BASE_PATH}dz/list",dat,function(data){
- $("#blgTable tr:gt(0)").remove();
- var option="";
- if(data.list.length==0){
- option+="<tr><td colspan='6'> 没有符合条件的查询结果!</td></tr>"
- }else{
- $(data.list).each(function(i){
- if(this.fenquzhihuibu==null){
- this.fenquzhihuibu="";
- }
- if(this.paichusuo==null){
- this.paichusuo="";
- }
- if(i%2==0){
- option+="<tr style='background:rgb(243, 248, 251)'>";
- }else{
- option+="<tr style='background:rgb(226, 237, 247)'>";
- }
- option+="<td>"+this.xingming+"</td><td>"+
- this.shenfenzheng+"</td><td>"+this.dizhi+"</td><td> "+
- this.fenquzhihuibu+" </td><td>"+this.paichusuo+"</td><td><a onclick=selectPersonInfo('"+this.personid+"') >详情</a></td></tr>";
- });
- }
- pageInfoBar(data,"pagebar");
- $("#blgTable").append(option);
- },"json");
- }
- *
- *
- *
- * 获取分页导航条
- * @param pageInfo
- * @param barDivId
- */
- function pageInfoBar(pageInfo, barDivId) {
- var barDiv = $("#" + barDivId);
- var context = "<span>当前页:" + pageInfo.pageNum + " 总页数:"
- + pageInfo.pages + " 总记录数:"+pageInfo.total+"</span>";
- context += "<div class='query-content-page-btn'><ul>";
- if (pageInfo.pageNum > 1) {
- context += "<li class='prev-next' onclick=switchPage('"
- + pageInfo.prePage + "')>上一页</li>";
- }
- for (var i = 0; i < pageInfo.navigatepageNums.length; i++) {
- if (pageInfo.pageNum == pageInfo.navigatepageNums[i]) {
- context += "<li class='query-content-page-cur' onclick=switchPage('"
- + pageInfo.navigatepageNums[i]
- + "')>"
- + pageInfo.navigatepageNums[i] + "</li>"
- } else {
- context += "<li onclick=switchPage('"
- + pageInfo.navigatepageNums[i] + "')>"
- + pageInfo.navigatepageNums[i] + "</li>"
- }
- }
- if (pageInfo.pageNum < pageInfo.pages) {
- context += "<li class='bus-border-right prev-next' onclick=switchPage('"
- + pageInfo.nextPage + "')>下一页</li>";
- }
- context += "</ul></div>";
- barDiv.html(context);
- }
PageInfo 前台分页js,带分页栏的更多相关文章
- js得到分页栏
自己写的,感觉返回html代码蠢蠢的,但是新手并不知道怎么写更好的,感觉这样子也蛮简单.记录下来,以后来越改越好. //获得分页栏.注意indexSize为奇数,这样也比较好看 //totalNum: ...
- JS-网页中分页栏
原理 三部分 我给分页栏分成了3部分 上一页:调用prePage()函数 下一页:调用nextPage()函数 带有数字标识的部,调用skipPage()函数 prePage函数 function p ...
- js 带省略号的分页源码及应用实例
一.js:pagination.js /*--说明分页div id为:changpage*/var eachPageDataNum = 10;//每页显示记录数var nowPage = 1;//当前 ...
- 单篇文章JS模拟分页
废话部分 前两天做了一个前台分页插件,支持ajax读取数据绑定前台 和 url带页码参数跳转两种方式.于是稍加改动,做了一个单篇文章js模拟分页的代码,为什么说是模拟分页呢?因为在服务器响应HTML请 ...
- EasyUI的DataGrid 分页栏英文改中文解决方案
(一)分页栏英文改中文解决方案 这个问题其实很简单,就是引入文件jquery-easyui-1.3/locale/easyui-lang-zh_CN.js . 注意这个文件要放在本页js的后面,放在最 ...
- Mvc 分页栏扩展方法
using System; using System.Collections.Generic; using System.Reflection; using System.Text; using Sy ...
- js前端分页之jQuery
锋利的js前端分页之jQuery 大家在作分页时,多数是在后台返回一个导航条的html字符串,其实在前端用js也很好实现. 调用pager方法,输入参数,会返回一个导航条的html字符串.方法的内部比 ...
- “MVC+Nhibernate+Jquery-EasyUI” 信息发布系统 第六篇(图片新闻的添加以及带分页的静态页的生成)
“MVC+Nhibernate+Jquery-EasyUI” 信息发布系统 第六篇(图片新闻的添加以及带分页的静态页的生成) 一.这篇文章主要是要实现:图片新闻的添加,无刷新图片的上传,以及添加新闻静 ...
- Spring统一返回Json工具类,带分页信息
前言: 项目做前后端分离时,我们会经常提供Json数据给前端,如果有一个统一的Json格式返回工具类,那么将大大提高开发效率和减低沟通成本. 此Json响应工具类,支持带分页信息,支持泛型,支持Htt ...
随机推荐
- 月饼问题PAT B1020(贪心算法)
月饼是中国人在中秋佳节时吃的一种传统食品,不同地区有许多不同风味的月饼.现给定所有种类月饼的库存量.总售价.以及市场的最大需求量,请你计算可以获得的最大收益是多少. 注意:销售时允许取出一部分库存.样 ...
- Linux系统下重启Tomcat
在Linux系统下,重启Tomcat使用命令操作的! 首先,进入Tomcat下的bin目录 cd /usr/local/tomcat/bin 使用Tomcat关闭命令 ./shutdown.sh 查看 ...
- Java项目生成可执行jar包、exe文件以及在Windows下的安装文件
1.如何通过eclipse将Java项目生成可执行jar包 首先把在eclipse下的java项目导出jar file 下一步 下一步 下一步 最后点击完成,便生成了可执行的jar文件.可以在刚刚选择 ...
- 配置go语言编辑环境 - goland
快捷键: 移动行 Alt + Shift + up/down 行内(选中)移动(到头尾/删除) Ctrl(Shift) + left/rignt(Home/End/Backspace) 插入新行 Sh ...
- Windows删除服务方法
- c++中“箭头(->)”和“点号(.)”操作符的区别
首先介绍一下C++中的结构.对于一个结构: struct MyStruct { int member_a; }; 如果有个变量MyStruct s,那么使用其中的成员元素时可以用: s.member_ ...
- 5J - 复习时间
为了能过个好年,xhd开始复习了,于是每天晚上背着书往教室跑.xhd复习有个习惯,在复习完一门课后,他总是挑一门更简单的课进行复习,而他复习这门课的效率为两门课的难度差的平方,而复习第一门课的效率为1 ...
- L1-027 出租(20)(STL-map代码)
L1-027 出租(20 分) 下面是新浪微博上曾经很火的一张图: 一时间网上一片求救声,急问这个怎么破.其实这段代码很简单,index数组就是arr数组的下标,index[0]=2 对应 arr[2 ...
- andorid 列表视图 ListView 之BaseAdapter
.xml <?xml version="1.0" encoding="utf-8"?> <ListView xmlns:android=&qu ...
- kvm介绍 转载
KVM 介绍(1):简介及安装 学习 KVM 的系列文章: (1)介绍和安装 (2)CPU 和 内存虚拟化 (3)I/O QEMU 全虚拟化和准虚拟化(Para-virtulizaiton) (4)I ...