Skip to main content

FilterBar

Use the FilterBar to filter a set of data based on one or several criteria determined by the user. The component allows you to add various form elements as filter controls.

FilterBarProps

Signature:

export declare type FilterBarProps = ( | ) & ;

FilterBar.Item

You can use the FilterBar.Item component to render an item inside the FilterBar, as shown above.

FilterBarItemProps

extends,
NameTypeDefaultDescription
name
-

A unique identifier for this sub-filter (must only be unique for this filter). In case custom labels are used without text children, this is displayed on the MoreMenu trigger instead.

label
-

Description text of this sub-filter. If you use a custom label without text children, the name will be displayed on the MoreMenu instead.

children
-

Only one element, is expected here.

showLabel?
-

Defines if the label is shown for the filter item. If set specifically, it also overwrites the general configuration set with the showLabels prop on the FilterBar for one item.

FilterBar.ResetButton

You can use the FilterBar.ResetButton component to render a button that resets all filters, as shown above.

ResetButtonProps

extends, , ,
NameTypeDefaultDescription
onClick
() =>
-

Handler that is called when the ResetButton is clicked.

Still have questions?
Find answers in the Dynatrace Community