Skip to content Skip to sidebar Skip to footer

Keep JQuery Accordion Open After Refresh

I made an asp.net web site in which i put a jquery accordion. My Problem is that after a postback or a refresh, the current accordion pane closes and the page resets every things.

Solution 1:

The problem you are facing is because after postback asp.net refreshes the whole page. Solutions for that would be:

  1. Use UpdatePanel for the places you want to update http://msdn.microsoft.com/en-us/library/system.web.ui.updatepanel(v=vs.110).aspx that will prevent the PostBack from refreshing your page
  2. Include information in the postback which accordion is currently open and open it
    • either from asp.net backend
    • or from javascript with ClientScriptManager.RegisterStartupScript(this.GetType(), "AKey", "MyFunction('paramToOpenTab');", true);

Solution 2:

Thanks it workes with UpdatePanel; This is the solution :

 <div id="accordion-1" class="accordion-section-content">
                 <asp:ScriptManager EnablePartialRendering="true" ID="ScriptManager1" runat="server"></asp:ScriptManager>
                 <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
                 <ContentTemplate>
                <table style="width:100%; height: 600px;" border="1">
                <tr>
                <td></td>
                <td><asp:Button ID="btnChercher" runat="server" Text="Chercher" onclick="btn_Chercher"></asp:Button></td>
                </tr>
            <tr>
                <td>
                 Test 1</td>
                <td>
                     <asp:Chart ID="ChartDate" runat=server>
                  <Legends>
                <asp:Legend Alignment="Center" Docking="Top" IsTextAutoFit="False" Name="Default" LegendStyle="Row" />
            </Legends>
                  <Series>
                  <asp:Series Name="Nombre documents"></asp:Series>
                  </Series>
                  <ChartAreas><asp:ChartArea Name="ChartArea1"></asp:ChartArea></ChartAreas>
                  </asp:Chart></td>
            </tr>
            <tr>
                <td>
                    Test 3</td>
                <td>
                     <asp:Chart ID="ChartEtat" runat=server>
                  <Legends>
                <asp:Legend Alignment="Center" Docking="Top" IsTextAutoFit="False" Name="Default" LegendStyle="Row" />
            </Legends>
                  <Series>
                  <asp:Series Name="Etat"></asp:Series>
                  </Series>
                  <ChartAreas><asp:ChartArea Name="ChartAreaHlm"></asp:ChartArea></ChartAreas>
                  </asp:Chart></td>
            </tr>
            <tr>
                <td>
                    Test 5</td>
                <td>
                     <asp:Chart ID="ChartFormulaire" runat=server>
                  <Legends>
                <asp:Legend Alignment="Center" Docking="Top" IsTextAutoFit="False" Name="Default" LegendStyle="Row" />
            </Legends>
                  <Series>
                  <asp:Series Name="Formulaire"></asp:Series>
                  </Series>
                  <ChartAreas><asp:ChartArea Name="ChartAreaFormulaire"></asp:ChartArea></ChartAreas>
                  </asp:Chart></td>
            </tr>
        </table>
        </ContentTemplate>
        </asp:UpdatePanel>
                </div> 

Thank you n0mercy


Post a Comment for "Keep JQuery Accordion Open After Refresh"