Question

Thanks for viewing this.

Background - There is a Share Point 2013 Visual Web Part, in our project. It's having 4 nested GridViews together. On click of one Image button 3 grids will get expand. Population is also coded on click of that image button. But, since there is apost back happening, page is blinking and all grids are getting Shrink. So, I decided to keep one update panel on top of these grids' inside 2nd Grids's item template.

Issue - After placing it there, I am able to stop the page blink. It's no more getting post back, on click of the said image button. But, Grids are not being displayed. at all. I chcecked whether I am getting data, by commenting the update panel. Yes, I am getting data. It's displaying. But, once turned on the Update Panel, again Grids are not showing any more.

My ASPX -

<asp:gridview runat="server" id="gvParent" width="98%" bordercolor="#00ABA4"
                        horizontalalign="Center" borderstyle="Solid" rowstyle-horizontalalign="Center"
                        selectedrowstyle-verticalalign="Middle"
                        autogeneratecolumns="False" datakeynames="Staff ID" emptydatatext="No Record Found!"
                        borderwidth="1px" allowpaging="True" pagesize="5" OnRowDataBound="gvParent_RowDataBound" OnRowCreated="gvParent_RowCreated" >

                        <Columns>
                            <asp:TemplateField>
                                         <ItemTemplate>
                                           <img alt="" style="cursor: pointer" src="../../_layouts/15/images/eTRAMS_img/plus.gif" />
                                              <asp:Panel ID="PnlClassification" runat="server" Style="display: none">

                                                         <asp:GridView ID="gvClassification" runat="server" AutoGenerateColumns="false" CssClass="ChildGrid" Width="100%" 
                                                     HeaderStyle-HorizontalAlign="Left">
                                                     <Columns>
                                                        <asp:TemplateField HeaderStyle-HorizontalAlign="Left">
                                                             <ItemTemplate>
                                                                  <asp:ImageButton ID="ImgClassification" runat="server" ImageUrl="../../_layouts/15/images/eTRAMS_img/plus.gif"
                                                                      CommandArgument='<%# Eval("HistoryClassification") %>'></asp:ImageButton>

                                                                 <%--child Gridview--%>
                                                                 <asp:UpdatePanel ID="UpdatePanel1" ChildrenAsTriggers="false" runat="server" UpdateMode="Always">
                                                                            <ContentTemplate>
                                                                    <asp:Panel ID="pnlCurrent" runat="server" Style="display:none;">

                                                                                 <asp:GridView ID="gvCurrent" runat="server" AutoGenerateColumns="false" CssClass="ChildGrid" Width="100%"
                                                                        HeaderStyle-HorizontalAlign="Left" DataKeyNames="TrainingName">
                                                                        <Columns>
                                                                            <asp:TemplateField HeaderText="No.">
                                                                                <ItemTemplate>
                                                                                    <asp:Label ID="Label1" runat="server"></asp:Label>
                                                                                </ItemTemplate>
                                                                            </asp:TemplateField>
                                                                            <asp:BoundField DataField="TrainingName" HeaderText="Training Title" />
                                                                            <asp:BoundField DataField="LastTrainingAttendedFrom" HeaderText="Attended Date From" />
                                                                            <asp:BoundField DataField="LastTrainingAttendedTo" HeaderText="Attended Date To" />
                                                                            <asp:BoundField DataField="Refresher" HeaderText="Remark" />
                                                                        </Columns>
                                                               </asp:GridView>                                                                               
                                                                    </asp:Panel>


                                                                    <asp:Panel ID="PnlOthers" runat="server" Style="display:none;">

                                                                                <asp:GridView ID="gvOthers" runat="server" AutoGenerateColumns="false" 
                                                                                    CssClass="ChildGrid" Width="100%" HeaderStyle-HorizontalAlign="Left" 
                                                                                    DataKeyNames="TrainingName">
                                                                        <Columns>
                                                                            <asp:TemplateField HeaderText="No.">
                                                                                <ItemTemplate>
                                                                                    <asp:Label ID="Label2" runat="server"></asp:Label>
                                                                                </ItemTemplate>
                                                                            </asp:TemplateField>
                                                                            <asp:BoundField DataField="TrainingName" HeaderText="Training Title" />
                                                                            <asp:BoundField DataField="LastTrainingAttendedFrom" HeaderText="Attended Date From" />
                                                                            <asp:BoundField DataField="LastTrainingAttendedTo" HeaderText="Attended Date To" />
                                                                        </Columns>
                                                               </asp:GridView>
                                                                        </asp:Panel>
                                                                            </ContentTemplate>
                                                                            <Triggers>
                                                                                <%--<asp:AsyncPostBackTrigger ControlID="ImgClassification" EventName="Click" />--%>
                                                                            </Triggers>
                                                                            </asp:UpdatePanel>


                                                                 <asp:Label ID="lblClassification" runat="server" Text='<%# Eval("HistoryClassification") %>' CommandName="Select"></asp:Label>

                                                             </ItemTemplate>
                                                         </asp:TemplateField>
                                                    </Columns>
                                                 </asp:GridView>                                                        
                                             </asp:Panel>
                                         </ItemTemplate>
                                         <ItemStyle Width="20px" />
                            </asp:TemplateField>
                            <asp:TemplateField HeaderText="No.">
                                <ItemTemplate>
                                    <asp:Label ID="Label4" runat="server"></asp:Label>
                                </ItemTemplate>
                            </asp:TemplateField>
                            <asp:BoundField DataField="Staff Name" HeaderText="Staff Name" />
                            <asp:BoundField DataField="Staff ID" HeaderText="Staff Number" />
                            <asp:BoundField DataField="Position Code" HeaderText="Position Code" />
                            <asp:BoundField DataField="Position Title" HeaderText="Position Name" />
                            <asp:BoundField DataField="Division" HeaderText="Division" />
                            <asp:BoundField DataField="Department" HeaderText="Department" />
                            <asp:BoundField DataField="Section" HeaderText="Section" />


                        </Columns>

                    </asp:gridview>

Code Behind -

protected override void OnInit(EventArgs e)
    {
        base.OnInit(e);
        InitializeControl();
        ScriptManager.GetCurrent(this.Page).RegisterAsyncPostBackControl(gvParent);
    }

private void ImgClassification_Click(object sender, ImageClickEventArgs e) { ImageButton ImgClassification = (sender as ImageButton); GridViewRow row = (ImgClassification.NamingContainer as GridViewRow); if (ImgClassification.CommandArgument == "Current") { row.FindControl("pnlCurrent").Visible = true; ImgClassification.ImageUrl = "../../_layouts/15/images/eTRAMS_img/minus.jpg"; GridView gvCurrent = row.FindControl("gvCurrent") as GridView; string strPast = ImgClassification.CommandArgument; getCurrentHistory(strPast, gvCurrent);

            UpdatePanel updtPnlPast = row.FindControl("UpdatePanel1") as UpdatePanel;
            updtPnlPast.Update();
        }

        if(ImgClassification.CommandArgument == "Past")
        {
            row.FindControl("PnlOthers").Visible = true;
            ImgClassification.ImageUrl = "../../_layouts/15/images/eTRAMS_img/minus.jpg";
            GridView gvOthers = row.FindControl("gvOthers") as GridView;
            string strPast = ImgClassification.CommandArgument;
            getJoinQuery(strPast, gvOthers);

            UpdatePanel updtPnlPast = row.FindControl("UpdatePanel1") as UpdatePanel;
            updtPnlPast.Update();
        }

        if (ImgClassification.CommandArgument == "Others")
        {
            row.FindControl("PnlOthers").Visible = true;
            ImgClassification.ImageUrl = "../../_layouts/15/images/eTRAMS_img/minus.jpg";
            GridView gvOthers = row.FindControl("gvOthers") as GridView;
            string strPast = ImgClassification.CommandArgument;
            getJoinQuery(strPast, gvOthers);

            UpdatePanel updtPnlPast = row.FindControl("UpdatePanel1") as UpdatePanel;
            updtPnlPast.Update();

        }
    }

I have tried as many things as I could have, but no fruits out of it. Can you please figure out, what I am missing here? Which is stopping the display of the grid.

Was it helpful?

Solution

Finally I found there are certain complexity limit, which can be handled by UpDatePanel, not beyond that. For my scenario it was quite deeply nested matter so I couldn't achieve with it. Finally I turned towards JQuery approach to reach my goal, which is working quite nice for me.

Thanks every one of you for your support and suggestions.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top