Skip to content

Instantly share code, notes, and snippets.

@ryanlewis
Created August 27, 2013 16:41
Show Gist options
  • Star 6 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save ryanlewis/6355983 to your computer and use it in GitHub Desktop.
Save ryanlewis/6355983 to your computer and use it in GitHub Desktop.
A Razor/ASP.NET MVC pager that is adaptable for any project (Developed for Umbraco)
@model Epiphany.Web.Models.PagerViewModel
@{
var showPages = 5;
var maxPage = (int) Math.Ceiling((decimal) Model.Total/Model.PageSize);
}
@*[[ PAGER PAGE:@Model.Page PAGESIZE:@Model.PageSize TOTAL:@Model.Total MAXPAGE:@maxPage ]]*@
<div class="pagination">
<span class="paging-heading">Read more stories</span>
<ul class="paging">
@Previous(Model.Page)
@LeftDots(Model.Page, showPages)
@PageNumbers(Model.Page, showPages, maxPage)
@RightDots(Model.Page, showPages, maxPage)
@Next(Model.Page, maxPage)
</ul>
</div>
@helper Previous(int page)
{
if (page == 1)
{
@:<li class="p-prev disabled"><a href="#"></a>
}
else
{
@:<li class="p-prev"><a href="?page=@(page - 1)"></a>
}
}
@helper Next(int page, int maxPage)
{
if (page >= maxPage)
{
@:<li class="p-next disabled"><a href="#"></a>
}
else
{
@:<li class="p-next"><a href="?page=@(page + 1)"></a>
}
}
@helper LeftDots(int page, int showPages)
{
var middle = Math.Ceiling((decimal) showPages/2);
if (page - middle > 0)
{
@:<li class="p-dots"><a>…</a>
}
}
@helper RightDots(int page, int showPages, int maxPage)
{
var floor = (int)Math.Floor((decimal)showPages/2);
if (maxPage - page - floor > 0)
{
@:<li class="p-dots"><a>…</a>
}
}
@helper PageNumbers(int page, int showPages, int maxPage)
{
var middle = page;
var start = page - 2;
var end = page + 2;
while (start < 1 && end < maxPage)
{
start++;
middle++;
end++;
}
if (end - maxPage > 0)
{
start = start - (end - maxPage);
}
if (start < 1)
{
start = 1;
}
for (int i = start; i <= maxPage && i <= end; i++)
{
if (i == page)
{
@:<li class="p-active"><a href="?page=@i">@i</a>
}
else
{
@:<li><a href="?page=@i">@i</a>
}
}
@*<text>[[ START:@start END:@end MAXPAGE:@maxPage PAGE:@page]]</text>*@
}
public class PagerViewModel
{
public int Page { get; set; }
public int PageSize { get; set; }
public int Total { get; set; }
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment