1、扩展HtmlHelper类方法ShowPageNavigate
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
|
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); //总页数
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); //这个统计加不加都行
return new HtmlString(output.ToString());
}
|
2、添加公共类PagerInfo,PageQuery
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
|
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
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
public ActionResult Index( int ? pageSize, int ? pageIndex)
{
int pageIndex1 = pageIndex ?? 1;
int pageSize1 = pageSize ?? 5;
int count = 0;
//从数据库在取得数据,并返回总记录数
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里的部分代码
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
|
< 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、添加一些样式
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
|
.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.总结
这个案例简单实现了在MVC中快速分页,其实很多开源的项目中都有相关的HtmlHepler的扩展函数,其中也不乏带有分页的扩展,例如著名的开源商城项目nopCommerce,其中有就一个HtmlExtensions.cs扩展类,里面就有关于分页的扩展,人家写的可是相当专业哦,有兴趣的可以研究一下。