ASP.NET MVC分页、ASP.NET MVC Ajax分页组件1.0发布!

新年到！先给博客园的朋友们拜个年！祝大家新年快乐！

在实际项目的开发过程中！发现很多人对ASP.NET MVC框架下的分页实现感到吃力或者感到繁琐！故在元旦假期为大家写了个ASP.NET MVC分页组件！该分页组件现中包含ASP.NET MVC AJAX分页以及ASP.NET MVC 普通分页!现正式发布供大家使用！

因本人水平有限！使用之中发现不足之处还望大家指点一二！

请需要的朋友在此处下载：DaiChaoMvcPager.dll

该分页组件相关说明：

1 namespace ：DaiChaoMvcPager
2
3 class :DCMvcPager
4

属性：

代码

1 #region 分页所需要的实体参数类成员属性
2 /// <summary>
3 /// Ajax加载Url数据后填充所需要的容器Dom ID Default：requestAjaxText
4 /// </summary>
5 public string LoadDomId
6 {
7 set { _loaddomid = value; }
8 get { return _loaddomid; }
9 }
10 /// <summary>
11 /// 当为Ajax分页时：Ajax请求所要加载的Url格式(使用Jquery.Load) Eg：/News/Category-1-{0}
12 /// 当为普通分页时：普通分页所要加载的Url格式(使用GET方式) Eg：/News/Category-1-{0}
13 /// /News/Category-1-{0}中的{0}为页码占位符,替换成页码即可
14 /// Default：""
15 /// </summary>
16 public string FormatLinkUrl
17 {
18 set { _formatlinkurl = value; }
19 get { return _formatlinkurl; }
20 }
21 /// <summary>
22 /// 当前页面 Default：1
23 /// </summary>
24 public int CurrentPage
25 {
26 set { _currentpage = value; }
27 get { return _currentpage; }
28 }
29 /// <summary>
30 /// 页大小 Default：15
31 /// </summary>
32 public int PageSize
33 {
34 set { _pagesize = value; }
35 get { return _pagesize; }
36 }
37 /// <summary>
38 /// 总记录数 Default：0
39 /// </summary>
40 public int RecordCount
41 {
42 set { _recordcount = value; }
43 get { return _recordcount; }
44 }
45 /// <summary>
46 /// 每页显示数字按钮的个数 Default：10
47 /// </summary>
48 public int NumericButtonCount
49 {
50 set { _numericbuttoncount = value; }
51 get { return _numericbuttoncount; }
52 }
53 /// <summary>
54 /// 页码导航中第一页的文本 Default：首页
55 /// </summary>
56 public string FirstPageText
57 {
58 set { _firstpagetext = value; }
59 get { return _firstpagetext; }
60 }
61 /// <summary>
62 /// 页码导航中上一页的文本 Default：上一页
63 /// </summary>
64 public string PrevPageText
65 {
66 set { _prevpagetext = value; }
67 get { return _prevpagetext; }
68 }
69 /// <summary>
70 /// 页码导航中下一页的文本 Default：下一页
71 /// </summary>
72 public string NextPageText
73 {
74 set { _nextpagetext = value; }
75 get { return _nextpagetext; }
76 }
77 /// <summary>
78 /// 页码导航中末页的文本 Default：末页
79 /// </summary>
80 public string LastPageText
81 {
82 set { _lastpagetext = value; }
83 get { return _lastpagetext; }
84 }
85 /// <summary>
86 /// 页码导航中上一组(更多页)的文本 Default：<img src="http://www.cnblogs.com/Content/images/pager/MoreNumericButton.gif" border="0" align="absmiddle"/>
87 /// </summary>
88 public string MorePrevPageText
89 {
90 set { _moreprevpagetext = value; }
91 get { return _moreprevpagetext; }
92 }
93 /// <summary>
94 /// 页码导航中下一组(更多页)的文本 Default：<img src="http://www.cnblogs.com/Content/images/pager/MoreNumericButton.gif" border="0" align="absmiddle"/>
95 /// </summary>
96 public string MoreNextPageText
97 {
98 set { _morenextpagetext = value; }
99 get { return _morenextpagetext; }
100 }
101 /// <summary>
102 /// 转到第几页中的按钮的值 Default：GO
103 /// </summary>
104 public string SubmitButtonText
105 {
106 set { _submitbuttontext = value; }
107 get { return _submitbuttontext; }
108 }
109 /// <summary>
110 /// 转到第几页中的按钮的样式名称 Default：button_go
111 /// </summary>
112 public string SubmitButton_CssName
113 {
114 set { _submitbutton_cssname = value; }
115 get { return _submitbutton_cssname; }
116 }
117 /// <summary>
118 /// 转到第几页中文本框的样式名称 Default：textbox_pageIndex
119 /// </summary>
120 public string TextBox_CssName
121 {
122 set { _textbox_cssname = value; }
123 get { return _textbox_cssname; }
124 }
125 /// <summary>
126 /// 导航按钮(普通)的样式名称 Default：page_a_NumericButton
127 /// </summary>
128 public string NumericButton_Cssname_One
129 {
130 set { _numericbutton_cssname_one = value; }
131 get { return _numericbutton_cssname_one; }
132 }
133 /// <summary>
134 /// 导航按钮(当前页按钮)的样式名称 Default：page_a_current
135 /// </summary>
136 public string NumericButton_Cssname_Two
137 {
138 set { _numericbutton_cssname_two = value; }
139 get { return _numericbutton_cssname_two; }
140 }
141 /// <summary>
142 /// 导航按钮(不能访问的，如：如果已经是第一页那么上一页和首页将不能被访问)的样式名称 Default：page_a_disabled
143 /// </summary>
144 public string NumericButton_Cssname_Three
145 {
146 set { _numericbutton_cssname_three = value; }
147 get { return _numericbutton_cssname_three; }
148 }
149 /// <summary>
150 /// 跳转文本框前后的文本样式名称(如转到{0}页中的“转到第”和“页”的样式名称!) Default：page_span_text
151 /// </summary>
152 public string NumericButton_Cssname_Four
153 {
154 set { _numericbutton_cssname_four = value; }
155 get { return _numericbutton_cssname_four; }
156 }
157 /// <summary>
158 /// 分页统计信息区域外框DIV的样式表名称 Default：Statistics
159 /// </summary>
160 public string Statistics_Div_Cssname
161 {
162 set { _statistics_div_cssname = value; }
163 get { return _statistics_div_cssname; }
164 }
165 /// <summary>
166 /// 分页统计信息区域中的数字样式表名称 Default：StatisticsNumeric
167 /// </summary>
168 public string Statistics_Div_Numeric_Cssname
169 {
170 set { _statistics_div_numeric_cssname = value; }
171 get { return _statistics_div_numeric_cssname; }
172 }
173 /// <summary>
174 /// 分页页码外框DIV的样式表名称 Default：NavigationArea
175 /// </summary>
176 public string NavigationArea_Div_Cssname
177 {
178 set { _navigationarea_div_cssname = value; }
179 get { return _navigationarea_div_cssname; }
180 }
181 #endregion 分页所需要的实体参数类成员属性

提供的方法：

方法一：

代码

/// <summary>
/// MVC框架AJAX分页函数返回分页导航的HTML代码(需要Jquery支持)
/// </summary>
/// <returns> MVC框架AJAX分页函数返回分页导航的HTML代码(需要Jquery支持) </returns>
public string MvcAjaxPager()

方法二：

代码

#region MVC框架普通分页函数返回分页导航的Html代码
/// <summary>
/// MVC框架普通分页函数返回分页导航的Html代码
/// </summary>
/// <returns> MVC框架普通分页函数返回分页导航的Html代码 </returns>
public string MvcPager()

现在提供使用方法：

一：先引用该DLL到您自己的项目！

引用命名空间：

using DaiChaoMvcPager;

二：实例化该类：

DCMvcPager pager = new DCMvcPager();

三：给该组件需要的属性给赋值：

必需属性：pager.RecordCount（总记录数）和pager.FormatLinkUrl（Url格式!在上面的属性注释里面有详细的注释说明）

最后一步：执行ASP.NET MVC Ajax分页函数：pager.MvcAjaxPager()或者普通分页函数(请求方式：get)pager.MvcPager()即可！该函数有一个string类型的返回值！返回值为生成的分页页码和分页统计信息html代码！得到该返回值后怎么传递给view显示我就不多说了不在本文的范围之内！

示例(Jquery Ajax分页)代码如下：(这里使用了一个用户控件来展示数据！你可以根据自己需要换成其他的！)

代码

1 public ActionResult NewsCategory( int Article_ClassID, int ? PageIndex)
2 {
3 if (Request.IsAjaxRequest())
4 {
5 if ( ! PageIndex.HasValue)
6 {
7 PageIndex = 1 ;
8 }
9 Model_Article ModelTool = new Model_Article();
10 DCMvcPager pager = new DCMvcPager();
11 pager.RecordCount = ModelTool.CMS_Article_GetRecordCount(Article_ClassID);
12 pager.PageSize = 20 ;
13 pager.FormatLinkUrl = " /News/Category- " + Article_ClassID + " -{0} " ;
14 // 此处这个占位符：{0}即为当前页码索引需要占用的位置！你也可以根据需要自定义路由规则以此得到不同格式的Url地址!
15 pager.CurrentPage = PageIndex.Value;
16 List < Model_Web_Article > Lists = ModelTool.CMS_Article_GetList(pager.PageSize, pager.CurrentPage, Article_ClassID, pager.RecordCount);
17 ViewData[ " PagerHtml " ] = pager.MvcAjaxPager()；
18 return PartialView(Lists);
19 }
20 else
21 {
22 // 错误处理
23 }
24 }

当然上面你也可以通过强型返回数据列表和html分页代码！这里就不作描述了！

用户控件的html代码如下：

代码

1 <% @ Control Language = " C# " Inherits = " System.Web.Mvc.ViewUserControl<Model_Web_Article> " %>
2 < div id ="requestAjaxText" >
3 < div id ="list_containers" >
4 < ul >
5 <%
6 int _i = 0 ;
7 foreach (Model_Web_Article item in Model)
8 {
9 < li >
10 < h2 >< % = Html.Encode(item.Article_Title.Trim()) %> </ h2 >
11 < span > <% = item.Article_Time.ToShortDateString() %> </ span >
12 </ li >
13 }%>
14 </ ul >
15 </ div >
16 <% = ViewData[ " PagerHtml " ] %>
17 </ div >

该分页组件使用了一套默认的样式！现把样式提供出来：

代码

@charset "utf-8";
.Statistics { height : 22px ; line-height : 22px ; text-align : left ; padding-left : 11px ; font-family : Tahoma ; }
.StatisticsNumeric { margin-left : 4px ; margin-right : 4px ; font-weight : Bold ; color : #690 ; font-size : 14px ; }
.NavigationArea { border-bottom : #ddd 1px solid ; text-align : left ; padding-bottom : 10px ; margin : 5px 3px 5px 0px ; padding-left : 3px ; padding-right : 3px ; font-family : Tahoma ; display : block ; clear : left ; font-size : 14px ; padding-top : 10px ; }
.NavigationArea a { text-decoration : none ; padding-bottom : 5px ; padding-left : 8px ; padding-right : 8px ; padding-top : 5px ; }
.NavigationArea a:hover { border-bottom : #690 2px solid ; color : #690 ; text-decoration : none ; }
.page_a_NumericButton { color : #000000 ; }
.page_a_disabled { color : #999999 ; }
.page_a_current { border-bottom : #690 2px solid ; color : #690 ; font-weight : 700 ; }
.button_go { border : none ; background : #FFFFFF ; font-family : Tahoma ; border : solid 1px #CCCCCC ; }
.textbox_pageIndex { font-family : Tahoma ; width : 45px ; border : solid 1px #CCCCCC ; margin-left : 5px ; margin-right : 5px ; }
.page_span_text { font-family : Tahoma ; font-size : 13px ; }

该样式表使用了一张图片作为上一组和下一组的按钮！图片为：一张小图片就不提供下载了！麻烦朋友们直接图片另存为

吧！

OK！到了现在恭喜您的分页已经圆满成功了！先看一下效果吧：

OK！该ASP.NET MVC分页组件我已经介绍完毕！是不是很简单？有什么问题和建议以及意见请回复！由于本人要工作！所以只能不定期为大家回复了！

最后欢迎大家加入ASP.NET MVC超级群(QQ群)：40985466 如果此群已满请加二群(高级群)：49544745

共同交流进步！

转载于:https://www.cnblogs.com/200831856/archive/2010/01/04/aspdotnet-mvc-pager.html

ASP.NET MVC分页、ASP.NET MVC Ajax分页组件1.0发布!

猜你喜欢