ajaxjqgridtabcontainer

jqGrid in tab is disappearing after tab change in ajax tab container


I'm using Ajax tabcontainer with jqGrid.

I have two tabs. jqGrid of tab1 is loaded when the aspx page is loaded. For tab2, the button click event will change the activetabindex to 1, and then load the data

But now when I click back on tab1, the tab opens but the jqGrid disappears.

Is there any solution to get rid of this problem

<asp:TabContainer ID="TabContainer1" runat="server" ActiveTabIndex="0">
                        <asp:TabPanel ID="TabPanel1" runat="server" HeaderText="This is first tab">
                            <ContentTemplate>
                                <table>
                                    <tr>
                                        <td>
                                            <asp:LinkButton ID="LinkButton4"runat="server"
                                                            Text='Load data for tab2'
                                                            OnClick="btnLoadDataForTab2_Click"/>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            <table id="tblTab1"></table>
                                        </td>
                                    </tr>
                                </table>
                            </ContentTemplate>
                        </asp:TabPanel>
                        <asp:TabPanel ID="TabPanel2" runat="server" HeaderText="This is second tab">
                            <ContentTemplate>
                                <table>
                                    <tr>
                                        <td>
                                            <table id="tblTab2"></table>
                                        </td>
                                    </tr>
                                </table>
                            </ContentTemplate>
                        </asp:TabPanel>
                    </asp:TabContainer>

Solution

  • You have to initialize JQGrid again on your activeTabChange event. Also, make autoPostBack= true of TabContainer.