C# – GridView paging inside an UpdatePanel or PlaceHolder components

ajaxasp.netcgridviewupdatepanel

I'm new to ASP.NET.

Im developing ASP.NET C# web form which creating GridView components dynamically and filling them using the data received from my webservice.

I'm creating these GridView components programmatically in server-side (cs file)- it has to be flexible – 1 GridView and sometimes 10 GridView components.

The problem occurs when I'm trying to add pagination – whenever the user clicks the "next" page, the whole page is getting refreshed because of a postBack and I'm loosing all my data and the page returns Blank/Empty.

I used PlaceHolder to hold the GridView components, while searching for a solution, I found UpdatePanel as a better alternative – as far as I understand the page can be partially refreshed – which means that only the UpdatePanel has to be refreshed…but it doesn't work.

The following code sample is my TEST, the UpdatePanel is the only component initiated in the client side (.aspx page), the rest initiated programmatically in .cs .

how can I solve the issue described above?

Why does the whole page is getting refreshed and I'm loosing my data?
can you recommend another way? can provide me with any code sample?

If I'm not rebuilding the GridView, it doesn't work…

Here is my Default.aspx.cs

public partial class TestAjaxForm : System.Web.UI.Page
{
    DataTable table;
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
            bindGridView();
    }

    public void bindGridView()
    {

        GridView gridView1 = new GridView();
        gridView1.AutoGenerateColumns = true;

        gridView1.PageSize = 2;
        gridView1.AllowPaging = true;
        gridView1.PagerSettings.Mode = PagerButtons.Numeric;
        gridView1.PagerSettings.Position = PagerPosition.Bottom;
        gridView1.PagerSettings.PageButtonCount = 10;
        gridView1.PageIndexChanging += new GridViewPageEventHandler(this.GridView1_PageIndexChanging);

        table = new DataTable();
        table.Columns.Add("FirstName");
        table.Columns.Add("LastName");

        DataRow row = table.NewRow();
        row["FirstName"] = "John";
        row["LastName"] = "Johnoson";
        table.Rows.Add(row);

        row = table.NewRow();
        row["FirstName"] = "Johnny";
        row["LastName"] = "Marley";
        table.Rows.Add(row);

        row = table.NewRow();
        row["FirstName"] = "Kate";
        row["LastName"] = "Li";
        table.Rows.Add(row);

        panel.ContentTemplateContainer.Controls.Add(gridView1);

        gridView1.DataSource = table;
        gridView1.DataBind();

    }

    protected void GridView1_PageIndexChanging(object sender, GridViewPageEventArgs e)
    {
        GridView gridView1 = (GridView)sender;
        gridView1.PageIndex = e.NewPageIndex;
        gridView1.DataSource = table;
        gridView1.DataBind();
    }
}

Thank you.

Best Answer

If you want a custom GridView approach to work, you have to recreate and rebind the grid on every page load... that's the problem with dynamic Grids... Dynamic controls don't retain their viewstate, but if you added the grid and dynamically generated the columns, that would work easier for you (because I think it may dynamically remember the columns, or you can set AutoGenerateColumns to true, and it brings in your data row column names).

HTH

Related Topic