Demos
Documentation
API
More Samples
Download Wijmo

DropDown

The DropDown control is an abstract class, used as a base for several controls. It is composed of the following elements:

  • input element (exposed by the inputElement property):
    An HTML input element used to display and edit the current value. In a few cases, this element may be replaced with a non-editable element (e.g. Menu and MultiSelect controls).
  • drop-down button A button used to show or hide the drop-down element.
  • **drop-down element (exposed by the *dropDown* property)**: An HTML element shown when the user presses the drop-down button or the F4 key. The user interacts with the drop-down element to update the value of the input element and of the control.

All DropDown controls have the following properties and events:

  • text Gets or sets the current value of the inputElement.
  • textChanged Event that fires when the value of the text property changes..
  • isDroppedDown Gets or sets a value that determines whether the drop-down is currently visible.
  • isDroppedDownChanging, isDroppedDownChanged Events that fire when the value of the isDroppedDown property changes.
  • isAnimated Property that determines whether the control should use animations when showing the drop-down.
  • dropDownCssClass Class added to the drop-down element in order to allow CSS styling of the drop-down.
    This property is useful because when the drop-down is displayed, it is usually re-parented to become a direct child of the document's body, which prevents it from inheriting the styles of the control's host element.

Here is a simple example that demonstrates some of these properties: