DxComboBox<TData, TValue>.DataAsync Property

Specifies an asynchronous function that returns ComboBox data.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v21.1.dll

Declaration

[Parameter]
public Func<CancellationToken, Task<IEnumerable<TData>>> DataAsync { get; set; }

Property Value

Type Description
Func<CancellationToken, Task<IEnumerable<TData>>>

A function that returns ComboBox data.

Remarks

Use the DataAsync property to bind the ComboBox to a strongly typed collection that is loaded asynchronously (for instance, from an HTTP request). This property allows you to prevent the page with the ComboBox from excessive re-rendering.

This property specifies an asynchronous function that returns a Task<IEnumerable<T>> object and accepts a CancellationToken object as a parameter. An exception occurs if you declare the function with an incorrect signature.

@using System.Threading;
@using System.Threading.Tasks;

<DxComboBox DataAsync="@GetDataAsync" @bind-Value="@Value"></DxComboBox>

@code {
    IEnumerable<string> Cities = new List<string>() {
        "London",
        "Berlin",
        "Paris",
    };

    string Value { get; set; }

    public Task<IEnumerable<string>> GetDataAsync(CancellationToken ct = default) {
        return Task.FromResult(Cities);
    }
}

ComboBox Sample Data

If you bind the ComboBox to a data source that stores custom objects (IEnumerable<CustomType>), override the object’s Equals method and set the TextFieldName property. It specifies the custom object’s field name that returns strings to be shown in the ComboBox’s drop-down window.

@using BlazorApp.Data

<DxComboBox DataAsync="@Staff.GetDataAsync"
            @bind-Value="@SelectedPerson"
            TextFieldName="@nameof(Person.Text)">
</DxComboBox>

@code {
    Person SelectedPerson { get; set; } = Staff.DataSource[0];
}

ComboBox CustomObject

Otherwise, the ComboBox’s items are populated with CustomType.ToString() values.

Use the Data property if a strongly typed collection is loaded synchronously. Use the CustomData property if your data is stored on a remote service and is loaded through a Web API.

See Also