Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -4,43 +4,100 @@ uid: DashboardDropdown

# Dropdown

This basic control allows the user to select an item in a dropdown list. The selectable items can be based on any data.
This basic control allows you to **select an item in a dropdown list**. The selectable items can be based on any data.

This component is typically used to let users interact with a dashboard or low-code app by selecting a value that influences what is shown elsewhere. For example, a dropdown can be used to filter data in other components, switch between different data sets, or focus on a specific element, protocol, or status. This makes it easier to explore large amounts of data and quickly find the information that is most relevant.

![Dropdown](~/dataminer/images/Dropdown.png)<br>*Dropdown component in DataMiner 10.4.6*

> [!NOTE]
> Prior to DataMiner 10.3.5/10.4.0<!-- RN 35902 -->, this component is available under *Feeds*.

To configure the component:
## Data source behavior

The way items are listed in the dropdown depends on the type and number of data sources applied:

- Built-in data sources (such as *Elements* or *Protocols*):

- When you apply a single data source, the dropdown lists the individual items from each data source.

- If multiple data sources are applied, the items are grouped per data source in the dropdown list. For example, element items may be listed first, followed by a *Protocols* heading and the protocol items.

- Query and *Tables* data sources:

- When you apply a single query data source or *Tables* data source, the dropdown lists the individual rows from that query or table. As a result, each row becomes a selectable item in the dropdown.

> [!NOTE]
> Prior to DataMiner 10.3.0 [CU13]/10.4.0 [CU1]/10.4.4<!--RN 38811-->, when you apply a single query data source, the query itself is listed as data.

- When you apply multiple query data sources or *Tables* data sources, the dropdown instead lists the queries or tables themselves.

## Using a dropdown to filter data in other components

A dropdown component can be used as a dynamic filter input for other components in your dashboard or low-code app. This allows you to refine the displayed data based on a selected value.

A common use case is filtering the results of a query shown in a [table component](xref:DashboardTable). Since a table displays query results row by row, it is well suited for scenarios where users need to focus on a subset of a larger dataset.

![Dropdown used to filter table component](~/dataminer/images/DropDown.gif)<br>*Dropdown and table components in DataMiner 10.6.6*

In the example above, a table displays a list of support tickets. A dropdown component is used to filter the table based on the selected ticket status.

1. Apply the necessary data. See [Adding data to a component](xref:Adding_data_to_component).
To obtain a result similar to this:

> [!NOTE]
>
> - From DataMiner 10.3.0 [CU13]/10.4.0 [CU1]/10.4.4 onwards<!--RN 38811-->, when you apply a single query data source or *Tables* data source, individual rows from that query or table are listed instead of the query or table itself. Additionally, if you want to use this dropdown component as data, the entry will be listed as *Tables* or *Query rows* in the *Data* pane (depending on your DataMiner version<!--RN 41075-->). When you apply multiple query data sources or *Tables* data sources, the queries or tables themselves are listed as data. Prior to DataMiner 10.3.0 [CU13]/10.4.0 [CU1]/10.4.4, when you apply a single query data source, the query itself is listed as data. If you use this dropdown component as data, the entry will be listed as *Queries* in the *Data* pane.
> - You can use the *Tables* data source for this component from DataMiner 10.3.0 [CU21]/10.4.0 [CU9]/10.4.12 onwards.<!--RN 41161-->
1. In the *Data* pane, locate the query used as the data source for the component you want to filter.

1. Optionally, fine-tune the component layout. In the *Component* > *Layout* pane, the following options are available:
1. Click the pencil icon to edit the query.

- The default options available for all components. See [Customizing the component layout](xref:Customize_Component_Layout).
1. Click *Select operator* and select *Filter*.

- *Display column*: Available from DataMiner 10.3.0 [CU13]/10.4.0 [CU1]/10.4.4 onwards<!--RN 38811-->. Allows you to select a column that should be picked to display the name of an item in the dropdown box. This setting is only available when a single query data source or *Tables* component data source was applied.
1. Select the column you want to filter.

1. Set the filter method to *Equals* or *Contains*.

1. On the right side of the *Value* box, click the ![Link to](~/dataminer/images/Link_to_Data.png) icon to open the *Link to* dialog.

1. Configure the following settings:

- *Data*: Select the dropdown component.

- *Property*: Select the column that contains the value to filter on.

- *Type*: `Tables`.

- *Empty data shows*: Define what happens when no value is selected in the dropdown:

- *Everything*: Display all data.

- *Nothing*: Display no data.

1. Click *Apply*.

1. Click the pencil icon again to stop editing the query.

> [!NOTE]
> The *Tables* data source (used here to link dropdown values to other components) is available from DataMiner 10.3.0 [CU21]/10.4.0 [CU9]/10.4.12 onwards<!--RN 41161-->.

- *Label*: Allows you to specify text that should be displayed next to the dropdown box.
## Configuration options

1. Optionally, customize the following component options in the *Component* > *Settings* pane:
### Dropdown layout

- *WebSocket settings*: Allows you to customize the polling interval for this component. To do so, clear the checkbox in this section and specify the custom polling interval.
In the *Layout* pane, you can find the default options available for all components. See [Customizing the component layout](xref:Customize_Component_Layout).

- *Initial Selection > Select first item by default*: Available from DataMiner 10.3.0 [CU13]/10.4.0 [CU1]/10.4.4 onwards<!--RN 38775-->. Sets the first item as the value that will be applied in the data when the dashboard is opened, unless a custom URL is used specifying a different value. This setting is enabled by default.
Additionally, the following layout options are also available:

- *Initial Selection > Select item by default*: Allows you to specify a default value. This is the value that will be applied in the data when the dashboard is opened, unless a custom URL is used specifying a different value. From DataMiner 10.3.0 [CU13]/10.4.0 [CU1]/10.4.4 onwards<!--RN 38775-->, this setting is only available when the *Select first item by default* setting is disabled.
| Section | Option | Description |
|--|--|--|
| Advanced | Display column | Available from DataMiner 10.3.0 [CU13]/10.4.0 [CU1]/10.4.4 onwards<!--RN 38811-->. Select which column is used to display as the display value in the dropdown. Only available when a single query data source or *Tables* component data source was applied. |
| Advanced | Label | Add text that will be displayed next to the dropdown. |

> [!NOTE]
>
> - Prior to DataMiner 10.3.0 [CU13]/10.4.0 [CU1]/10.4.4<!--RN 38775-->, this setting is called *Initial Selection* instead.
> - Prior to DataMiner 10.3.6/10.4.0<!-- RN 35984 -->, this setting is called *Feed Defaults* instead.
### Dropdown settings

- *Clear selection*: Available from DataMiner 10.3.0 [CU13]/10.4.0 [CU1]/10.4.4 onwards<!--RN 38758-->. Allows you to clear the selected values in the component by clicking the X button in the upper-right corner of the filter box. This setting is disabled by default.
In the *Settings* pane for this component, you can customize its behavior to suit your requirements.

- *Data retrieval > Update data*: Available from DataMiner 10.3.0 [CU13]/10.4.0 [CU1]/10.4.4 onwards<!--RN 38811-->. Allows the values displayed in the component to be updated in real time, if the data supports this (see [Query updates](xref:Query_updates)). This setting is only available when a single query data source or an indices dataset was applied. This setting is disabled by default.
| Section | Option | Description |
|--|--|--|
| WebSocket settings | Inherit WebSocket settings from page/panel | Clear the checkbox to use a custom polling interval for this component. When cleared, you can specify a different polling interval (in seconds). |
| Initial selection | Select first item by default | Available from DataMiner 10.3.0 [CU13]/10.4.0 [CU1]/10.4.4 onwards<!--RN 38775-->. When enabled, the first item is automatically selected when the data in the dropdown is refreshed, unless a custom URL is used specifying a different value. This setting is enabled by default. |
| Initial Selection | Select item by default, or<br>Initial Selection (Prior to DataMiner 10.3.0 [CU13]/10.4.0 [CU1]/10.4.4<!--RN 38775-->), or <br>Feed Defaults (Prior to DataMiner 10.3.6/10.4.0<!--RN 35984-->) | Specify a fixed default value, which is automatically selected when the data in the dropdown is refreshed, unless a custom URL is used specifying a different value. From DataMiner 10.3.0 [CU13]/10.4.0 [CU1]/10.4.4 onwards<!--RN 38775-->, this setting is only available when the *Select first item by default* setting is disabled. |
| Data retrieval | Update data | Available from DataMiner 10.3.0 [CU13]/10.4.0 [CU1]/10.4.4 onwards<!--RN 38811-->. Toggle the switch to determine whether the values displayed in the component should be updated automatically (provided this is supported by the data source). See [Query updates](xref:Query_updates)<!--RN 37269-->. This setting is only available when a single query data source or an indices dataset was applied. This setting is disabled by default. |
| Clear selection | Allow clearing the selection | Available from DataMiner 10.3.0 [CU13]/10.4.0 [CU1]/10.4.4 onwards<!--RN 38758-->. Toggle the switch to determine whether the selected values in the component can be cleared by clicking the X button in the upper-right corner of the filter box. This setting is disabled by default. |
Binary file added dataminer/images/DropDown.gif
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading