In order to create an AJAX accordion, use the AJAX Accordion Wizard. The accordion content can be inline or external (from other files). The inline accordion works in plain HTML pages as well.
The AJAX Accordion Wizard is accessible from the MX AJAX Toolbox tab of the Insert bar (or MX AJAX Toolbox menu item from the Insert menu):
Note: An AJAX accordion with external content can also be created with the AJAX Accordion From File server behavior, accessed from the Application panel, Server Behaviors -> + -> MX AJAX Toolbox.
The AJAX Accordion Wizard has two steps.
Configure the first step of the AJAX Accordion Wizard as shown below:
In the Accordion name text box enter a name for the accordion, used to identify it later on. It should start with a letter or an underscore, and it should contain only alphanumeric characters.
Note: It is recommended that you leave the default suggestion, accordion1, unless you really want to name your accordion in a certain way. If you leave it like that and then add a new accordion in page, the new name suggestion will be accordion2, and so on (accordion3, accordion4, etc.).
In the Accordion width text box enter the accordion width, in pixels. In browser, 2 more pixels will be added, corresponding to the left and right borders.
In the Accordion height text box enter the accordion height, in pixels. It includes both the title bars and the content area. In browser, 3 more pixels will be added, corresponding to the top, intermediate, and bottom borders.
Note: When you set the dimensions for the accordion, have in mind the title lengths of its regions and the content that you will display for each (so that its surface will be as well covered as possible). However, if the content is larger than the reserved area, vertical and horizontal scroll bars will be automatically generated, as needed.
In the Accordion type drop-down menu select the type of the accordion content:
Inline content - content will be manually entered in the current file, for each of the accordion regions.
External file content - content is retrieved from another site file, for each of the accordion regions. Whenever you modify these source files, content will be updated in the accordion.
The buttons in the lower part of the interface (they appear on both steps of the wizard) offer the next functionalities:
With the < Back/Next > buttons you can navigate through the wizard's steps.
Click Finish to apply the wizard, when you are done configuring it.
Click Cancel to exit without the new settings to be applied.
The Help button brings you to this help page.
Click Next to continue configuring the wizard.
Configure the second step of the AJAX Accordion Wizard as shown below:
When you launch the wizard, the Accordion regions grid is empty and the interface controls below it are disabled. The four buttons above the grid allow you to perform the following operations:
To add an accordion region, click the Plus (+) button. In the dialog box that pops-up, enter a title for the accordion region you are adding:
To remove an accordion region previously added, select it in the grid and click the Minus (-) button.
To change the accordion regions order and move a region above others, select it in the grid and use the up arrow button.
To change the accordion regions order and move a region below others, select it in the grid and use the down arrow button.
In the Title text box the title of the current accordion region is displayed (you previously entered it in the dialog box that popped-up). You can alter it if you want to. Check out the browser behavior to understand better what accordion regions are and where their title is displayed.
The blue lightning button (InterAKT Dynamic Data) on the right is only displayed when you select the External file content option in the Accordion type drop-down menu, in the first step of the wizard. Use it if you want to retrieve dynamic data.
The Filename text box is also displayed only when the accordion regions content is retrieved from external files. Enter the name of the file (and site-relative path, if necessary) that stores the content for the current accordion region. You can use the Browse button to locate the file in the site structure, or the InterAKT Dynamic Data button to retrieve dynamic data.
If the file does not exist yet, you can enter its "future" name, and the file will be automatically generated in the site structure once you apply the wizard.