ASP.NET MVC分页、ASP.NET MVC Ajax分页组件1.0发布!
2010-01-06 10:43:02 来源：WEB开发网核心提示： 在实际项目的开发过程中！发现很多人对asp.net MVC框架下的分页实现感到吃力或者感到繁琐！故在元旦假期为大家写了个ASP.NET MVC分页组件！该分页组件现中包含ASP.NET MVC Ajax分页以及ASP.NET MVC 普通分页!现正式发布供大家使用！ 因本人水平有限！使用之中发现不足之处还望大家指点一
在实际项目的开发过程中！发现很多人对asp.net MVC框架下的分页实现感到吃力或者感到繁琐！故在元旦假期为大家写了个ASP.NET MVC分页组件！该分页组件现中包含ASP.NET MVC Ajax分页以及ASP.NET MVC 普通分页!现正式发布供大家使用！
因本人水平有限！使用之中发现不足之处还望大家指点一二！
请需要的朋友在此处下载：DaiChaoMvcPager.dll
该分页组件相关说明：
1 namespace：DaiChaoMvcPager2 3 class:DCMvcPager4
属性：
代码
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.cncms.com/"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.cncms.com/"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：GO103 /// </summary>104 public string SubmitButtonText105 {106 set { _submitbuttontext = value; }107 get { return _submitbuttontext; }108 }109 /// <summary>110 /// 转到第几页中的按钮的样式名称 Default：button_go111 /// </summary>112 public string SubmitButton_CSSName113 {114 set { _submitbutton_cssname = value; }115 get { return _submitbutton_cssname; }116 }117 /// <summary>118 /// 转到第几页中文本框的样式名称 Default：textbox_pageIndex119 /// </summary>120 public string TextBox_CssName121 {122 set { _textbox_cssname = value; }123 get { return _textbox_cssname; }124 }125 /// <summary>126 /// 导航按钮(普通)的样式名称 Default：page_a_NumericButton127 /// </summary>128 public string NumericButton_Cssname_One129 {130 set { _numericbutton_cssname_one = value; }131 get { return _numericbutton_cssname_one; }132 }133 /// <summary>134 /// 导航按钮(当前页按钮)的样式名称 Default：page_a_current135 /// </summary>136 public string NumericButton_Cssname_Two137 {138 set { _numericbutton_cssname_two = value; }139 get { return _numericbutton_cssname_two; }140 }141 /// <summary>142 /// 导航按钮(不能访问的，如：如果已经是第一页那么上一页和首页将不能被访问)的样式名称 Default：page_a_disabled143 /// </summary>144 public string NumericButton_Cssname_Three145 {146 set { _numericbutton_cssname_three = value; }147 get { return _numericbutton_cssname_three; }148 }149 /// <summary>150 /// 跳转文本框前后的文本样式名称(如转到{0}页中的“转到第”和“页”的样式名称!) Default：page_span_text151 /// </summary>152 public string NumericButton_Cssname_Four153 {154 set { _numericbutton_cssname_four = value; }155 get { return _numericbutton_cssname_four; }156 }157 /// <summary>158 /// 分页统计信息区域外框DIV的样式表名称 Default：Statistics159 /// </summary>160 public string Statistics_Div_Cssname161 {162 set { _statistics_div_cssname = value; }163 get { return _statistics_div_cssname; }164 }165 /// <summary>166 /// 分页统计信息区域中的数字样式表名称 Default：StatisticsNumeric167 /// </summary>168 public string Statistics_Div_Numeric_Cssname169 {170 set { _statistics_div_numeric_cssname = value; }171 get { return _statistics_div_numeric_cssname; }172 }173 /// <summary>174 /// 分页页码外框DIV的样式表名称 Default：NavigationArea175 /// </summary>176 public string NavigationArea_Div_Cssname177 {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 else21 {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;}
该样式表使用了一张图片作为上一组和下一组的按钮！图片为：一张小图片就不提供下载了！麻烦朋友们直接图片另存为
因本人水平有限！使用之中发现不足之处还望大家指点一二！
请需要的朋友在此处下载：DaiChaoMvcPager.dll
该分页组件相关说明：
1 namespace：DaiChaoMvcPager2 3 class:DCMvcPager4
属性：
代码
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.cncms.com/"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.cncms.com/"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：GO103 /// </summary>104 public string SubmitButtonText105 {106 set { _submitbuttontext = value; }107 get { return _submitbuttontext; }108 }109 /// <summary>110 /// 转到第几页中的按钮的样式名称 Default：button_go111 /// </summary>112 public string SubmitButton_CSSName113 {114 set { _submitbutton_cssname = value; }115 get { return _submitbutton_cssname; }116 }117 /// <summary>118 /// 转到第几页中文本框的样式名称 Default：textbox_pageIndex119 /// </summary>120 public string TextBox_CssName121 {122 set { _textbox_cssname = value; }123 get { return _textbox_cssname; }124 }125 /// <summary>126 /// 导航按钮(普通)的样式名称 Default：page_a_NumericButton127 /// </summary>128 public string NumericButton_Cssname_One129 {130 set { _numericbutton_cssname_one = value; }131 get { return _numericbutton_cssname_one; }132 }133 /// <summary>134 /// 导航按钮(当前页按钮)的样式名称 Default：page_a_current135 /// </summary>136 public string NumericButton_Cssname_Two137 {138 set { _numericbutton_cssname_two = value; }139 get { return _numericbutton_cssname_two; }140 }141 /// <summary>142 /// 导航按钮(不能访问的，如：如果已经是第一页那么上一页和首页将不能被访问)的样式名称 Default：page_a_disabled143 /// </summary>144 public string NumericButton_Cssname_Three145 {146 set { _numericbutton_cssname_three = value; }147 get { return _numericbutton_cssname_three; }148 }149 /// <summary>150 /// 跳转文本框前后的文本样式名称(如转到{0}页中的“转到第”和“页”的样式名称!) Default：page_span_text151 /// </summary>152 public string NumericButton_Cssname_Four153 {154 set { _numericbutton_cssname_four = value; }155 get { return _numericbutton_cssname_four; }156 }157 /// <summary>158 /// 分页统计信息区域外框DIV的样式表名称 Default：Statistics159 /// </summary>160 public string Statistics_Div_Cssname161 {162 set { _statistics_div_cssname = value; }163 get { return _statistics_div_cssname; }164 }165 /// <summary>166 /// 分页统计信息区域中的数字样式表名称 Default：StatisticsNumeric167 /// </summary>168 public string Statistics_Div_Numeric_Cssname169 {170 set { _statistics_div_numeric_cssname = value; }171 get { return _statistics_div_numeric_cssname; }172 }173 /// <summary>174 /// 分页页码外框DIV的样式表名称 Default：NavigationArea175 /// </summary>176 public string NavigationArea_Div_Cssname177 {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 else21 {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;}
该样式表使用了一张图片作为上一组和下一组的按钮！图片为：一张小图片就不提供下载了！麻烦朋友们直接图片另存为
- ››asp.net页面弄成伪静态页面
- ››Asp.net 中将汉字转换成拼音的方法
- ››ASP.NET及JS中的cookie基本用法
- ››ASP.NET获取MS SQL Server安装实例
- ››asp.net实现调用百度pai 在线翻译英文转中文
- ››ASP.NET页面选项进行提示判断
- ››Asp.net定时执行程序
- ››ASP.NET中利用DataList实现图片无缝滚动
- ››ASP.NET验证控件RequiredFieldValidator
- ››ASP.NET中使用System.Net.Mail发邮件
- ››ASP.NET中获取用户控件中控件的ID
- ››ASP.NET中FileBytes写成文件并存档
中查找“ASP.NET MVC分页、ASP.NET MVC Ajax分页组件1.0发布!”更多相关内容
中查找“ASP.NET MVC分页、ASP.NET MVC Ajax分页组件1.0发布!”更多相关内容更多精彩
赞助商链接
