ASPxListBox Class
A list box control.
Namespace: DevExpress.Web
Assembly: DevExpress.Web.v21.2.dll
Declaration
public class ASPxListBox :
ASPxListEdit,
IListBoxColumnsOwner,
IMultiSelectListEdit,
IControlDesigner,
IListEditPropertyDescriptorsOwner,
IListEditServerModeOwnerRemarks
The ASPxListBox control allows you to display a list of items that users can select.
Create a List Box
Design Time
The ASPxListBox control is available on the DX.21.2: Common Controls toolbox tab in the Microsoft Visual Studio IDE.
Drag the control onto a form and customize the control’s settings, or paste the control’s markup in the page’s source code.
<dx:ASPxListBox ID="ASPxListBox1" runat="server">
<Items>
<dx:ListEditItem Text="Item 1" Value="Item 1" />
<dx:ListEditItem Text="Item 2" Value="Item 2" />
<dx:ListEditItem Text="Item 3" Value="Item 3" />
</Items>
</dx:ASPxListBox>
Run Time
protected void Page_Load(object sender, EventArgs e) {
ASPxListBox listBox = new ASPxListBox();
listBox.ID = "ASPxListBox1";
form1.Controls.Add(listBox);
listBox.Items.Add(new ListEditItem("Item 1"));
listBox.Items.Add(new ListEditItem("Item 2"));
listBox.Items.Add(new ListEditItem("Item 3"));
}
Client-Side API
The ASPxListBox‘s client-side API uses JavaScript and is exposed by the ASPxClientListBox object.
Availability | Set the ASPxEditBase.EnableClientSideAPI property to true or handle any client event. |
Client object type | |
Access name | |
Events |
Bind to Data
The editor stores its items in the ASPxListEdit.Items collection, which allows you to access an individual item and specify its features (ListEditItem).
You can use the ASPxListEdit.DataSourceID property to bind the ASPxListBox to a data source. Use the following properties to specify the editor’s item characteristics (image, text, and value):
Name | Description |
|---|---|
Specifies the data source field that contains the image location for the editor’s items. | |
Specifies the data source field that contains text to display in the editor. | |
Specifies the data source field that contains values for the editor’s items. |
<dx:ASPxListBox ID="ASPxListBox1" runat="server"
DataSourceID="SqlDataSource1" ValueField="ProductName" TextField="ProductName">
</dx:ASPxListBox>
<asp:SqlDataSource ID="SqlDataSource1" runat="server" ...></asp:SqlDataSource>
See also: Bind to Data
Item Load Modes
The ASPxListBox supports the following item load modes:
Load Mode | Description | Affected Properties |
|---|---|---|
Default | The editor loads items and executes all data operations (for instance, scrolling and filtering) on the client without a round trip to the server. | EnableCallbackMode=”False” |
On-Demand | You can use callbacks to load items from the server on demand. For instance, the editor can dynamically load items as a user scrolls the list. | EnableCallbackMode = “True” |
Dynamic | You can manually populate a list with the required items based on the filter criteria and a user’s scroll action. | EnableCallbackMode=”True” |
<dx:ASPxListBox ID="ASPxListBox1" runat="server" DataSourceID="SqlDataSource1"
EnableCallbackMode="true" CallbackPageSize="30" >
<Columns>
<dx:ListBoxColumn FieldName="OrderID" />
<!--...-->
</Columns>
</dx:ASPxListBox>
See also: Item Load Modes
Multiple Selection
The ASPxListBox allows you to select multiple list items (SelectionMode).
SelectionMode=”Single”
SelectionMode=”Multiple”
SelectionMode=”CheckColumn”
<dx:ASPxListBox ID="ASPxListBox1" runat="server" SelectionMode="CheckColumn" ...>
<!--...-->
</dx:ASPxListBox>
See also: Multi-Selection Mode
Filtering
The ASPxListBox can filter data while a user types the filter string in the filter editor.
Set the ListBoxFilteringSettings.ShowSearchUI property to true to display the search editor.
