Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

update gridview without rebuilding whole page

I have a complicated page with panels and many controls placed on it. The page includes a set of filters and a gridview. Through selecting different filters I receive a different amount of items for my gridview. This all works but is very slow in updating, that is when I change the filters and press my update button. I need to find a solution to speed this action up somewhat! So here is the question: Is it possible to update just the data source for the gridview without rebuilding the whole page. The idea is to update the grid view as quickly as possible; there could be over 10,000 items in the grid. Thanks

like image 469
Wayne Avatar asked Apr 12 '13 03:04

Wayne


1 Answers

I'd suggest placing the GridView and filter controls into an UpdatePanel on the page:

<asp:UpdatePanel runat="server" id="upData">
    <ContentTemplate>
        <div id="filterControls">
            <asp:TextBox runat="server" id="txtFilter"></asp:TextBox>
            <asp:Button runat="server" id="btnFilter" Text="Filter" />
        </div>

        <asp:GridView runat="server" id="gvItems">
            <EmptyDataTemplate>No results to display</EmptyDataTemplate>
        </asp:GridView>
    </ContentTemplate>
</asp:UpdatePanel>

Once done, you can simply get the data again. I've provided code for both vb and c# as you didn't specify:

C#

protected void Page_Load(object sender, EventArgs e)
{
    // get the data initially on page load
    if (!IsPostBack)
    {
        loadDataGrid();
    }
}

protected void btnFilter_Click(object sender, EventArgs e)
{
    loadDataGrid();
}

private void loadDataGrid()
{
    // call a procedure to get the data. This is what I use:
    // execDB(string commandText, string commandType, List<SqlParameter> args, bool newConnection);
    using (Database db = new Database())
    {
        List<SqlParameter> args = new List<SqlParameter>();
        args.Add(new SqlParameter("@filter1", SqlDbType.VarChar));
        args(args.Count - 1).Value = txtFilter1.Text;

        DataTable dt = db.execDB("Users_GetAll", "SP", args.ToArray(), false);

        if (dt.Rows.Count > 0)
        {
            gvItems.DataSource = dt;
            gvItems.DataBind();
        }
    }
}

VB

Protected Sub Page_Load(sender As Object, e As EventArgs)
    ' get the data initially on page load
    If Not IsPostBack Then
        loadDataGrid()
    End If
End Sub

Protected Sub btnFilter_Click(sender As Object, e As EventArgs)
    loadDataGrid()
End Sub

Private Sub loadDataGrid()
    ' call a procedure to get the data. This is what I use:
    ' execDB(string commandText, string commandType, List<SqlParameter> args, bool newConnection);
    Using db As New Database()
        Dim args As New List(Of SqlParameter)()
        args.Add(New SqlParameter("@filter1", SqlDbType.VarChar))
        args(args.Count - 1).Value = txtFilter1.Text

        Dim dt As DataTable = db.execDB("Users_GetAll", "SP", args.ToArray(), False)

        If dt.Rows.Count > 0 Then
            gvItems.DataSource = dt
            gvItems.DataBind()
        End If
    End Using
End Sub

This will basically cause the filter button to update the GridView getting ONLY the data needed for it and because it's in an UpdatePanel, it also avoids posting back the entire page which ought to improve the speed of the page overall.

Hope this helps!

like image 199
Ortund Avatar answered Sep 26 '22 01:09

Ortund