資料分頁一隻是一個老生常談的問題，只要是做系統開發，一般都會牽扯到。最新學習了Razor，用到分頁功能，分享下如何實現Ajax分頁。 1.準備工作    網上有現成的分頁工具 MVCPager，最新的是1.5版本，綜合比較後感覺這個控制元件還是蠻好的，決定採用    MVCPager原始碼和Demo： http://mvcpager.codeplex.com/releases/view/64098    原始碼中採用了Linq，由於自己專案沒用Linq，所以對MVCpager稍作了修改，修改後的dll： MVCWeb.rar    其實就改了一個地方，資料型別由IQuery改成IList，加入一個TotalCount（總記錄數量）引數 2.實現    首先來個圖，吊吊胃口 　①Model，沒什麼好說

using System;
using System.Collections;


/* *
* 作者：jackchain * QQ : 710782046
* Email:[email protected]
*/
namespace Model
{
public class comnotices
{
#region 建構函式
public comnotices()
{}
#endregion

#region 屬性

/// <summary> 自動增長 </summary>
public int nid
{
get ;
set ;
}

/// <summary> 資訊類別 </summary>
public string category
{
get ;
set ;
}

/// <summary> 資訊標題 </summary>
public string title
{
get ;
set ;
}

/// <summary> 資訊內容 </summary>
public string infodetails
{
get ;
set ;
}

/// <summary> 釋出時間 </summary>
public string publishdate
{
get ;
set ;
}

/// <summary> 釋出人 </summary>
public string publishman
{
get ;
set ;
}

/// <summary> 訪問量 </summary>
public int hits
{
get ;
set ;
}


#endregion

#region 獲得自增鍵
private string ReturnAutoID()
{
return " nid " ;
}
#endregion
}
}

 

　②Controller

[OutputCache(Duration = 300 )]
// condition是條件，page是當前頁面
public ActionResult Index( string condition = "" , int page = 1 )
{
if (condition.ToLower() != " all " )
condition = " category=' " + Server.HtmlDecode(condition.Replace( " ' " , "" )) + " ' " ;
else condition = "" ;
　　　　 // ToPagedList就是修改的MVCpager方法，引數：當前頁號，分頁大小，總記錄數量
// FindAllByPage是自己實現的分頁方法，根據條件只取當前頁面的資料
PagedList < comnotices > notices = mgr.FindAllByPage(((page - 1 ) * 20 ).ToString(), " 20 " , "" , condition, 11 ).ToPagedList(page, 20 , int .Parse(mgr.GetTotalCount( "" , condition)));
if (Request.IsAjaxRequest())
return PartialView( " NewsAjaxList " , notices);
return View(notices);
} 　　③View頁面

@ * 這裡注意 * @
@model Webdiyer.WebControls.Mvc.PagedList < Model.comnotices >

@{
ViewBag.Title = " xxxxxx " ;
Layout = " ~/Views/Shared/_Layout.cshtml " ;
}

< div class = " submain " >
< div class = " subleft " >
.............
</ div >
< div class = " subright " >
.............
@{Html.RenderPartial( " NewsAjaxList " , Model); }@ * 這裡注意，用於AJAX區域性重新整理 * @
</ div >
</ div >

 

　　④區域性檢視（NewsAjaxList.cshtml)

@using Webdiyer.WebControls.Mvc
@model PagedList < Model.comnotices >
< div id = " CJ_NEWSLIST " >
< ul >
@foreach (var news in Model)
{
< li >< a href = " /News/[email protected]{@news.nid} " title = " @news.title " > [@news.category]@news.title </ a > < span class = " newsdate " > HITS:@news.hits @news.publishdate </ span ></ li >
}
</ ul >< br />
@ * 分頁控制元件顯示的地方一定要放在重新整理的div裡面，不然會出現雙重控制元件 * @
< div style = " text-align:right; " >
@Html.AjaxPager(Model, new PagerOptions() { PageIndexParameterName = " page " , ShowDisabledPagerItems = true , AlwaysShowFirstLastPageNumber = true , CssClass = " pages " }, new AjaxOptions { UpdateTargetId = " CJ_NEWSLIST " })
</ div >
@ * 需用樣式的分頁，去掉css即可 * @
< div style = " text-align:right; " >
@Html.AjaxPager(Model, new PagerOptions() { PageIndexParameterName = " page " , ShowDisabledPagerItems = true , AlwaysShowFirstLastPageNumber = true }, new AjaxOptions { UpdateTargetId = " CJ_NEWSLIST " })
</ div >
</ div >

 

　　⑤css樣式

/* 分頁控制元件樣式 */
.pages { color : #000 ; font-weight : bold ; font-size : 13px ; }
.pages .item { padding : 3px 6px ; font-size : 13px ; } /* 數字頁索引樣式 */
.pages .cpb { color : red ; padding : 1px 6px ; font-size : 13px ; } /* 當前頁樣式 */
.pages a { text-decoration : none ; padding : 0 5px ; border : 1px solid #ddd ; margin : 0 2px ; color : #000 ; font-weight : normal ; }
.pages a:hover { background-color : #3666d4 ; color : #fff ; border : 1px solid #3666d4 ; text-decoration : none ; font-weight : normal ; } 　　⑥不要忘記應用必要的js庫，這裡採用的是jquery庫

< script src ="@Url.Content(" ~/Scripts/jquery-1.4.4.min.js")" type ="text/javascript" ></ script >

< script type ="text/javascript" src [email protected]("/Scripts/jquery.unobtrusive-ajax.min.js") ></ script >

OK至此對於MVC3.0一個按條件分頁功能即可實現了，而且是區域性重新整理的。更多模式你可參考MVCPager的Demo

http://www.soaspx.com/dotnet/asp.net/DPattern/dpattern_20110620_7734.html