Opening Multiple Panes Simultaneously
In This Topic
The WijAccordion control allows you to open the multiple panes at once.
When the RequireOpenedPane property is set to True, clicking a header will close the currently opened pane, leaving the remaining panes closed. When the RequireOpenedPane property is set to False, clicking a header will not close the currently opened panes.
- Create an ASP.NET Web application with a ScriptManager control and install Juice UI and the Wijmo Juice libraries to your project via NuGet.
- While in Design view of your Web application, navigate to the Visual Studio Toolbox and double-click the Panel control to add a panel to the main content of your page.
- Add some content to the panel within the <asp:Panel> tags. For example:
<asp:Panel ID="Panel1" runat="server">
<h3>Pane 1</h3>
<div>
<p>
Pane 1 content here.
</p>
</div>
<h3>Pane 2</h3>
<div>
<p>
Pane 2 content here.
</p>
</div>
<h3>
Pane 3</h3>
<div>
<p>
Pane 3 content here.
</p>
</div>
<h3>
Pane 4</h3>
<div>
<p>
Pane 4content here.
</p>
</div>
</asp:Panel>
- Use the following markup to add a WijAccordion control to the page and set the TargetControlID to Panel1.
<cc1:WijAccordion ID="Panel1_WijAccordion" runat="server"
TargetControlID="Panel1">
</cc1:WijAccordion>
- Select View | Properties Window in the Visual Studio menu.
- Click the drop-down list at the top of the Properties window and select Panel1_WijAccordion.
- Set the RequireOpenedPane property to False. When your run the applicationand click each pane header, the opened panes will not close.