适用于WebForm Mvc的Pager分页组件C#实现

本文为大家分享了自己写的一个Pager分页组件,WebForm,Mvc都适用,具体内容如下

分页控件其实就是根据链接在页面间传递参数,因为我看到MVC中你可以看到这样传递参数的new {para=val}这种方式传递参数,于是我想到用可以模仿这种传递参数的方式,那就用dynamic来作为参数对象传递。

下面是附上我写的具体的实现的代码

数据处理代码:

1.定义IPagedList接口

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

namespace Infrastruction.Pager
{
  public interface IPagedList
  {
    int pageIndex { get; set; }
    int pageSize { get; set; }
    int totalItemCount { get; set; }
    int totalPageCount { get; }
  }
}

2.实现IPagedList接口

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace Infrastruction.Pager
{
  public class PagedList<T> : List<T>, IPagedList
  {
    public int pageIndex
    {
      get;
      set;
    }

    public int pageSize
    {
      get;
      set;
    }

    public int totalItemCount
    {
      get;
      set;
    }

    public int totalPageCount
    {
      get
      {
        return totalItemCount % pageSize == 0 ? (totalItemCount / pageSize) : (totalItemCount / pageSize + 1);
      }
    }

    public PagedList(IEnumerable<T> sources, int pageIndex, int pageSize)
    {
      if (sources != null && sources.Any())
      {
        this.AddRange(sources.Skip(pageSize * (pageIndex - 1)).Take(pageSize).ToList());
      }
      this.pageIndex = pageIndex;
      this.pageSize = pageSize;
      this.totalItemCount = sources.Count();
    }
  }
}

分页标签处理代码:

3.PagerHelper

using Infrastruction.Pager;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Reflection;
using System.Text;
using System.Web;
using System.Web.UI;

namespace System.Web.UI
{
  public static class PagerHelper
  {

    public static string Pager(string url, IPagedList pagedList)
    {
      StringBuilder builder = new StringBuilder();
      if (pagedList != null)
      {
        builder.Append("<script type='text/javascript'>");
        builder.Append("window.onload = function () {");
        builder.Append(" var elements = document.getElementById('pager').childNodes;");
        builder.Append(" for (var i = 0; i < elements.length; i++) {");
        builder.Append("var txt = elements[i].innerText || elements[i].textContent;");
        builder.Append(" if (elements[i].nodeType =='1' && txt == '" + pagedList.pageIndex + "') {");
        builder.Append("elements[i].style.textDecoration = 'underline';break; } } }");
        builder.Append("</script>");
        builder.Append("<div id='pager'>");

        builder.Append("<span class='p'>");
        builder.AppendFormat("共 {0} 条数据  页次:{1}/{2}", pagedList.totalItemCount, pagedList.pageIndex, pagedList.totalPageCount, "上一页");
        builder.Append("</span>");
        builder.Append(" ");
        builder.Append(" ");
        builder.Append(" ");
        builder.Append(" ");
        if (pagedList.pageIndex > 1 && pagedList.pageIndex <= pagedList.totalPageCount)
        {
          builder.Append("<span class='p'>");
          builder.AppendFormat("<a href='{0}?pageIndex={1}'>{2}</a>", url, 1, "首页");
          builder.Append("</span>");
          builder.Append(" ");
          builder.Append("<span class='p'>");
          builder.AppendFormat("<a href='{0}?pageIndex={1}'>{2}</a>", url, pagedList.pageIndex - 1, "上一页");
          builder.Append("</span>");
          builder.Append(" ");
        }
        if (pagedList.totalPageCount > 1 && pagedList.totalPageCount <= 10)
        {
          for (int i = 1; i <= pagedList.totalPageCount; i++)
          {
            builder.Append("<span class='p'>");
            builder.AppendFormat("<a href='{0}?pageIndex={1}'>{2}</a>", url, i, i);
            builder.Append("</span>");
            builder.Append(" ");
          }
        }
        else if (pagedList.totalPageCount > 10)
        {
          if (pagedList.pageIndex < 11)
          {
            for (int i = 1; i <= 10; i++)
            {
              builder.Append("<span class='p'>");
              builder.AppendFormat("<a href='{0}?pageIndex={1}'>{2}</a>", url, i, i);
              builder.Append("</span>");
              builder.Append(" ");
            }
            builder.Append("<span class='p'>");
            builder.AppendFormat("<a href='{0}?pageIndex={1}'>{2}</a>", url, 11, "...");
            builder.Append("</span>");
            builder.Append(" ");
          }
          else
          {
            builder.Append("<span class='p'>");
            builder.AppendFormat("<a href='{0}?pageIndex={1}'>{2}</a>", url, (pagedList.pageIndex - 6), "...");
            builder.Append("</span>");
            builder.Append(" ");
            if (pagedList.pageIndex >= 11 && pagedList.totalPageCount <= pagedList.pageIndex + 5)
            {
              for (int i = pagedList.pageIndex - 5; i <= pagedList.totalPageCount; i++)
              {
                builder.Append("<span class='p'>");
                builder.AppendFormat("<a href='{0}?pageIndex={1}'>{2}</a>", url, i, i);
                builder.Append("</span>");
                builder.Append(" ");
              }
            }
            else
            {
              for (int i = pagedList.pageIndex - 5; i <= pagedList.pageIndex + 5; i++)
              {
                builder.Append("<span class='p'>");
                builder.AppendFormat("<a href='{0}?pageIndex={1}'>{2}</a>", url, i, i);
                builder.Append("</span>");
                builder.Append(" ");
              }
              builder.Append("<span class='p'>");
              builder.AppendFormat("<a href='{0}?pageIndex={1}'>{2}</a>", url, (pagedList.pageIndex + 6), "...");
              builder.Append("</span>");
              builder.Append(" ");
            }
          }

        }
        if (pagedList.pageIndex >= 1 && pagedList.pageIndex < pagedList.totalPageCount)
        {
          builder.Append("<span class='p'>");
          builder.AppendFormat("<a href='{0}?pageIndex={1}'>{2}</a>", url, pagedList.pageIndex + 1, "下一页");
          builder.Append("</span>");
          builder.Append(" ");
          builder.Append("<span class='p'>");
          builder.AppendFormat("<a href='{0}?pageIndex={1}'>{2}</a>", url, pagedList.totalPageCount, "尾页");
          builder.Append("</span>");
          builder.Append(" ");
        }
        builder.Append("</div>");
      }
      return builder.ToString();
    }

    public static string Pager(string url, IPagedList pagedList, dynamic objAttr)
    {
      StringBuilder builder = new StringBuilder();
      if (pagedList != null)
      {
        builder.Append("<script type='text/javascript'>");
        builder.Append("window.onload = function () {");
        builder.Append(" var elements = document.getElementById('pager').childNodes;");
        builder.Append(" for (var i = 0; i < elements.length; i++) {");
        builder.Append("var txt = elements[i].innerText || elements[i].textContent;");
        builder.Append(" if (elements[i].nodeType =='1' && txt == '" + pagedList.pageIndex + "') {");
        builder.Append("elements[i].style.textDecoration = 'underline';break; } } }");
        builder.Append("</script>");
        string paras = "";
        PropertyInfo[] infos = objAttr.GetType().GetProperties();
        if (infos != null && infos.Any())
        {
          foreach (var item in infos)
          {
            paras += string.Format("{0}={1}", item.Name, item.GetValue(objAttr, null));
            paras += "&";
          }
        }
        paras = paras + "pageIndex=";
        builder.Append("<div id='pager'>");

        builder.Append("<span class='p'>");
        builder.AppendFormat("共 {0} 条数据  页次:{1}/{2}", pagedList.totalItemCount, pagedList.pageIndex, pagedList.totalPageCount, "上一页");
        builder.Append("</span>");
        builder.Append(" ");
        builder.Append(" ");
        builder.Append(" ");
        builder.Append(" ");

        if (pagedList.pageIndex > 1 && pagedList.pageIndex <= pagedList.totalPageCount)
        {
          builder.Append("<span class='p'>");
          builder.AppendFormat("<a href='{0}?{1}'>{2}</a>", url, paras + 1, "首页");
          builder.Append("</span>");
          builder.Append(" ");
          builder.Append("<span class='p'>");
          builder.AppendFormat("<a href='{0}?{1}'>{2}</a>", url, paras + (pagedList.pageIndex - 1), "上一页");
          builder.Append("</span>");
          builder.Append(" ");
        }
        if (pagedList.totalPageCount > 1 && pagedList.totalPageCount <= 10)
        {
          for (int i = 1; i <= pagedList.totalPageCount; i++)
          {
            builder.Append("<span class='p'>");
            builder.AppendFormat("<a href='{0}?{1}'>{2}</a>", url, paras + i, i);
            builder.Append("</span>");
            builder.Append(" ");
          }
        }
        else if (pagedList.totalPageCount > 10)
        {
          if (pagedList.pageIndex < 11)
          {
            for (int i = 1; i <= 10; i++)
            {
              builder.Append("<span class='p'>");
              builder.AppendFormat("<a href='{0}?{1}'>{2}</a>", url, paras + i, i);
              builder.Append("</span>");
              builder.Append(" ");
            }
            builder.Append("<span class='p'>");
            builder.AppendFormat("<a href='{0}?{1}'>{2}</a>", url, paras + 11, "...");
            builder.Append("</span>");
            builder.Append(" ");
          }
          else
          {
            builder.Append("<span class='p'>");
            builder.AppendFormat("<a href='{0}?{1}'>{2}</a>", url, paras + (pagedList.pageIndex - 6), "...");
            builder.Append("</span>");
            builder.Append(" ");
            if (pagedList.pageIndex >= 11 && pagedList.totalPageCount <= pagedList.pageIndex + 5)
            {
              for (int i = pagedList.pageIndex - 5; i <= pagedList.totalPageCount; i++)
              {
                builder.Append("<span class='p'>");
                builder.AppendFormat("<a href='{0}?{1}'>{2}</a>", url, paras + i, i);
                builder.Append("</span>");
                builder.Append(" ");
              }
            }
            else
            {
              for (int i = pagedList.pageIndex - 5; i <= pagedList.pageIndex + 5; i++)
              {
                builder.Append("<span class='p'>");
                builder.AppendFormat("<a href='{0}?{1}'>{2}</a>", url, paras + i, i);
                builder.Append("</span>");
                builder.Append(" ");
              }
              builder.Append("<span class='p'>");
              builder.AppendFormat("<a href='{0}?{1}'>{2}</a>", url, paras + (pagedList.pageIndex + 6), "...");
              builder.Append("</span>");
              builder.Append(" ");
            }

          }

        }
        if (pagedList.pageIndex >= 1 && pagedList.pageIndex < pagedList.totalPageCount)
        {
          builder.Append("<span class='p'>");
          builder.AppendFormat("<a href='{0}?{1}'>{2}</a>", url, paras + (pagedList.pageIndex + 1), "下一页");
          builder.Append("</span>");
          builder.Append(" ");
          builder.Append("<span class='p'>");
          builder.AppendFormat("<a href='{0}?{1}'>{2}</a>", url, paras + pagedList.totalPageCount, "尾页");
          builder.Append("</span>");
          builder.Append(" ");
        }
        builder.Append("</div>");
      }
      return builder.ToString();
    }

  }
}

4.  PagerLinqExtension( 基于linq的扩展)

using System;
using System.Collections.Generic;
using System.Linq;
using System.Linq.Expressions;
using System.Web;

namespace Infrastruction.Pager
{
  public static class PagerLinqExtension
  {

    public static PagedList<T> ToPagedList<T>(this IQueryable<T> source, int pageIndex, int pageSize)
    {
      return new PagedList<T>(source, pageIndex, pageSize);
    }

  }
}

调用方法

1.Webform调用:   <%=PagerHelper.Pager("Products.aspx", pageList, new { cid=Cid})%>   或者用literal在后台绑定也行

2.Mvc调用:

需要扩展一下方法

namespace System.Web.Mvc.Html
{
  public static class HtmlExtension
  {
    public static IHtmlString Pager(this HtmlHelper helper, string url, IPagedList pagedList)
    {
      return helper.Raw(PagerHelper.Pager(url, pagedList));
    }
    public static IHtmlString Pager(this HtmlHelper helper, string url, IPagedList pagedList, dynamic objAttr)
    {
      return helper.Raw(PagerHelper.Pager(url, pagedList, objAttr));
    }
  }
}

然后页面调用@Html.Pager("Products.aspx", pageList, new { cid=Cid,......})

全部的代码都在上面,希望大家认真学习,对大家学习使用分页控件有所帮助。

(0)

相关推荐

  • C#实现分页组件的方法

    分页无论是前端和后端,基本都有广泛应用!下面通过一个小小案例完成这个分页效果: 参数含义: string urlFormat: 要传给服务器端的URL地址格式,方便在点超链接时进行相应的跳转 long totalSize:     总的数据条数. long pageSize:    每页多少条数据 long currentPage: 当前的页数 后面通过具体的一个案例来用这个分页方法: 一.分页方法: /// <summary> /// 生成页码的html /// </summary&g

  • C#拼接SQL语句 用ROW_NUMBER实现的高效分页排序

    如果项目中要用到数据库,铁定要用到分页排序.之前在做数据库查询优化的时候,通宵写了以下代码,来拼接分页排序的SQL语句 复制代码 代码如下: /// <summary> /// 单表(视图)获取分页SQL语句 /// </summary> /// <param name="tableName">表名或视图名</param> /// <param name="key">唯一键</param> //

  • C# DataTable分页处理实例代码

    有时候我们从数据库获取的数据量太大,而我们不需要一次性显示那么多的时候,我们就要对数据进行分页处理了,让每页显示不同的数据. public DataTable GetPagedTable(DataTable dt, int PageIndex, int PageSize)//PageIndex表示第几页,PageSize表示每页的记录数 { if (PageIndex == 0) return dt;//0页代表每页数据,直接返回 DataTable newdt = dt.Copy(); new

  • c#分页读取GB文本文件实例

    本文实例讲述了c#分页读取GB文本文件的方法.分享给大家供大家参考.具体如下: 一.应用场景: ① .我在做BI开发测试的时候,有可能面对source文件数GB的情况,如果使用一般的文本编辑器,则会卡死,或要等很久才能显示出来. ② .有时候,我们使用ascii(01)或ascii(02)作为行或列的分隔符,这样的临时文件用于导数据到DB,如果文件导入过程中有错误,需要查看文件 的时候,普通的编辑器不支持换行,则会很恐怖. 为解决这两个需求,我使用c#完成了一个简单的winform的应用程序.

  • 基于jquery的分页控件(C#)

    JS代码: Code: 复制代码 代码如下: var _MaxPageSize = 0; var _PageSize = 5; var _IsUpDown = false; function InitPage(funName, currentPageSize, maxPageSize, pageSize, isUpDown) { _FunName = funName; _CurrentPageSize = currentPageSize; _MaxPageSize = maxPageSize;

  • C#中常用的分页存储过程小结

    表中主键必须为标识列,[ID] int IDENTITY (1,1)//每次自增一 1.分页方案一:(利用Not In和SELECT TOP分页) 语句形式: 复制代码 代码如下: SELECT TOP 10 * FROM TestTable WHERE (ID NOT IN (SELECT TOP 20 id FROM TestTable ORDER BY id)) ORDER BY ID SELECT TOP 页大小 * FROM TestTable WHERE (ID NOT IN (SE

  • C#构建分页应用的方法分析

    本文实例讲述了C#构建分页应用的方法.分享给大家供大家参考,具体如下: 1.SQL语句 WITH [temptableforStockIC] AS ( SELECT *,ROW_NUMBER() OVER (ORDER BY CreateTime DESC) AS RowNumber FROM [StockIC] WHERE 1=1 AND Model = 'FTY765OP' ) SELECT * FROM [temptableforStockIC] WHERE RowNumber BETWE

  • c#分页显示服务器上指定目录下的所有图片示例

    c#分页显示服务器上指定目录下的所有图片 复制代码 代码如下: <%@ Page Language="C#" EnableViewState="false" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

  • C#基于数据库存储过程的AJAX分页实例

    本文实例讲述了C#基于数据库存储过程的AJAX分页实现方法.分享给大家供大家参考.具体如下: 首先我们在数据库(SQL Server)中声明定义存储过程 复制代码 代码如下: use sales    --指定数据库    if(exists(select * from sys.objects where name='proc_location_Paging')) --如果这个proc_location_paging存储过程存在则删除  drop proc proc_location_Pagin

  • 适用于WebForm Mvc的Pager分页组件C#实现

    本文为大家分享了自己写的一个Pager分页组件,WebForm,Mvc都适用,具体内容如下 分页控件其实就是根据链接在页面间传递参数,因为我看到MVC中你可以看到这样传递参数的new {para=val}这种方式传递参数,于是我想到用可以模仿这种传递参数的方式,那就用dynamic来作为参数对象传递. 下面是附上我写的具体的实现的代码 数据处理代码: 1.定义IPagedList接口 using System; using System.Collections.Generic; using Sy

  • asp.net mvc自定义pager封装与优化

    之前做了一个通用的分页组件,但是有些不足,从翻页事件和分页样式都融合在后台代码中,到翻页事件可以自定义,再到翻页和样式都和代码分离, 自定义分页 pager 越来越容易扩展了. HtmlHelper Pager扩展 Pager V1.0 : /// <summary> /// Pager V1.0 /// </summary> /// <param name="helper">HtmlHelper</param> /// <para

  • VUE实现一个分页组件的示例

    分页是WEB开发中很常用的功能,尤其是在各种前后端分离的今天,后端API返回数据,前端根据数据的count以及当前页码pageIndex来计算分页页码并渲染到页面上已经是一个很普通很常见的功能了.从最开始的jquery时代到现在的各种各样的前端框架时代,分页功能都是必不可少的. 分页大多数(基本上)情况下都是对异步数据列表的处理,这里首先需要明白一下分页的流程. 在已知每页显示数据量pageSize以及当前页码pageIndex的情况下: 请求API,返回第一屏数据(pageSize内)以及所有

  • 分享一个自己写的简单的javascript分页组件

    自己写的一个简单的分页组件,主要功能还有实现都在JS中,html页面中只用增加一个放置生成分页的DIV,并给定容器的id. html结构如下: 复制代码 代码如下: <ul class="pagination" id="pageDIV"> </ul> class="pagination" 给定了分页的样式, id="pageDIV"用于放置JS生成的分页 CSS结构如下: 复制代码 代码如下: .pag

  • vue 基于element-ui 分页组件封装的实例代码

    具体代码如下所示: <template> <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :page-sizes="[10, 20, 30, 40]" :page-size="pageSize" layout="total, sizes, prev, pager, next, j

  • Vue开发之封装分页组件与使用示例

    本文实例讲述了Vue开发之封装分页组件与使用.分享给大家供大家参考,具体如下: 使用elementui中的el-pagination来封装分页组件 pagination.vue: <template> <div class="pagination"> <el-pagination small class="text-center" @size-change="handleSizeChange" @current-ch

  • 详解vue修改elementUI的分页组件视图没更新问题

    今天遇到一个小问题平时没留意,el-pagination这个分页组件有一个属性是current-page当前页. 今天想在methods里面手动修改他绑定的变量从而达到修改页码的效果,结果发现分页组件视图并没有渲染,还是停留在原本的页码处. 然后想了想,想起了.sync这个语法糖,让数据进行双向绑定. 直接上修改的代码看看 <el-pagination :current-page.sync="currentPage" :page-sizes="[10, 30, 50]&

  • Vue中ElementUI分页组件Pagination的使用方法

    Vue中ElementUI分页组件Pagination的使用,供大家参考,具体内容如下 一.概要 ElementUI 提供了 el-pagination 组件,只要配置相应得参数和事件,即可实现分页. 二.实现 1.基本用法 <div class="pagination"> <el-pagination background layout="total, sizes, prev, pager, next, jumper" :current-page

  • 基于Vue.js的表格分页组件

    一.Vue.js简介 1.Vue的主要特点: (1) 简洁 (2) 轻量 (3)快速 (4) 数据驱动 (5) 模块友好 (6) 组件化 (1) 简洁 下面看一段Angular的实现双向绑定的代码 // html <body ng-app="myApp"> <div ng-controller="myCtrl"> <p>{{ note }}</p> <input type="text" ng-

  • vue分页组件table-pagebar使用实例解析

    之前一直接触都是原始的前端模型,jquery+bootstrap,冗杂的dom操作,繁琐的更新绑定.接触vue后,对前端MVVM框架有了全新的认识.本文是基于webpack+vue构建,由于之前的工作主要是基于java的服务端开发工作,对前端框架和组件的理解,不够深入,借此来记录在前端框架使用和构建中的点点滴滴. 此分页组件参照于bootstrap-datatable底部分页开发完成,相关参数增加自定义功能. 最终使用展现效果图如下,数据来源于cnodejs[https://cnodejs.or

随机推荐