//数据库中新建存储过程： 1 USE [SAAS0626] 2 GO 3 /****** Object: StoredProcedure [dbo].[Paging] Script Date: 2017/8/7 11:03:32 ******/ 4 SET ANSI_NULLS ON 5 GO 6 SET QUOTED_IDENTIFIER ON 7 GO 8 ALTER PROCEDURE [dbo].[Paging] 9 ( @TableName VARCHAR(1000), --表名,多表时使用 tA a inner join tB b On a.AID = b.AID 10 @Fields NVARCHAR(2000) = ‘*‘, --读取字段 11 @Condition NVARCHAR(3000) = ‘‘, --Where条件 12 @Sort NVARCHAR(200) = ‘‘, --排序字段，不能为空 13 @CurrentPage INT = 1, --开始页码 14 @PageSize INT = 10, --页大小 15 @GroupBy varchar(200), --分组语句 16 @RecordCount INT = 0 OUT 17 ) 18 AS 19 20 DECLARE @strWhere VARCHAR(2000) 21 DECLARE @strGroup VARCHAR(200) 22 DECLARE @strsql NVARCHAR(3900) 23 24 IF @Condition IS NOT NULL AND len(ltrim(rtrim(@Condition)))>0 25 BEGIN 26 SET @strWhere = ‘ WHERE ‘ + @Condition + ‘ ‘ 27 END 28 ELSE 29 BEGIN 30 SET @strWhere = ‘‘ 31 END 32 33 IF @GroupBy IS NOT NULL AND len(ltrim(rtrim(@GroupBy)))>0 34 BEGIN 35 SET @strsql = ‘SELECT @RecordCount = Count(1) FROM (SELECT 1 AS total FROM ‘ + @TableName + @strWhere + ‘ group by ‘ + @GroupBy + ‘) as t‘ 36 SET @strGroup = ‘ GROUP BY ‘ + @GroupBy + ‘ ‘ 37 END 38 ELSE 39 BEGIN 40 SET @strsql = ‘SELECT @RecordCount = Count(1) FROM ‘ + @TableName + @strWhere 41 SET @strGroup = ‘‘ 42 END 43 44 45 EXECUTE sp_executesql @strsql, N‘@RecordCount INT output‘, @RecordCount OUTPUT 46 47 IF @CurrentPage = 1 --第一页提高性能 48 BEGIN 49 SET @strsql = ‘SELECT TOP ‘ + str(@PageSize) + ‘ ‘ + @Fields + ‘ FROM ‘ + @TableName + ‘ ‘ + @strWhere + @strGroup + ‘ ORDER BY ‘+ @Sort 50 END 51 ELSE 52 BEGIN 53 DECLARE @startRecord NVARCHAR(50) 54 DECLARE @endRecord NVARCHAR(50) 55 SET @startRecord = CONVERT(NVARCHAR(50),(@CurrentPage - 1) * @PageSize + 1) 56 SET @endRecord = CONVERT(NVARCHAR(50),@CurrentPage * @PageSize) 57 SET @strsql = ‘SELECT * FROM ( 58 SELECT ‘+ @Fields + ‘,ROW_NUMBER() OVER(ORDER BY ‘ + @Sort + ‘) AS rownum FROM ‘+ @TableName + @strWhere + @strGroup + ‘) AS XX 59 WHERE rownum BETWEEN ‘+ @startRecord + ‘ AND ‘ + @endRecord 60 END 61 EXEC(@strsql) 62 RETURN
建立Model:
public class PageData<T>
{
public PageData()
{
this._Items = new List<T>();
}
private IList<T> _Items;
public IList<T> Items
{
get { return _Items; }
set { _Items = value; }
}
public int RecordCount { get; set; }
public int CurrentPage { get; set; }
public int PageCount { get; set; }
}
public class PageParams
{
/// <summary>
/// 表名（多表使用tA a inner join tB b On a.AID = b.AID）
/// </summary>
public string TableName { get; set; }
private string _Fileds = "*";
/// <summary>
/// 查询字段
/// </summary>
public string Fields
{
get { return _Fileds; }
set { _Fileds = value; }
}
private string _Sort = "ID";
/// <summary>
/// 排序字段（不能为空）
/// </summary>
public string Sort
{
get { return _Sort; }
set { _Sort = value; }
}
/// <summary>
/// 查询条件
/// </summary>
public string Condition { get; set; }
private int _CurrentPage = 1;
/// <summary>
/// 当前页数（从1开始）
/// </summary>
public int CurrentPage
{
get { return _CurrentPage; }
set { _CurrentPage = value; }
}
private int _PageSize = 10;
/// <summary>
/// 每页条数
/// </summary>
public int PageSize
{
get { return _PageSize; }
set { _PageSize = value; }
}
public string GroupBy { get; set; }
/// <summary>
/// 总记录数
/// </summary>
public int RecordCount { get; set; }
}
Js代码(jquery.pagination.min.js)：
1 (function(b){var a={init:function(d,c){return(function(){a.fillHtml(d,c);if(d[0]&&!b._data(d[0],"events")){a.bindEvent(d,c)}})()},fillHtml:function(d,c){return(function(){var l=c.current,h=c.pageCount,f=[],m,g,e=10;if(isNaN(h)){d.html("");return}if(l<=1){m=1;g=e;if(g>h){g=h}}else{if(l>=h){m=h-e+1;g=h;if(m<=0){m=1}}else{var k=Math.ceil(e/2);m=l-k;if(m<=0){m=1}g=m+e-1;if(g>h){g=h}if(m>h){g=h}}}if(l>1){f.push(‘<li><a href="javascript:;" class="first">首页</a></li>‘);f.push(‘<li><a href="javascript:;" class="prev">上一页</a></li>‘)}else{f.push(‘<li class="disabled"><span>首页</span></li>‘);f.push(‘<li class="disabled"><span>上一页</span></li>‘)}for(var j=m;j<=g;j++){if(j==l){f.push(‘<li class="disabled"><span class="current">‘+j+"</span></li>")}else{f.push(‘<li><a href="javascript:;" class="number">‘+j+"</a></li>")}}if(l<h){f.push(‘<li><a href="javascript:;" class="next">下一页</a></li>‘);f.push(‘<li><a href="javascript:;" class="last">末页</a></li>‘)}else{f.push(‘<li class="disabled"><span>下一页</span></li>‘);f.push(‘<li class="disabled"><span>末页</span></li>‘)}d.html(f.join(""))})()},bindEvent:function(d,c){return(function(){d.on("click","a",function(){var e;switch(this.className){case"first":e=1;break;case"prev":var f=parseInt(d.find("span.current").text(),10);e=f-1;break;case"number":e=parseInt(this.innerText);break;case"next":var f=parseInt(d.find("span.current").text(),10);e=f+1;break;case"last":e=c.pageCount;break}typeof c.callback=="function"&&c.callback(e)})})()}};b.fn.Paging=function(d){var e={current:1,pageCount:1,pageSize:10,callback:function(){}};var c=b.extend({},e,d);a.init(this,c)}})(jQuery);
View视图中添加分页样式:
1 <div class="text-left"> 2 <div class="pagesize"> 3 每页 4 <select id="positions-pagesize"> 5 <option value="10">10</option> 6 <option value="30">30</option> 7 <option value="50">50</option> 8 </select> 9 条 共 <span id="pCount"></span> 页 共 <span id="rCount"></span> 条记录 10 </div> 11 <ul class="pagination" id="positionPager"> 12 <li class="disabled"><span>上一页</span></li> 13 <li class="disabled"><span class="current">1</span></li> 14 <li class="disabled"><span>下一页</span></li> 15 </ul> 16 </div>需要引用JS<script src="~/JS/Common/jquery.pagination.min.js"></script>
分布视图中需要添加隐藏button存储参数:
1 <input id="pageCount" type="hidden" value="@(Model != null ? Model.PageCount : 0)" /> 2 <input id="reCount" type="hidden" value="@(Model != null? Model.RecordCount : 0)" />
Js代码：
1 //页码显示条数触发事件
2 $("#positions-pagesize").on("change", function () { LoadOrderReply(1, this.value); })
3
4 //首页刷新
5 LoadOrderReply();
6 function LoadOrderReply(page, size) {
7 size = $("#positions-pagesize").val();
8 $("#orderTb").load("/OrderReply/OrderReplyPartial", { "page": page || 1, "size": size || 10 }, function () {
9 //显示第几页，共几条记录
10 if ($("#pageCount").val() != 0) {
11 $("#pCount").text($("#pageCount").val());
12 $("#rCount").text($("#reCount").val());
13 }
14 else {
15 $("#pCount").text(0);
16 $("#rCount").text(0);
17 }
18
19 //触发鼠标停留显示
20 $("[data-toggle=‘popover‘]").popover({ html: true });
21 $("[data-toggle=‘popover‘]").popover();
22 $("#positionPager").Paging({
23 current: page,
24 pageCount: parseInt($("#pageCount").val(), 10),
25 callback: function (p) { LoadOrderReply(p, size); }
26 });
27 });
28 }
时间： 2024-08-08 15:33:17