Thursday, April 19, 2012

C# Linq to Sql Simple MVC Gridview - Complete paging solution

LINQ TO SQL ASP.NET MVC - Simple paged Gridview

Every application that works with any kind of data requires paging. In C# WebForms and WinForms you can use Gridviews, Pagers and so on but sometimes project requires different design where you can't use these or when you are working with ASP.NET MVC.

So lets say you have SQL database with 1000 rows and now you need to diplay it in you custom made gridView, html table, divs..etc but you also need way to show more pages to users.

Assuming you are already know Linq To Sql and ASP.NET MVC,
Here is method for grabbing products from database using Linq To Sql:

public static PaginatedList<Product> GetProducts(int page, int pageSize)
{
using (ProductDataContext context = new ProductDataContext())
{
var query = from p in context.Products select p;

var paginatedProducts = new PaginatedList<Product>(query, page, pageSize);

return paginatedProducts;
}
}

Here is my custom class that extends generic List called PaginatedList, this class can be used with any database data retrival techique:

public class PaginatedList : List
{
public int PageIndex { get; private set; }
public int PageSize { get; private set; }
public int TotalCount { get; private set; }
public int TotalPages { get; private set; }
public List<int> PreviousPages { get; private set; }
public List<int> NextPages { get; private set; }

public PaginatedList(IQueryable source, int pageIndex, int pageSize)
{
PageIndex = pageIndex;
PageSize = pageSize;
TotalCount = source.Count();
TotalPages = (int)Math.Ceiling(TotalCount / (double)PageSize);
this.AddRange(source.Skip((pageIndex - 1) * PageSize).Take(PageSize));

PreviousPages = new List<int>();
NextPages = new List<int>();

for (int i = 6; i >= 1; i--)
{
if ((pageIndex - i) >= 1)
PreviousPages.Add(pageIndex - i);
}

for (int i = 1; i < 6 && (i + pageIndex) <= TotalPages; i++)
{
NextPages.Add(pageIndex + i);
}
}

public bool HasPreviousPage
{
get
{
return (PageIndex > 1);
}
}

public bool HasNextPage
{
get
{
return (PageIndex + 1 <= TotalPages);
}
}
}

Custom GridView in ASP.NET C# MVC Usage Example:


Controller

public ActionResult Index(int page = 1, int size = 100)
{
var products = ProductsManipulation.Products(page, size);

return View(products);
}
View

@model PaginatedList<Product>
@{
ViewBag.Title = "Index";
}

<table style="border:1px solid Gray; width:100%;">
<tr>
<td>Product Nametd>

<td>Product Pricetd>
tr>
@foreach (var product in Model)
{
<tr>
<td>@product.Nametd>
<td>@product.Pricetd>
tr>
}
table>

<div>
@if (Model.HasPreviousPage)
{
<a href="?page=@(Model.PageIndex-1)">Previousa>
}

@foreach (var pageNum in Model.PreviousPages)
{
<a href="?page=@(pageNum)">@pageNuma>
}

<span>@Model.PageIndexspan>

@foreach (var pageNum in Model.NextPages)
{
<a href="?page=@(pageNum)">@pageNuma>
}

@if (Model.HasNextPage)
{
<a href="?page=@(Model.PageIndex + 1)">Nexta>
}
div>

I will be adding more examples using T-SQL, EF and WebForms examples.



Vote