List Box
- 4 minutes to read
The BootstrapListBox control displays a list of items that can be selected by end-users.
Bootstrap List Box offers the following features:
Multiple Selection
The Bootstrap List Box editor allows multiple list items to be selected at the same time, this functionality is controlled by the ASPxListBox.SelectionMode property. The following selection modes are available within the Bootstrap List Box editor.
Selection Mode Description Single Only one item can be selected within the editor. Multiple Multiple items can be selected within the editor. End-users can apply multi-selection by clicking list items while pressing Ctrl (to add an individual item) or Shift (to select a range of items). CheckColumn Multiple items can be selected within the editor. End-users can apply multi-selection by clicking list items (the Shift key can also be used in this mode to select a range of items). Multi-Field Mode
A single item of a list box can display values obtained from several data fields. By default, the displayed values are separated by a semicolon. Fields are stored in a collection of the BootstrapListBoxFieldCollection type, which can be accessed using the list box’s BootstrapListBox.Fields property. An individual field can be accessed within the collection using indexer notation. A field can be mapped to a data source’s column using the ListBoxColumn.FieldName property.
Filtering
End-users can filter items by entering text in the filter editor above the list. To make the filter editor visible, set the ListBoxFilteringSettings.ShowSearchUI property to true. When an end-user types a filter string, the items list is automatically updated to display only the items that match the filter string. To make all the list box items visible, clear the filter editor.
Built-in Validation
The Bootstrap List Box control allows you to perform data validation both on the client and server side.
Full-Featured Client-Side API
Bootstrap List Box provides you with a comprehensive client-side API. This API is implemented using JavaScript and is exposed via the BootstrapClientListBox object. The BootstrapClientListBox object serves as a client-side equivalent of the BootstrapListBox control.
You can modify the editor behavior using the following methods.
Method Description BootstrapClientListBox.AddItem Adds a new item to the editor, specifying the item’s display text, associated value and displayed image, and returns the index of the added item. ASPxClientListBox.BeginUpdate Prevents the client list box editor from being rendered until the ASPxClientListBox.EndUpdate method is called. ASPxClientListBox.EndUpdate Re-enables editor render operations after a call to the ASPxClientListBox.BeginUpdate method, and forces an immediate re-rendering. ASPxClientListBox.ClearItems Removes all items from the client list box editor. BootstrapClientListBox.FindItemByText Returns a list box item by its text. BootstrapClientListBox.FindItemByValue Returns a list box item by its value. BootstrapClientListBox.GetItem Returns an item specified by its index within the list box editor’s item collection. ASPxClientListBox.GetItemCount Gets the number of items contained in the editor’s item collection. ASPxClientListBox.GetSelectedIndices Returns an array of the list editor’s selected items indices. BootstrapClientListBox.GetSelectedItems Returns an array of the list editor’s selected items. ASPxClientListBox.GetSelectedValues Returns an array of the list editor’s selected items values. BootstrapClientListBox.InsertItem Inserts a new item into the control’s items collection at the specified index. ASPxClientListBox.MakeItemVisible Scrolls the editor’s item list, so that the specified item becomes visible. ASPxClientListBox.RemoveItem Removes an item specified by its index from the client list editor. ASPxClientListBox.SelectAll Selects all list box items. ASPxClientListBox.SelectIndices Selects the items with the specified indices within a list box. BootstrapClientListBox.SelectItems Selects the specified items within a list box. ASPxClientListBox.SelectValues Select the items with the specified values within a list box. ASPxClientListBox.UnselectAll Unselects all list box items. ASPxClientListBox.UnselectIndices Unselects an array of the list box items with the specified indices. BootstrapClientListBox.UnselectItems Unselects an array of the specified list box items. ASPxClientListBox.UnselectValues Unselects an array of the list box items with the specified values.