I Did It! Successfully Running GridView's in Ajax Update Panels (Add Postback To GridView Pager Buttons)

OK. I've been having a really difficult time adding an ASP.NET GridView to AJAX modal popups and clicking the GridView's pager buttons.

Here's the hierarchy of ASP.NET objects:

ASPX -> Control -> UpdatePanel -> Gridview (with paging buttons)

Here's my GridView's settings:

<asp:UpdatePanel ID="Panel1" runat="server" >       

    <ContentTemplate>
<asp:gridview     id="gvVideos"
                  runat="server"
                  AllowPaging="True"
                  AutoGenerateColumns="False"                  
                  ShowFooter="true" ShowHeader="true"
                  BorderStyle="None" BorderWidth="0px"                 
                  PageSize="1"
                  OnRowDataBound="DataBinding_gvVideos"
                  OnPageIndexChanged="PageIndexChanged_gvVideos"
                  OnPageIndexChanging="PageIndexChanging_gvVideos" >
...
</ContentTemplate>
</asp:UpdatePanel>

With standard coding and no postback code or triggers, you click the pager button and nothing occurs - no errors, no postback, nothing!

So, then I read that I had to a add postback trigger to the gridview in order for this to work.

So, in my control's update panel, I tried the following (didn't work):
<Triggers>
    <asp : PostBackTrigger ControlID="gvVideos" />
</Triggers>

<Triggers>
    <asp:AsyncPostBackTrigger ControlID="gvVideos" />
</Triggers>
Error:
<Triggers>
    <asp:AsyncPostBackTrigger ControlID="gvVideos" EventName="OnPageIndexChanging" />
</Triggers>

Error:
<Triggers>
    <asp:AsyncPostBackTrigger ControlID="gvVideos" EventName="PageIndexChanging_gvVideos" />
</Triggers>

I realized the code above didn't work since I needed to put a trigger on the actual pager button not the GridView. So, since the pager button is dynamicly generated when the GridView is bound with data, then adding trigger code in the ASPX page (like the code above) doesn't work. This needs to be done dynamically.

Programtically adding a post back trigger:
AsyncPostBackTrigger ap = new AsyncPostBackTrigger();
ap.ControlID = btnPager.UniqueID;
ap.EventName = "Click"; //may or may not be needed
UpdatePanel.Triggers.Add(ap);
The code above may have worked, but after 8 hours over 3 days of finding a solution, I became exhausted.

Instead I am programatically handling the button's "OnClientClick" event.

I created a custom method inside the user control named LetClientButtonRunServerCall(UpdatePanel Panel1).

Page Load of control containing gridview:
LetClientButtonRunServerCall(UpdatePanel1);
In LetClientButtonRunServerCall:
string arg                              = "Page$" + btnPager.Text;
btnPager.OnClientClick     = "javascript:__doPostBack('"+gvVideos.UniqueID+"','"+arg+"')";

The approach described above with my custom method, WORKED!

Here's the method's actual code:

/// <summary>
/// Add Postback To GridView Pager Buttons
/// </summary>
/// <param name="GridView"></param>
public void LetClientButtonRunServerCall(GridView GridView)
        {
            if (GridView != null)
            {
                GridViewRow pagerRow = GridView.TopPagerRow;
                if (pagerRow != null)
                {
                    foreach (Control ctrl in pagerRow.Cells[0].Controls)
                    {
                        string id = ctrl.ID;
                        foreach (Control ctrlx in ctrl.Controls)
                        {
                            string x = ctrlx.ID;
                            foreach (Control ctrly in ctrlx.Controls)
                            {
                                System.Web.UI.WebControls.TableCell curPagerButton = (System.Web.UI.WebControls.TableCell)ctrly;
                                int count = curPagerButton.Controls.Count;
                                foreach (Control ctrlz in ctrly.Controls)
                                {
                                    string xxx = ctrlz.UniqueID;
                                    if (ctrlz is Label)
                                    {
                                    }
                                    else
                                    {
                                        if (ctrlz is LinkButton)
                                        {
                                            LinkButton btnPager = (LinkButton)ctrlz;
                                            string arg = "Page$" + btnPager.Text;
                                            btnPager.OnClientClick = "javascript:__doPostBack('" + GridView.UniqueID + "','" + arg + "')";
                                            //produces:
                                            //btnPager.OnClientClick = "javascript:__doPostBack('ctl00$cpSkyContent$UCPerformance$TabContainer1$TabPanel3$UCVideos$gvVideos','Page$2')";
                                        }
                                    }
                                }
                            }
                        }
                    }
                } //end of if pager row
            } //end of if gridview null

            //if (UpdatePanel != null)
            //{
            //    GridView gvVideos = (GridView)UpdatePanel.FindControl("gvVideos");
               
            //} //end of if update panel not null
       }
To have this work on godaddy...after 3 hours of research...

<Triggers>
    <aspostBackTrigger ControlID="gvVideos" />
</Triggers>

Signing Off,
Vivian
 

What did you think of this article?




Trackbacks
  • No trackbacks exist for this post.
Comments
  • No comments exist for this post.
Leave a comment

Submitted comments are subject to moderation before being displayed.

 Name (required)

 Email (will not be published) (required)

Your comment is 0 characters limited to 3000 characters.