MVC HtmlHelper扩展类(PagingHelper)实现分页功能
程序员文章站
2023-11-22 10:31:40
mvc htmlhelper扩展类paginghelper实现分页功能,供大家参考,具体内容如下
using system;
using system.coll...
mvc htmlhelper扩展类paginghelper实现分页功能,供大家参考,具体内容如下
using system; using system.collections.generic; using system.collections.specialized; using system.linq; using system.text; using system.web; using system.web.mvc; using system.web.routing; namespace htmlhelpermvc.models { /// <summary> /// 分页类如果一个页面显示两个列表只需要复制该类到项目中重命名一个就可以 /// </summary> public static class paginghelper { #region 属性property /// <summary> /// 当前页码 /// </summary> private static int? _currentpage = null; /// <summary> /// 当前页码 /// </summary> public static int currentpage { get { return _currentpage ?? 1; } set { _currentpage = value; } } /// <summary> /// 每页记录条数 /// </summary> private static int? _pagesize = null; /// <summary> /// 每页记录条数 /// </summary> public static int pagesize { get { return _pagesize ?? 15; } set { _pagesize = value; } } /// <summary> /// 是否显示上一页 /// </summary> public static bool haspreviouspage { get { return (currentpage > 1); } } /// <summary> /// 是否显示下一页 /// </summary> public static bool hasnextpage { get { return (currentpage < totalpages); } } /// <summary> /// 当前页: /// </summary> public static string currentpagedisplayname { get; set; } /// <summary> /// 每页显示: /// </summary> public static string pagesizedisplayname { get; set; } public static string firstdisplayname { get; set; } public static string predisplayname { get; set; } public static string nextdisplayname { get; set; } public static string lastdisplayname { get; set; } public static string totalcountdisplayname { get; set; } public static string totalpagesdisplayname { get; set; } /// <summary> /// 总条数 /// </summary> public static int totalcount { get; set; } public static int totalpages { get { return (int)math.ceiling(totalcount / (double)pagesize); //return (totalcount % pagesize == 0 ? totalcount / pagesize : totalcount / pagesize + 1); } } /// <summary> /// 设置分页url eg:/admin/product/index /// </summary> public static string pagingurl { get; set; } /// <summary> /// 默认page,设置分页参数名 eg:/admin/product/index?pagingparamname=1 /// </summary> public static string pagingparamname { get; set; } #endregion #region paging string /// <summary> /// mvc分页 如果用jquery分页只需要class不需要href,用以下实现: /// $(".class值").live("click", function () { /// var page = $(this).attr("pagingparamname值"); /// $("#order").html("").load("/customer/order?page="+page); /// });live自动给遍历增加事件 /// </summary> /// <param name="html"></param> /// <param name="htmlattributes">new {@class="grey",pagingparamname="page",href="/admin/product/index" rel="external nofollow" } pagingparamname默认page,匿名类添加控件属性</param> /// <returns></returns> public static mvchtmlstring paging(this system.web.mvc.htmlhelper html, object htmlattributes) { routevaluedictionary values = new routevaluedictionary(htmlattributes); #region 属性赋值 if (values["href"] != null) { pagingurl = values["href"].tostring(); } if (values["pagingparamname"] != null) { pagingparamname = values["pagingparamname"].tostring(); values.remove("pagingparamname"); } else { pagingparamname = "page"; } #endregion #region 分页最外层div/span tagbuilder builder = new tagbuilder("div");//span //创建id,注意要先设置idattributedotreplacement属性后再执行generateid方法. //builder.idattributedotreplacement = "_"; //builder.generateid(id); //builder.addcssclass(""); //builder.mergeattributes(values); builder.innerhtml = pagingbuilder(values); #endregion return mvchtmlstring.create(builder.tostring(tagrendermode.normal));//解决直接显示html标记 } private static string pagingbuilder(routevaluedictionary values) { #region 条件搜索时包括其他参数 stringbuilder urlparameter = new stringbuilder(); namevaluecollection collection = httpcontext.current.request.querystring; string[] keys = collection.allkeys; for (int i = 0; i < keys.length; i++) { if (keys[i].tolower() != "page") { urlparameter.appendformat("&{0}={1}", keys[i], collection[keys[i]]); } } #endregion //currentpage = convert.toint32(httpcontext.current.request.querystring["page"] ?? "0"); stringbuilder sb = new stringbuilder(); #region 分页统计 sb.appendformat("total {0} records page {1} of {2} ", totalcount, currentpage, totalpages); #endregion #region 首页 上一页 sb.appendformat(tagbuilder(values, 1, " first")); //sb.appendformat("<a href={0}?page=1{1}>first</a> ",url,urlparameter); if (haspreviouspage) { sb.appendformat(tagbuilder(values, currentpage - 1, " prev ")); //sb.appendformat("<a href={0}?page={1}{2}>prev</a> ", url, currentpage - 1, urlparameter); } #endregion #region 分页逻辑 if (totalpages > 10) { if ((currentpage + 5) < totalpages) { if (currentpage > 5) { for (int i = currentpage - 5; i <= currentpage + 5; i++) { sb.append(tagbuilder(values, i, i.tostring())); } } else { for (int i = 1; i <= 10; i++) { sb.append(tagbuilder(values, i, i.tostring())); } } sb.append("... "); } else { for (int i = currentpage - 10; i <= totalpages; i++) { sb.append(tagbuilder(values, i, i.tostring())); } } } else { for (int i = 1; i <= totalpages; i++) { sb.append(" " + tagbuilder(values, i, i.tostring()) + " "); } } #endregion #region 下一页 末页 if (hasnextpage) { sb.appendformat(tagbuilder(values, currentpage + 1, "next")); //sb.appendformat("<a href={0}?page={1}{2}>next</a> ", url, currentpage + 1, urlparameter); } sb.appendformat(tagbuilder(values, totalpages, "last")); //sb.appendformat("<a href={0}?page={1}{2}>last</a>",url,totalpages,urlparameter); #endregion return sb.tostring(); } private static string tagbuilder(routevaluedictionary values, int i, string innertext) { values[pagingparamname] = i; tagbuilder tag = new tagbuilder("a"); if (pagingurl != null) { values["href"] = pagingurl + "?" + pagingparamname + "= " + i + " "; } if (currentpage == i && innertext != " first" && innertext != " last") { values["id"] = "on"; } else { tag.attributes["id"] = ""; } tag.mergeattributes(values); tag.setinnertext(innertext); return tag.tostring(); } #endregion } }
后台controller代码
// // get: /home/ public actionresult index(int? page) { page = page ?? 1; paginghelper.currentpage = convert.toint32(page); paginghelper.pagesize = 20; //{获取数据集的中条数,以及分页的数据集} paginghelper.totalcount = 2000; return view(); }
前台页面代码
@{ viewbag.title = "index"; } @using htmlhelpermvc.models; <h2>index</h2> <hr /> <style type="text/css"> #on { color: #fff; background-color: #337ab7; border-color: #337ab7; } .pagination a { margin-right: 3px; padding: 5px 10px; font-size: 12px; text-decoration: none; background-color: #fff; border: 1px solid #ddd; cursor: pointer; display: inline-block; border-radius: 3px; } a { color: #337ab7; text-decoration: none; } a { background-color: transparent; } * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } </style> <script src="~/scripts/jquery-1.8.2.js"></script> <script type="text/javascript"> $(function () { $(".pagination .active").live("click", function () { $("#page").val($(this).attr("page")); $("#form_submit").submit(); }); }); </script> <form id="form_submit" action="/home/index" method="post"> <div class="fix"> <div class="page"> <div class="pagination pagination-sm pull-right" id="pagediv" style="margin: 0px 0;"> <input type="hidden" id="page" name="page" value="@paginghelper.currentpage" /> @html.paging(new { @class = "active" }) </div> </div> </div> </form>
最终效果图:
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。