C# – How to enable Paging and Sorting on ASP.NET 4.0 GridView programmatically

asp.netcgridview

I am using ASP.NET 4.0 with C# (Visual Web Developer 2010 Express).

I have successfully managed to implement a simple GridView bound to a stored procedure data source using declarative ASP.NET code as shown here:

<asp:GridView 
    ID="grdTrades" 
    runat="server" 
    DataKeyNames="tradeId" 
    EnablePersistedSelection="true"
    SelectedRowStyle-BackColor="Yellow" 
    AllowPaging="true" 
    AllowSorting="true"
    PageSize = "20" 
    AutoGenerateColumns="false" 
    DataSourceID="sdsTrades" 
    >
    <Columns>
        <asp:CommandField ShowSelectButton="true" ButtonType="Link" SelectText="Select" />
        <asp:BoundField DataField="tradeId" HeaderText="TradeId"  ReadOnly="True" SortExpression="tradeId" />
        < ... more columns ... >
    </Columns>
</asp:GridView>

<asp:SqlDataSource ID="sdsTrades" runat="server" 
    ConnectionString="<%$ ConnectionStrings:TradesDB %>" 
    ProviderName="<%$ ConnectionStrings:Trades.ProviderName %>"  
    SelectCommand="usp_GetTrades" SelectCommandType="StoredProcedure">      
</asp:SqlDataSource>

It works great including paging and sorting. I want to remove the SqlDataSource and use code-behind (I'm trying to put database access code in one place). So far I have this in my code-behind:

protected void Page_Load(object sender, EventArgs e)
{
    if (!this.IsPostBack)
    {
        grdTrades.SelectedIndex = 0;
        DBUtil DB = new DBUtil();
        grdTrades.DataSource = DB.GetTrades();
        grdTrades.DataKeyNames = new string[] { "tradeId" };
        grdTrades.DataBind();            
    }
}

// this is needed otherwise I get "The GridView 'grdTrades' fired event PageIndexChanging which wasn't handled."
void grdTrades_PageIndexChanging(Object sender, GridViewPageEventArgs e)
{
    grdTrades.PageIndex = e.NewPageIndex;
    grdTrades.DataBind();
}    

My declarative code now looks like:

<asp:GridView 
    ID="grdTrades" 
    runat="server" 
    EnablePersistedSelection="true"            
    SelectedRowStyle-BackColor="Yellow" 
    AllowPaging="true" 
    AllowSorting="true"
    PageSize = "20" 
    AutoGenerateColumns="false" 

    OnPageIndexChanging="grdTrades_PageIndexChanging"
    >
    <Columns>
        <asp:CommandField ShowSelectButton="true" ButtonType="Link" SelectText="Select" />
        <asp:BoundField DataField="tradeId" HeaderText="TradeId"  ReadOnly="True" SortExpression="tradeId" />
        < ... more columns ... >           
    </Columns>
</asp:GridView>

The problem is when I click on a page number the page becomes blank. I would also like to implement sorting but would like to get the paging working first. Please help.

Thanks

Best Answer

You need to bind your GridView every time you change page.

For example:

void grdTrades_PageIndexChanging(Object sender, GridViewPageEventArgs e) 
{
    grdTrades.DataSource = DB.GetTrades();  
    grdTrades.PageIndex = e.NewPageIndex; 
    grdTrades.DataBind(); 
} 

My advice would be to store your results from DB.GetTrades() in the ViewState (or Cache) so you don't need to go to the database everytime you change page.

Sorting can become quite difficult when doing this, though.

You can always use an ObjectDataSource instead of a SqlDatasource. You can then point your ObjectDataSource to look at your DB.GetTrades() function. Sorting and Paging will work automatically.

Hope that helps.

Related Topic