ASP.NET MVC4 HtmlHelper擴展類,實現(xiàn)分頁功能
來源:易賢網(wǎng) 閱讀:1296 次 日期:2016-08-10 15:40:20
溫馨提示:易賢網(wǎng)小編為您整理了“ASP.NET MVC4 HtmlHelper擴展類,實現(xiàn)分頁功能”,方便廣大網(wǎng)友查閱!

本文主要做了一個HtmHelper類的分頁擴展函數(shù),方便在視圖中調(diào)用,有需要的朋友可以參考一下,希望對大家有所幫助。

1、擴展HtmlHelper類方法ShowPageNavigate

public static HtmlString ShowPageNavigate(this HtmlHelper htmlHelper, int currentPage, int pageSize, int totalCount)

{

  var redirectTo = htmlHelper.ViewContext.RequestContext.HttpContext.Request.Url.AbsolutePath;

  pageSize = pageSize == 0 ? 3 : pageSize;

  var totalPages = Math.Max((totalCount + pageSize - 1) / pageSize, 1); //總頁數(shù)

  var output = new StringBuilder();

  if (totalPages > 1)

  {

    output.AppendFormat("<a class='pageLink' href='{0}?pageIndex=1&pageSize={1}'>首頁</a> ", redirectTo, pageSize);

    if (currentPage > 1)

    {//處理上一頁的連接

      output.AppendFormat("<a class='pageLink' href='{0}?pageIndex={1}&pageSize={2}'>上一頁</a> ", redirectTo, currentPage - 1, pageSize);

    }

    output.Append(" ");

    int currint = 5;

    for (int i = 0; i <= 10; i++)

    {//一共最多顯示10個頁碼,前面5個,后面5個

      if ((currentPage + i - currint) >= 1 && (currentPage + i - currint) <= totalPages)

      {

        if (currint == i)

        {//當前頁處理              

          output.AppendFormat("<a class='cpb' href='{0}?pageIndex={1}&pageSize={2}'>{3}</a> ", redirectTo, currentPage, pageSize, currentPage);

        }

        else

        {//一般頁處理

          output.AppendFormat("<a class='pageLink' href='{0}?pageIndex={1}&pageSize={2}'>{3}</a> ", redirectTo, currentPage + i - currint, pageSize, currentPage + i - currint);

        }

      }

      output.Append(" ");

    }

    if (currentPage < totalPages)

    {//處理下一頁的鏈接

      output.AppendFormat("<a class='pageLink' href='{0}?pageIndex={1}&pageSize={2}'>下一頁</a> ", redirectTo, currentPage + 1, pageSize);

    }

    output.Append(" ");

    if (currentPage != totalPages)

    {

      output.AppendFormat("<a class='pageLink' href='{0}?pageIndex={1}&pageSize={2}'>末頁</a> ", redirectTo, totalPages, pageSize);

    }

    output.Append(" ");

  }

  output.AppendFormat("<label>第{0}頁 / 共{1}頁</label>", currentPage, totalPages);//這個統(tǒng)計加不加都行

  return new HtmlString(output.ToString());

}

2、添加公共類PagerInfo,PageQuery

public class PagerInfo

{

  public int RecordCount { get; set; }

  public int CurrentPageIndex { get; set; }

  public int PageSize { get; set; }

}

public class PagerQuery<TPager, TEntityList>

{

  public PagerQuery(TPager pager, TEntityList entityList)

  {

    this.Pager = pager;

    this.EntityList = entityList;

  }

  public TPager Pager { get; set; }

  public TEntityList EntityList { get; set; }

}

3、然后在Controller里面添加Action

public ActionResult Index(int? pageSize, int? pageIndex)

{

  int pageIndex1 = pageIndex ?? 1;

  int pageSize1 = pageSize ?? 5;

  int count = 0;

  //從數(shù)據(jù)庫在取得數(shù)據(jù),并返回總記錄數(shù)

  var temp = newsSer.LoadPageEntities(c => true, c => c.id, false, pageSize1, pageIndex1, out count);

  PagerInfo pager = new PagerInfo();

  pager.CurrentPageIndex = pageIndex1;

  pager.PageSize = pageSize1;

  pager.RecordCount = count;

  PagerQuery<PagerInfo, IQueryable<news>> query = new PagerQuery<PagerInfo, IQueryable<news>>(pager, temp);

  return View(query);

}

4、View里的部分代碼

<tbody>

  @foreach (var item in Model.EntityList)

  {

    <tr>

      <td class="checkBox">

        <input name="ids[]" type="checkbox" value="" />

      </td>

      <td>

        @item.author

      </td>

      <td>

        @item.title

      </td>

      <td>

        @item.ctime

      </td>

      <td>

        @Html.ActionLink("編輯", "Edit", new { id = item.id }) |

        @Html.ActionLink("刪除", "Delete", new { id = item.id })

      </td>

    </tr>

  }

  @*分頁*@

  <tr class="">

    <td colspan="5" align="center" class="paginator">

      <span>

        @Html.ShowPageNavigate(Model.Pager.CurrentPageIndex, Model.Pager.PageSize, Model.Pager.RecordCount)

      </span>

    </td>

  </tr>

</tbody>

5、添加一些樣式

.paginator

{

  font: 12px Arial, Helvetica, sans-serif;

  padding: 10px 20px 10px 0;

  margin: 0px auto;

}

.paginator a

{

  border: solid 1px #ccc;

  color: #0063dc;

  cursor: pointer;

  text-decoration: none;

}

.paginator a:visited

{

  padding: 1px 6px;

  border: solid 1px #ddd;

  background: #fff;

  text-decoration: none;

}

.paginator .cpb

{

  border: 1px solid #F50;

  font-weight: 700;

  color: #F50;

  background-color: #ffeee5;

}

.paginator a:hover

{

  border: solid 1px #F50;

  color: #f60;

  text-decoration: none;

}

.paginator a, .paginator a:visited, .paginator .cpb, .paginator a:hover

{

  float: left;

  height: 16px;

  line-height: 16px;

  min-width: 10px;

  _width: 10px;

  margin-right: 5px;

  text-align: center;

  white-space: nowrap;

  font-size: 12px;

  font-family: Arial,SimSun;

  padding: 0 3px;

}

.paginator label

{

  display:block;  

  float:left;  

}

6.總結(jié)

這個案例簡單實現(xiàn)了在MVC中快速分頁,其實很多開源的項目中都有相關的HtmlHepler的擴展函數(shù),其中也不乏帶有分頁的擴展,例如著名的開源商城項目nopCommerce,其中有就一個HtmlExtensions.cs擴展類,里面就有關于分頁的擴展,人家寫的可是相當專業(yè)哦,有興趣的可以研究一下。

更多信息請查看網(wǎng)絡編程
易賢網(wǎng)手機網(wǎng)站地址:ASP.NET MVC4 HtmlHelper擴展類,實現(xiàn)分頁功能

2025國考·省考課程試聽報名

  • 報班類型
  • 姓名
  • 手機號
  • 驗證碼
關于我們 | 聯(lián)系我們 | 人才招聘 | 網(wǎng)站聲明 | 網(wǎng)站幫助 | 非正式的簡要咨詢 | 簡要咨詢須知 | 新媒體/短視頻平臺 | 手機站點 | 投訴建議
工業(yè)和信息化部備案號:滇ICP備2023014141號-1 云南省教育廳備案號:云教ICP備0901021 滇公網(wǎng)安備53010202001879號 人力資源服務許可證:(云)人服證字(2023)第0102001523號
聯(lián)系電話:0871-65099533/13759567129 獲取招聘考試信息及咨詢關注公眾號:hfpxwx
咨詢QQ:1093837350(9:00—18:00)版權(quán)所有:易賢網(wǎng)