Creating custom WebGrid pager in razor MVC3

MVC Razor has a pager method i.e. WebGrid.Pager which we can use to create a custom pager for webgrid.

WebGrid.Pager(
WebGridPagerModes mode,
 string firstText,
 string previousText,
 string nextText,
 string lastText,
 int numericLinksCount
)

where….
mode
Type: System.Web.Helpers.WebGridPagerModes
A bitwise combination of the enumeration values that specify the methods that are provided for moving between the pages of the grid. The default is the bitwise OR of the NextPrevious and Numeric flags.

firstText
Type: System.String
The text for the HTML link element that navigates to the first page of the grid.

previousText
Type: System.String
The text for the HTML link element that navigates to the previous page of the grid.

nextText
Type: System.String
The text for the HTML link element that navigates to the next page of the grid.

lastText
Type: System.String
The text for the HTML link element that navigates to the last page of the grid.

numericLinksCount
Type: System.Int32
The number of numeric page links to display. The default is 5.

Example is as follws….

@{

var grid = new WebGrid(source: Model.Getdata,
rowsPerPage: 10, canPage:true);   

}
// canPage attribute should be set to true as I did above.

// You can set any other attributes like rowsPerPage,souce,tec....


@grid.GetHtml(

columns: grid.Columns(

grid.Column("Name", format: @<text>@item.Name</text>, header: "Name"),
grid.Column("Age", format: @<text>@item.Age</text>, header: "Age"),
grid.Column("Phone", format: @<text>@item.Phone</text>, header: "Phone")
))

// Below is the magical code


@grid.Pager(
mode: WebGridPagerModes.All,
numericLinksCount: 15,
firstText: "<<",
lastText: ">>",
previousText: "<",
nextText: ">")

}

By doing this you will see the custom pager created bellow your webgrid.
You will also see default pager of the webgrid which is generated due to canPage attribute, we can hide this using come css so that we will only be able to see custom webgrid pager on the page.