Asp.net mvc簡單實現基於Razor的分頁控制項

最近在寫一些web應用瞭解了一下asp.net mvc發現的確好用，所以直接就幹上了。不過在使用asp.net mvc的Razor模板的情況並不向傳統webform那樣可以使用控制項。但從Razor的功能上已經具備相關代替的功能，只是從Razor角度來說不是 我們平常說的控制項而是子模板。由於Razor可以根據自己需求把功能拆分到子模板中，然後通過RenderPage方法輸出。從設計的手段上來看完全可以 把分頁控制項封裝成一個子的cshtml,在需要的時候引用上就是了。

作為一個控制項的設計其最重要的環節是隔離和獨立性，在這方面Razor也考慮得比較周到， 通過PageData可以簡單地進行模板之間的資料偶合問題。下面通過Razor實現一個簡單的分頁控制項，在實現過程只需要編寫一個簡單的cshtml的 模板即可。在使用上也並不需要引用什麼代碼或ＤＬＬ，直接在需要的地方嵌入相關cshtml則可以分頁控制項的功能。

參數制定

一個控制項要輸出資訊必須制定相關的資料規範，一個簡單的分頁控制項其實只需要兩個參數即可以，分別當前頁索引和總頁數。可以在Razor模板的頂部聲音一下資料規範

 @{    int pageindex = (int)PageData["pageindex"];    int spitindex = 0;    int pagecount = (int)PageData["pagecount"];}

這兩上參數就是告訴使用者在調用RenderPage輸入的時候必須帶上這兩個參數值.

分頁ＵＲＬ制定

在一些資料查詢中往往在ＵＲＬ上會帶上一些相關參數，所以在輸入分頁ＵＲＬ的時候需要簡單地處理一下。

 @functions{    public static string GetUrl(int index)    {        System.Collections.Specialized.NameValueCollection querystring = HttpContext.Current.Request.QueryString;        System.Text.StringBuilder sb = new System.Text.StringBuilder();        sb.Append("?").AppendFormat("pageindex=" + index);        foreach(string key in querystring.Keys)        {            if (key != "pageindex")                sb.AppendFormat("&{0}={1}", key, HttpContext.Current.Server.UrlEncode(querystring[key]));        }        return sb.ToString();    }}

簡單地把pageindex附加到當前url querystring即可.
分頁內容輸出

有了以上資訊那構建一個分頁內容輸出就是件簡單的事情了。

<div class="pagebar">    <ul>        <li id="pageinfo"><a>@Html.Raw(pageindex + 1) / @pagecount</a></li>        @if (pageindex > 0)        {            <li><a href="@GetUrl(pageindex-1)">Previous</a> </li>        }        @{ spitindex = pageindex - 2;}        @if (spitindex > 4)        {                        <li><a href="@GetUrl(0)">1</a> </li>            <li><a href="@GetUrl(spitindex - 2)">...</a> </li>        }        else        {            for (int i = 0; i < spitindex; i++)            {                        <li><a href="@GetUrl(i)">@Html.Raw(i + 1)</a> </li>            }        }        @for (int i = pageindex - 2; i < pageindex; i++)        {            if (i >= pageindex  i < 0)            {                continue;            }                        <li><a href="@GetUrl(i)">@Html.Raw(i+1)</a> </li>                    }        <li><a id="selectpage"><b>@Html.Raw(pageindex+1)</b> </a></li>        @for (int i = pageindex + 1; i < pagecount; i++)        {            if (i >= pageindex + 3)            {                break;            }                             <li><a href="@GetUrl(i)">@Html.Raw(i+1)</a> </li>                    }        @{ spitindex = pageindex + 3; }        @if (pagecount - 4 > spitindex)        {            <li><a href="@GetUrl(spitindex + 2)">...</a> </li>            <li><a href="@GetUrl(pagecount - 1)">@pagecount</a> </li>        }        else        {            for (int i = spitindex; i < pagecount; i++)            {                                <li><a href="@GetUrl(i)">@Html.Raw(i+1)</a> </li>            }        }        @if (pageindex != pagecount - 1)        {                                  <li><a href="@GetUrl(pageindex + 1)">Next</a> </li>                    }    </ul></div>

使用控制項

控制項使用非常簡單只需要在Razor通過RenderPage輸出即可

@RenderPage("~/views/controls/pagebar.cshtml", new { pageindex = Model.PageIndex, pagecount = Model.PageCount })

控制項效果