Skip to main content
All docs
V25.1
  • DxListEditorBase<TData, TValue>.DataAsync Property

    Specifies an asynchronous function that returns data for a list editor (ComboBox, List Box, TagBox).

    Namespace: DevExpress.Blazor.Base

    Assembly: DevExpress.Blazor.v25.1.dll

    NuGet Package: DevExpress.Blazor

    Declaration

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

    Property Value

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

    A function that returns List Box data.

    Remarks

    Use the DataAsync property to bind list editors (ComboBox, List Box, TagBox) 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 List Box 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.

    Note

    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.

    Strongly Typed Collection

    ComboBox

    @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

    List Box

    @using System.Threading;
    @using System.Threading.Tasks;
    
    <DxListBox DataAsync="@GetDataAsync" 
                @bind-Value="@Value">
    </DxListBox>
    
    @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);
        }
    }
    

    List Box Sample Data

    TagBox

    @using System.Threading;
    @using System.Threading.Tasks;
    
    <DxTagBox DataAsync="@GetDataAsync"
              @bind-Values="@Values">
    </DxTagBox>
    
    @code {
        IEnumerable<string> Cities = new List<string>() {
            "London",
            "Berlin",
            "Paris",
        };
    
        IEnumerable<string> Values { get; set; }
    
        public Task<IEnumerable<string>> GetDataAsync(CancellationToken ct = default) {
            return Task.FromResult(Cities);
        }
    }
    

    TagBox DataAsync

    Custom Object Collection

    If you bind a list editor to a data collection that stores custom objects (IEnumerable<CustomType>), override the object’s Equals and GetHashCode() methods. You also need to set the TextFieldName property. Refer to the following topics for more information:

    ComboBox

    @using BlazorApp.Data
    
    <DxComboBox DataAsync="@Staff.GetDataAsync"
                @bind-Value="@SelectedPerson"
                TextFieldName="@nameof(Person.Text)"
                AllowUserInput="true">
    </DxComboBox>
    
    @code {
        Person SelectedPerson { get; set; } = Staff.DataSource[0];
    }
    

    ComboBox CustomObject

    List Box

    @using BlazorApp.Data
    
    <DxListBox DataAsync="@Staff.GetDataAsync"
               @bind-Values="@Values"
               TextFieldName="@nameof(Person.Text)">
    </DxListBox>
    
    @code {
        IEnumerable<Person> Values { get; set; } = Staff.DataSource.Take(2);
    }
    

    ListBox CustomObject

    TagBox

    @using BlazorApp.Data
    
    <DxTagBox DataAsync="@Staff.GetDataAsync"
              @bind-Values="@SelectedStaff"
              TextFieldName="@nameof(Person.Text)">
    </DxTagBox>
    
    @code {
        IEnumerable<Person> SelectedStaff { get; set; } = new List<Person>() { Staff.DataSource[0] };
    }
    

    TagBox Overview

    Implements

    DevExpress.Blazor.IListEditorBase<TData, TValue>.DataAsync
    See Also