Click here to Skip to main content
Click here to Skip to main content

GridView Pager Template

, 30 Sep 2013
Rate this:
Please Sign up or sign in to vote.
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 gridview.

The pagers itself is a scrolling window pager with:

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

Simply add the following class into your project:

Gridview pager template class

Reference it in your gridview, this is how my gridview 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>

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

About the Author

Tony Gayter
Web Developer
United Kingdom United Kingdom
No Biography provided
Follow on   Twitter

Comments and Discussions

 
QuestionCode missing Pinmemberbriankitt29-Sep-13 16:14 
AnswerRe: Code missing PinmemberTony Gayter30-Sep-13 0:41 
GeneralRe: Code missing Pinmemberbriankitt30-Sep-13 5:26 
GeneralRe: Code missing Pinmemberkbalint4-Apr-14 3:08 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

| Advertise | Privacy | Mobile
Web02 | 2.8.140709.1 | Last Updated 30 Sep 2013
Article Copyright 2013 by Tony Gayter
Everything else Copyright © CodeProject, 1999-2014
Terms of Service
Layout: fixed | fluid