分页获取信息列表
# 模板中如何实现分页
在信息页中调用分页数据时,信息后面一般都需要分页控制按钮面板,分页面板是一个稍显繁琐的功能,下面直接上代码:
```cs
@Html.Pager((IPagedList<Info>)ViewBag.PagedList, new PagerOptions
{
PageIndexParameterName = "pageIndex",
FirstPageText = "首页",
LastPageText = "尾页",
PrevPageText = "上一页",
NextPageText = "下一页",
CurrentPagerItemTemplate = "<span class=\"current\">{0}</span>",
DisabledPagerItemTemplate = "<span class=\"disable\">{0}</span>"
})
```
运行后显示的界面如下:

如需要修改展示样式;请使用F12工具查看对应的css代码
## 完整示例代码
`@using Yideas.Model;`所有模版必须包含此函数
`@using Webdiyer.WebControls.Mvc;`分页模版头部必须包含此函数
具体可参考[模版文件介绍](doc:yjXnlr3x)
```html
@using Yideas.Model;
@using Webdiyer.WebControls.Mvc;
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>@ViewBag.Column.ColumnName-@Html.Config("WebSiteTitle")</title>
<meta name="keywords" content="@Html.Config("WebKeyWords")" />
<meta name="description" content="@Html.Config("WebDescript")" />
</head>
<body>
<section>
<div class="clearfix">
<ul class="news_list">
@foreach (var item in ((PagedList<Info>)ViewBag.PagedList))
{
<li class="clearfix">
<a href="@Url.Action("Detail", "Content", new { Id = item.InfoId })">
<div class="img-box" style="background-image:url(@Html.Image(item.DefaultPic))"><img src="@Html.TemplateDir()/statics/images/m.png" /></div>
<div class="font-box">
<p>@item.Title</p>
<span>@item.AddDate.ToString("yyyy-MM-dd")</span>
</div>
</a>
</li>
}
</ul>
</div>
//通用分页代码
<div class="pagination">
@Html.Pager((IPagedList<Info>)ViewBag.PagedList, new PagerOptions
{
PageIndexParameterName = "pageIndex",
FirstPageText = "首页",
LastPageText = "尾页",
PrevPageText = "上一页",
NextPageText = "下一页",
CurrentPagerItemTemplate = "<span class=\"current\">{0}</span>",
DisabledPagerItemTemplate = "<span class=\"disable\">{0}</span>"
})
</div>
</section>
</body>
</html>
```
css代码示例
```css
.pagination{text-align:right}
.pagination a, .pagination span{background:#fff;vertical-align:middle;border:1px solid #eee;color:#444;padding:5px 8px;margin:0 3px}
.pagination a:hover{background:#eee;color:#0073dd}
.pagination span.current{background:#0073dd;color:#fff}
.pagination span.disable{background:#f2f2f2;color:#999}
```
模板制作人员可以在上面代码基础上完善