GridView custom pager template in asp.net

GridView custom pager template
GridViewCustomPagerTemplate.aspx

<%@ Page Language="C#" AutoEventWireup="true" %>

<!DOCTYPE html>

<script runat="server">
    protected void GridView1_RowCommand(Object sender, GridViewCommandEventArgs e)
    {
        switch (e.CommandName)
        { 
            case "First":
                {GridView1.PageIndex = 0; break;}
            case "Next":
                { GridView1.PageIndex++; break; }
            case "Previous":
                { GridView1.PageIndex--; break; }
            case "Last":
                { GridView1.PageIndex = GridView1.PageCount - 1; break; }
        }
        Label1.Text = "Current Page: " + (GridView1.PageIndex + 1) + " Total Page:" + GridView1.PageCount;
    }
</script>

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>How to create GridView custom pager template in asp.net</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <h2 style="color:Navy; font-style:italic;">GridView Example: Using Custom PagerTemplate</h2>
        <asp:SqlDataSource 
            ID="SqlDataSource1"
            runat="server"
            ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
            SelectCommand="Select ProductID, ProductName, QuantityPerUnit, UnitPrice From Products"
            >
        </asp:SqlDataSource>
        <asp:Label 
            ID="Label1"
            runat="server"
            Font-Bold="true"
            Font-Size="Large"
            Font-Italic="true"
            ForeColor="DodgerBlue"
            >
        </asp:Label>
        <asp:GridView 
            ID="GridView1"
            runat="server"
            DataSourceID="SqlDataSource1"
            AutoGenerateColumns="true"
            AllowPaging="true"
            PageSize="10"
            BorderColor="LightPink"
            Font-Names="Comic Sans MS"
            OnRowCommand="GridView1_RowCommand"
            Width="650"
            >
            <HeaderStyle BackColor="Crimson" ForeColor="Snow" Height="45" />
            <RowStyle BackColor="OrangeRed" ForeColor="Snow" Font-Italic="true" />
            <PagerStyle Height="45" HorizontalAlign="Right" BackColor="RosyBrown" />
            <PagerTemplate>
                <asp:Button 
                    ID="Button1" 
                    runat="server" 
                    Text="First" 
                    CommandName="First"
                    Height="35"
                    Font-Bold="true"
                    ForeColor="SaddleBrown"
                    />
                <asp:Button 
                    ID="Button2" 
                    runat="server" 
                    Text="Next" 
                    CommandName="Next"
                    Height="35"
                    Font-Bold="true"
                    ForeColor="SaddleBrown"
                    />
                <asp:Button 
                    ID="Button3" 
                    runat="server" 
                    Text="Previous" 
                    CommandName="Previous"
                    Height="35"
                    Font-Bold="true"
                    ForeColor="SaddleBrown"
                    />
                <asp:Button 
                    ID="Button4" 
                    runat="server" 
                    Text="Last" 
                    CommandName="Last"
                    Height="35"
                    Font-Bold="true"
                    ForeColor="SaddleBrown"
                    />
            </PagerTemplate>
        </asp:GridView>
    </div>
    </form>
</body>
</html>
Related asp.net examples