ComboBox - Business Object List as Data Source

The ComboBox component is a drop-down list editor that allows an end user to select from a list of items.

This sample demonstrates the ComboBox bound to a list of complex business objects. The text for the items displayed in the list is retrieved from the specified business object property. Try changing the selection to see the current object's property values.

ComboBox - Virtual Scrolling

The ListRenderMode property specifies how the ComboBox loads the item list.

  • Entire - The ComboBox loads the entire item list. This option is suitable for small item lists where scrolling should work instantly.
  • Virtual - The ComboBox loads visible items only. This approach improves performance when the list is too heavy to load at a time.

In this demo, the ListRenderMode property is set to ListRenderMode.Virtual.

ComboBox - Allow Input

The AllowUserInput property specifies whether users are allowed to input values into an editor's edit box. The following property values are available:

  • true - A user can either select an item from the drop-down list or enter new values into the edit box (without the need to invoke the drop-down list).
  • false - A user can only select an item from the drop-down list.

In this demo, the AllowUserInput property is set to true.

Text = "New York", SelectedItem = Null

ComboBox - Incremental Filtering

The ComboBox allows you to dynamically filter list items based on the text typed into the editor. For this purpose, apply the required mode to the FilteringMode property.

  • Contains - The editor is filtered for list items that contain the search string. Search string matches are highlighted.
  • StartsWith - The editor is filtered for list items that begin with the search string.
  • None - The filter is not applied to list items.

In this demo, the filter mode is set to DataGridFilteringMode.Contains. To see the feature in action, set the focus to the ComboBox component and enter a search query.

Text = "", SelectedItem = Null

ComboBox - NullText

This example illustrates how to use the NullText property to display prompt text (watermark) in the editor when it is empty. The editor can be set to NULL if its data type is nullable. The code below demonstrates how to bind the ComboBox’s selected item collection to a nullable object (SelectedOption).

The ComboBox can also display a Clear button that clears the editor’s value (set it to NULL) when the corresponding data source collection does not include a null value. To show the Clear button in the ComboBox, set the ClearButtonDisplayMode property to DataEditorClearButtonDisplayMode.Auto.

Option Selected: null

ComboBox - Cascading Lists

This demo shows how to populate a DxComboBox editor with items based on the user selection from another DxComboBox.

Selected values are: Germany / Berlin

ComboBox - Read-Only Mode

The ComboBox component allows you to display the value, but does not allow users to change it. Set the ReadOnly property to true to activate the read-only mode.

Option Selected: Option 2
An error has occurred. This application may no longer respond until reloaded. Reload 🗙