GridView Control PagerTemplate in VB and ASP.NET

This tutorial shows how we can modify the pager section of a GridView using the PagerTemplate tags. VB version.

This tutorial will give an introduction to using the PagerTemplate of a GridView control. The PagerTemplate allows us to set a certain layout that the pager of a GridView will conform to. In this example, we will create the PagerTemplate too show the current page and number of pages, as well as a dropdown menu to navigate between pages.

First, we will add the Connection String to the sample database, NorthWind:

<connectionStrings> <add name="ConnectionString" connectionString="Data Source=.\SQLEXPRESS;AttachDbFilename=|DataDirectory|\NORTHWND.MDF;Integrated Security=True;User Instance=True" providerName="System.Data.SqlClient" /> </connectionStrings>

Try Server Intellect for Windows Server Hosting. Quality and Quantity!

Next, we add the GridView to our ASPX page.
Note the code between the <PagerTemplate> tags, this is the layout for the GridView pager:

<form id="form1" runat="server"> <asp:GridView id="CustomersGridView" datasourceid="CustomersSqlDataSource" autogeneratecolumns="False" allowpaging="True" ondatabound="CustomersGridView_DataBound" runat="server" DataKeyNames="CustomerID"> <PagerStyle forecolor="Blue" backcolor="LightBlue"/> <PagerTemplate> <table width="100%"> <tr> <td style="width:70%"> <asp:label id="MessageLabel" forecolor="Blue" text="Select a page:" runat="server"/> <asp:dropdownlist id="PageDropDownList" autopostback="true" onselectedindexchanged="PageDropDownList_SelectedIndexChanged" runat="server"/> </td> <td style="width:70%; text-align:right"> <asp:label id="CurrentPageLabel" forecolor="Blue" runat="server"/> </td> </tr> </table> </PagerTemplate> <Columns> <asp:BoundField DataField="CustomerID" HeaderText="CustomerID" ReadOnly="True" SortExpression="CustomerID" /> <asp:BoundField DataField="CompanyName" HeaderText="CompanyName" SortExpression="CompanyName" /> <asp:BoundField DataField="Address" HeaderText="Address" SortExpression="Address" /> <asp:BoundField DataField="City" HeaderText="City" SortExpression="City" /> <asp:BoundField DataField="PostalCode" HeaderText="PostalCode" SortExpression="PostalCode" /> <asp:BoundField DataField="Country" HeaderText="Country" SortExpression="Country" /> </Columns> </asp:GridView> <asp:SqlDataSource id="CustomersSqlDataSource" selectcommand="SELECT [CustomerID], [CompanyName], [Address], [City], [PostalCode], [Country] FROM [Customers]" connectionstring="<%$ ConnectionStrings:ConnectionString %>" runat="server"> </asp:SqlDataSource> &nbsp; </form>

We are using Server Intellect and have found that by far, they are the most friendly, responsive, and knowledgeable support team we've ever dealt with!

The code behind will look something like this:

Imports System Imports System.Data Imports System.Configuration Imports System.Web Imports System.Web.Security Imports System.Web.UI Imports System.Web.UI.WebControls Imports System.Web.UI.WebControls.WebParts Imports System.Web.UI.HtmlControls Partial Class _Default Inherits System.Web.UI.Page Protected Sub PageDropDownList_SelectedIndexChanged(ByVal sender As Object, ByVal e As EventArgs) Dim pagerRow As GridViewRow = CustomersGridView.BottomPagerRow Dim pageList As DropDownList = CType(pagerRow.Cells(0).FindControl("PageDropDownList"), DropDownList) CustomersGridView.PageIndex = pageList.SelectedIndex End Sub Protected Sub CustomersGridView_DataBound(ByVal sender As Object, ByVal e As EventArgs) Dim pagerRow As GridViewRow = CustomersGridView.BottomPagerRow Dim pageList As DropDownList = CType(pagerRow.Cells(0).FindControl("PageDropDownList"), DropDownList) Dim pageLabel As Label = CType(pagerRow.Cells(0).FindControl("CurrentPageLabel"), Label) If pageList IsNot Nothing Then For i As Integer = 0 To CustomersGridView.PageCount - 1 Dim pageNumber As Integer = i + 1 Dim item As New ListItem(pageNumber.ToString()) If i = CustomersGridView.PageIndex Then item.Selected = True End If pageList.Items.Add(item) Next i End If If pageLabel IsNot Nothing Then Dim currentPage As Integer = CustomersGridView.PageIndex + 1 pageLabel.Text = "Page " & currentPage.ToString() & " of " & CustomersGridView.PageCount.ToString() End If End Sub End Class

Looking for the C#.NET 2005 Version? Click Here!

Looking for more ASP.NET Tutorials? Click Here!