nodejs -数据分页ejs-分页控件

懒得封装, 没有思路的将就看看吧

  <!--分页-->
     <ul class="pagination pagination-centered">
            <!--处理数字显示个数-->
             <% var prevNum = 10; var nextNum=10; %>

             <%if(pager.pageCount-pager.pageCurrent > 5){%>
              <% prevNum = 5 %>
             <%} else {%>
                <%prevNum = prevNum - (pager.pageCount-pager.pageCurrent)%>
             <%}%>
             <%if(pager.pageCurrent-5 > 0){%>
              <% nextNum = 5 %>
             <%} else {%>
                 <%nextNum = nextNum - (pager.pageCurrent) %>
             <%}%> 

            <% if(pager.pageCount-pager.pageCurrent > 5 &&pager.pageCurrent-5 > 0 ){%>
                  <% prevNum=5%>
                  <% nextNum=4%>
              <%}%>
            <!--处理数字显示个数 end-->
            <li class="disabled"><a href="javascript:void(0)"> 共<%=pager.maxNum%>条</a></li>
            <li class="disabled"><a href="javascript:void(0)"> 总<%=pager.pageCount%> 页 </a></li>
            <%if(pager.maxNum==0){%>
              <li class="disabled"><a href="javascript:void(0)">首页</a></li>
            <%}else{%>
              <li><a href="<%=pager.pagePath%>current=1">首页</a></li>
            <%}%>
            <!--判断有没有前一页-->

            <%if(pager.pageCurrent==1){%>
               <li class="disabled"><a href="javascript:void(0)">上一页</a></li>
            <%}else{%>
               <%if(pager.maxNum==0){%>
                <li class="disabled"><a href="javascript:void(0)">上一页</a></li>
               <%}else{%>
                <li><a href="<%=pager.pagePath%>current=<%=parseInt(pager.pageCurrent)-1%>">上一页</a></li>
               <%}%>
            <%}%>
            <!--判断有没有前一页  end-->

              <!--循环显示页码-->
             <% for(var i = prevNum; i > 0; i--){ %>
             <%  if( parseInt(pager.pageCurrent)-i > 0 ) { %>
               <li><a href="<%=pager.pagePath%>current=<%=parseInt(pager.pageCurrent)-i%>"><%=(parseInt(pager.pageCurrent)-i)%></a></li>
             <%}}%>
             <li class="active"><a href="<%=pager.pagePath%>current=<%=pager.pageCurrent%>" ><%=pager.pageCurrent%></a></li>
             <% for(var i = 1; i <=nextNum; i++){ %>
             <%  if( parseInt(pager.pageCurrent)+i <= pager.pageCount ) { %>
               <li><a href="<%=pager.pagePath%>current=<%=parseInt(pager.pageCurrent)+i%>"><%=parseInt(pager.pageCurrent)+i%></a></li>
             <%}}%>
             <!--循环显示页码  end-->
           <!--判断有没有下一页-->
           <%if(pager.pageCurrent==pager.pageCount){%>
               <li class="disabled"><a href="javascript:void(0)">下一页</a></li>
            <%}else{%>
             <%if(pager.maxNum==0){%>
                <li class="disabled"><a href="javascript:void(0)">下一页</a></li>
               <%}else{%>
                 <li><a  href="<%=pager.pagePath%>current=<%=parseInt(pager.pageCurrent)+1%>">下一页</a></li>
               <%}%> 

            <%}%>
           <!--判断有没有下一页  end-->
            <%if(pager.maxNum==0){%>
              <li class="disabled"><a href="javascript:void(0)">尾页</a></li>
            <%}else{%>
                 <li><a href="<%=pager.pagePath%>current=<%=pager.pageCount%>">尾页</a></li>
            <%}%>
          </ul>
    <!--分页 end-->

<!--
路由使用:

  //pageCurrent  当前页数
  var pager = {
  };
  pager.pagePath = ‘lostfound-manager?‘;
  pager.pageSize = 10;
  pager.pageCurrent = 1;
  if (current == undefined) {
    pager.pageCurrent = 1;
  } else {
    pager.pageCurrent = current;
  }

 pager.maxNum = retData.length;
 pager.pageCount = parseInt(Math.ceil(parseFloat(pager.maxNum) / parseFloat(pager.pageSize)));  //计算总页数

  返回 req.pager = pager;
 -->
时间: 2025-01-05 05:16:34

nodejs -数据分页ejs-分页控件的相关文章

Atitit. BigConfirmTips 控件 大数据量提示确认控件的原理and总结O9

Atitit. BigConfirmTips 控件 大数据量提示确认控件的原理and总结O9 1. 主要的涉及的技术 1 2. 主要的流程 1 3. 调用法new confirmO9t(); 1 4. 设置确认在后的回溯事件 c.backHandle="window.opener.confirmSubmitBackeventHandle"; 2 5. 设置详细表格显示模板  c.tmplt="/publish/lookOverdetail_templt.jsp";

将Excel中的数据读入到GridView控件中

使用Excel文件作为数据源,其实现的代码为: Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" + Server.MapPath("excel.xls") + "; Extended Properties=Excel 8.0; 实例代码: private DataSet CreateDataSource()    {        string strCon;        strCon = "Provider

饼图数据可视展示报表控件MindFusion.Reporting for Silverlight

MindFusion.Reporting for Silverlight是一款SilverLight平台下的报表控件,帮助软件开发人员以简单且直观的方法构建复杂的报表,并且软件开发人员可以根据需求自定义报表,控件完全由C#编写并且分发完全免费. 具体功能: 支持所有.NET数据源 单个报表里可以使用多个数据源 支持绑定和非绑定两种数据模式 利用饼图进行数据可视展示 支持插入图像 报表宿主任何SilverLight控件 多页报表 支持显示报表在SilverLight Canvas 在完整功能的报表

[iOS基础控件 - 6.6.1] 展示团购数据代码[iOS基础控件 - 6.7] 微博展示 使用代码自定义TableCell(动态尺寸)

A.需求 1.类似于微博内容的展示 2.头像 3.名字 4.会员标志 5.内容 6.分割线 7.配图(可选,可有可无) B.思路.步骤 1.Controller:UITableViewController 改变控制器继承自UITableViewController,storyboard中也同时使用新的TableViewController,其TableView作为启动入口. 2.View:代码自定义cell 使用代码组装每个cell,动态改变控件的位置.尺寸 cell含有一个WeiboFrame

在Bootstrap开发框架中使用dataTable直接录入表格行数据(2)--- 控件数据源绑定

在前面随笔<在Bootstrap开发框架中使用dataTable直接录入表格行数据>中介绍了在Web页面中使用Jquery DataTable插件进行对数据直接录入操作,这种处理能够给用户提供较好的数据录入体验,本篇继续上篇的内容,继续介绍这个直接录入的处理操作,主要涉及到控件的初始化和数据源的绑定等操作内容,随着对这个处理的深入了解,我发现可以控制的内容也更加丰富,能够更好的实现各种所需的效果. 1.直接录入数据的界面分析 在之前介绍的数据直接录入处理的时候,界面效果如下所示. 上面的界面处

将数据表中的数据添加到ComboBox控件中

实现效果: 知识运用: ComboBox控件的DataSource 属性 //获取或设置ComboBox的数据源 public Object DataResouce{get;set;} //属性值:任何实现了IList接口的对象 如DataSet 泛型集合或数组 DisplayMember属性 //获取或设置要为此列表控件显示的属性 public string DisplayMember{get;set;}  ValueMember属性 //用于列表控件中数据项的实际值 默认为string.Em

用数据说话!图表控件LightningChart .NET助力开发人员打造全新数据分析体验

在我们开发项目时,经常需要将一些数据统计,并以图表形式显示出来.图形图表的可视化数据表现形式已成为一种趋势.当然,现如今的图表控件种类繁多,各有各的优势.身为开发人员的你是否也难以抉择?如果您的行业属于科学和研究,工程,经济和金融,贸易,医药,能源,太空和防御等对数据要求比较苛刻的行业:如果您希望快速处理庞大数据:如果您追求卓越的性能,那么这款控件-LightningChart .NET,将会是你不二的选择. LightningChart .NET是用于WPF和Windows窗体的最快的2D和3

后台数据赋给前台控件

是首先在后台文件里定义一个变量 public static string str= ""; protected void Page_Load(object sender, EventArgs e) { str="ASP" } 记住一定要定义在Page_Load事件外面,与Page_Load事件同级 然后在前台以TextBox控件为例 <input type="text" value="<%=str%> /> 至此

SSRS报表服务随笔(rdl报表服务)-报表数据:使用第三方控件生成条形码

因为工作需要,需要将订单号显示成条形码,比如数据库存储的20190106A,我需要把这个转换为Code128来显示出来 在国内我没有找到这方面的教程,最后还是一个人自己摸索出来的 在这里我是使用的是Barcode Professional for Reporting Services,具体那个版本呢,自己估量的办就好,反正我是没找到破解版 首先,肯定是安装这个控件啦,应为没有正版的,所以就只能30天试用 安装好这个控件后并且配置完成后(安装和配置一路next,没什么可讲的),打开安装目录,里面有