Skip to main content

    ToggleButtonGroup

    ToggleButtonGroup allows users to trigger actions or events with a single click anywhere within the button container. Users can also trigger a button by pressing Enter or Space while the button has focus.

    OverviewPropertiesUsage

    ToggleButtonGroup vs. Tabs​

    An example of a ToggleButtonGroup component next to a Tab component. An example of a ToggleButtonGroup component next to a Tab component.

    ToggleButtonGroup​

    • Use ToggleButtonGroups for closely related choices that control certain parts of a view. You can only select one option at a time.
    • Selecting one of the choices usually affects existing content, for example, by filtering it or changing the visual appearance, such as switching from list view to grid view.
    • Use ToggleButtonGroups for a maximum of about five choices. If more are available, consider using a Select.
    • Never use ToggleButtonGroups for navigational purposes. Instead, use Tabs.

    Tabs​

    • Use Tabs to organize content and for navigational purposes within a view or context. Only one tab can be active at a time.
    • Selecting one of the tabs always replaces the entire content in the tab's content area.
    Still have questions?
    Find answers in the Dynatrace Community