GridView Pager Template

I recently created a dynamic data project and needed to change its layout, most things went well until I came to changing the list page. This consisted of a Gridview and standard pager template.  I had already started using bootstrap (for ease of use) so wanted to change the table to use bootstrap table classes with its standard pager. After much searching I managed to get the table outputting correctly using CSS Friendly adapters. However, the pager was a bit lacking.

I had already developed a paging control for a different project and it looked like a fairly simple modification to get it to use the grid view.

The pagers itself is a scrolling window pager with:

• Optional ‘First/Last’ and ‘Previous/Next’ links with easily changable text
• Changeable ’Pager links to show’ setting
• Easily modifiable html output

Simply add the following class into your project

Reference it in your grid view, this is how my grid view looks.

<asp:GridView ID="GridView1"
    runat="server"
    DataSourceID="GridDataSource"
    AllowPaging="True"
    AllowSorting="True"
    CssClass="table table-striped"
    AutoGenerateEditButton="True"
    AutoGenerateDeleteButton="True"
    PageSize="5" >
    <PagerTemplate>
        <asp:GridPager ID="GridViewPager1" runat="server"
            ShowFirstAndLast="True"
            ShowNextAndPrevious="True"
            PageLinksToShow="10"
            NextText="›"
            PreviousText="‹"
            FirstText="«"
            LastText="»"/>
    </PagerTemplate>
    <EmptyDataTemplate>
        There are currently no items in this table.
    </EmptyDataTemplate>
</asp:GridView>