Dropdown requires a value to bind, optionLabel and a collection of options. How to define the options property; Providing an array of arbitrary objects along with the optionLabel property to specify the field name of the option.
+Dropdown requires a value to bind and a collection of arbitrary objects along with the optionLabel property to specify the field name of the option.
| Name | -Type | -Default | -Description | -
|---|---|---|---|
| Name | +Type | +Default | +Description | +
| value | -any | -null | -Value of the component. | -
| options | -array | -null | -An array of selectitems to display as the available options. | -
| optionLabel | -string | -null | -Name of the label field of an option when an arbitrary objects instead of SelectItems are used as options. | -
| scrollHeight | -string | -200px | -Height of the viewport in pixels, a scrollbar is defined if height of list exceeds this value. | -
| filter | -boolean | -false | -When specified, displays an input field to filter the items on keyup. | -
| filterPlaceholder | -string | -null | -Placeholder text to show when filter input is empty. | -
| editable | -boolean | -false | -When present, custom value instead of predefined options can be entered using the editable input field. | -
| placeholder | -string | -null | -Default text to display when no option is selected. | -
| disabled | -boolean | -false | -When present, it specifies that the component should be disabled. | -
| dataKey | -string | -null | -A property to uniquely match the value in options for better performance. | -
| showClear | -boolean | -false | -When enabled, a clear icon is displayed to clear the value. | -
| tabindex | -number | -null | -Index of the element in tabbing order. | -
| optionValue | -string | -null | -??? | -
| optionDisabled | -boolean | -null | -??? | -
| value | +any | +null | +Value of the component. | +
| options | +array | +null | +An array of selectitems to display as the available options. | +
| optionLabel | +string | +null | +Property name to use as the label of an option. | +
| optionValue | +string | +null | +Property name to use as the value of an option, defaults to the option itself when not defined. | +
| optionDisabled | +boolean | +null | +Property name to use as the disabled flag of an option, defaults to false when not defined. | +
| scrollHeight | +string | +200px | +Height of the viewport in pixels, a scrollbar is defined if height of list exceeds this value. | +
| filter | +boolean | +false | +When specified, displays an input field to filter the items on keyup. | +
| filterPlaceholder | +string | +null | +Placeholder text to show when filter input is empty. | +
| editable | +boolean | +false | +When present, custom value instead of predefined options can be entered using the editable input field. | +
| placeholder | +string | +null | +Default text to display when no option is selected. | +
| disabled | +boolean | +false | +When present, it specifies that the component should be disabled. | +
| dataKey | +string | +null | +A property to uniquely match the value in options for better performance. | +
| showClear | +boolean | +false | +When enabled, a clear icon is displayed to clear the value. | +
| tabindex | +number | +null | +Index of the element in tabbing order. | +
| Name | -Parameters | -Description | -
|---|---|---|
| Name | +Parameters | +Description | +
| change | -event.originalEvent: Original event - event.value: Selected option value |
- Callback to invoke on value change | -
| input | -event: Input field value | -Callback to invoke on input event of input field (editable mode). | -
| change | +event.originalEvent: Original event + event.value: Selected option value |
+ Callback to invoke on value change. | +
| input | +value: New value | +Callback to invoke on value change. | +
| Name | -Element | -
|---|---|
| Name | +Element | +
| p-dropdown | -Container element. | -
| p-dropdown-label | -Element to display label of selected option. | -
| p-dropdown-trigger | -Icon element. | -
| p-dropdown-panel | -Icon element. | -
| p-dropdown-items-wrapper | -Wrapper element of items list. | -
| p-dropdown-items | -List element of items. | -
| p-dropdown-item | -An item in the list. | -
| p-dropdown-filter-container | -Container of filter input. | -
| p-dropdown-filter | -Filter element. | -
| p-dropdown-open | -Container element when overlay is visible. | -
| p-dropdown | +Container element. | +
| p-dropdown-label | +Element to display label of selected option. | +
| p-dropdown-trigger | +Icon element. | +
| p-dropdown-panel | +Icon element. | +
| p-dropdown-items-wrapper | +Wrapper element of items list. | +
| p-dropdown-items | +List element of items. | +
| p-dropdown-item | +An item in the list. | +
| p-dropdown-filter-container | +Container of filter input. | +
| p-dropdown-filter | +Filter element. | +
| p-dropdown-open | +Container element when overlay is visible. | +