DxDropDownBox.ClearButtonDisplayMode Property

Specifies whether the editor displays the Clear button when the editor is not empty.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.1.dll

NuGet Package: DevExpress.Blazor

Declaration

[DefaultValue(DataEditorClearButtonDisplayMode.Never)]
[Parameter]
public DataEditorClearButtonDisplayMode ClearButtonDisplayMode { get; set; }

Property Value

Type	Default	Description
DataEditorClearButtonDisplayMode	Never	The display mode.

Available values:

Name	Description
Auto	The clear button is visible when an editor is not empty. This mode requires that the editor’s data type is nullable.
Never	The clear button is not visible.

Remarks

The Clear button allows users to clear the editor’s value (set it to null). Set the ClearButtonDisplayMode property to Auto to display the Clear button in a non-empty editor. This mode also requires that the editor’s data type is nullable.

Run Demo: DropDown Box - Multiple Selection ListBox

<DxDropDownBox @bind-Value="Value" 
               QueryDisplayText="QueryText" 
               NullText="Select a value" 
               ClearButtonDisplayMode="DataEditorClearButtonDisplayMode.Auto">
    <DropDownBodyTemplate>
        <DxListBox Data="@ListBoxData" TData="Employee" TValue="Employee"
                    Values="@(GetListBoxValues(context.DropDownBox))"
                    ValuesChanged="@(values => ListBoxValuesChanged(values, context.DropDownBox))"
                    TextFieldName="@nameof(Employee.Text)"
                    SelectionMode="ListBoxSelectionMode.Multiple"
                    ShowCheckboxes="true"
                    CssClass="templateListbox"
                    SizeMode="Params.SizeMode">
        </DxListBox>
    </DropDownBodyTemplate>
</DxDropDownBox>

@code {
    IEnumerable<Employee> ListBoxData { get; set; }
    object Value { get; set; }

    string QueryText(DropDownBoxQueryDisplayTextContext arg) {
        var names = (arg.Value as IEnumerable<Employee>)?.Select(x => x.LastName);
        return names != null ? string.Join(",", names) : string.Empty;
    }

    IEnumerable<Employee> GetListBoxValues(IDropDownBox dropDownBox) {
        return dropDownBox.Value as IEnumerable<Employee>;
    }

    void ListBoxValuesChanged(IEnumerable<Employee> values, IDropDownBox dropDownBox) {
        dropDownBox.BeginUpdate();
        dropDownBox.Value = values;
        dropDownBox.EndUpdate();
    }

    protected override async Task OnInitializedAsync() {
        ListBoxData = await NwindDataService.GetEmployeesAsync();
    }
}

Implements

ClearButtonDisplayMode