# Collapse Menu

Collapse menus are typically used for navigation to different pages or sections.

A collapse menu contains 3 parts:

1. Title container
2. Arrow icon to collapse and expand the menu (on the right)
3. Menu content

<figure><img src="/files/QBupiDwUfDbVktCYKUTT" alt=""><figcaption></figcaption></figure>

You can customize all three parts. For example, in menu content, you can add a [Clickable](/app-builder/app-construction/elements/web-elements/clickable.md) with [Text](/app-builder/app-construction/elements/web-elements/text.md) inside, and set an interaction on the clickable to navigate to a different page.

## Properties

<figure><img src="/files/fsGu3yM4CtY61B5wxASO" alt=""><figcaption></figcaption></figure>

**Group ID:** If you have multiple collapse menus, group them together by Group ID. To group elements, give them the same ID.

**Single Collapse:** If you have grouped collapsed menus by Group ID, turning on Single Collapse ensures that only one collapse menu will be open at a time.

**Default Expand:** When on, the collapse menu will be expanded by default.

See [Tooltip](/app-builder/app-construction/elements/tooltip.md) for tooltip configurations.

## Supported Events

**Toggle menu:** Triggered when user toggles the menu arrow.

## Supported Actions

**Set Data:** Change element data. See [Data Store](/app-builder/app-construction/data-store.md).

**Set Loading:** Set loading animation. See [Set loading animations](/app-builder/popular-use-cases/set-loading-animations.md).

{% hint style="info" %}
Visit [Interactions](/app-builder/app-construction/interactions.md) for more on events and actions.
{% endhint %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.acho.io/app-builder/app-construction/elements/web-elements/collapse-menu.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
