ListBox

Aug 08, 2019
4 minutes to read

ListBox is a list box that displays a list of items that can be selected by an end-user.

Implementation Details

ListBox is realized by the ListBoxExtension class. Its instance can be accessed via the ExtensionsFactory.ListBox helper method, which is used to add a ListBox extension to a view. This method’s parameter provides access to the ListBox ‘s settings, implemented by the ListBoxSettings class, allowing you to fully customize the extension.

ListBox ‘s client counterpart is represented by the MVCxClientListBox object.

Declaration

ListBox can be added to a view in the following manner.

View code (ASPX):

csharp

<% 
    Html.DevExpress().ListBox(
        settings => {
            settings.Name = "listBox1";

            settings.Width = 120;
            settings.Height = 150;
            settings.Properties.SelectionMode = ListEditSelectionMode.CheckColumn;
            settings.Properties.ValueType = typeof(string);

            settings.Properties.Items.Add("3G").Selected = true;
            settings.Properties.Items.Add("Bluetooth");
            settings.Properties.Items.Add("Infrared");
            settings.Properties.Items.Add("Wi-Fi").Selected = true;
        }
    )
    .Render();
%>

View code (Razor):

csharp

@Html.DevExpress().ListBox(
    settings => {
        settings.Name = "listBox1";

        settings.Width = 120;
        settings.Height = 150;
        settings.Properties.SelectionMode = ListEditSelectionMode.CheckColumn;
        settings.Properties.ValueType = typeof(string);

        settings.Properties.Items.Add("3G").Selected = true;
        settings.Properties.Items.Add("Bluetooth");
        settings.Properties.Items.Add("Infrared");
        settings.Properties.Items.Add("Wi-Fi").Selected = true;
    }).GetHtml()

Note

The Partial View should contain only the extension’s code.

The code result is demonstrated in the image below.

Main Features

Multiple Selection
Multi-Column Mode
Built-in Validation
Full-Featured Client-Side API