Skip to main content
All docs
V25.1
  • DxDropDownBox.QueryDisplayText Property

    Defines text displayed in the editor input element.

    Namespace: DevExpress.Blazor

    Assembly: DevExpress.Blazor.v25.1.dll

    NuGet Package: DevExpress.Blazor

    Declaration

    [Parameter]
    public Func<DropDownBoxQueryDisplayTextContext, string> QueryDisplayText { get; set; }

    Property Value

    Type Description
    Func<DropDownBoxQueryDisplayTextContext, String>

    A delegate method that returns input text.

    Remarks

    The DxDropDownBox input element is read-only for users. Use the Value property to assign an editor value programmatically and implement the QueryDisplayText function to define how the editor value is displayed in the input element. The function parameters allow you get the editor value (Value) and the previous input text (DisplayText).

    You can use the NullText property to display prompt text in the editor when Value is null.

    Run Demo: DropDown Box - Multiple Selection ListBox

    <label for="ddbMultipleSelectionListBox" class="demo-text cw-480 mb-1">Employees</label>
    <DxDropDownBox @bind-Value="Value"
                   QueryDisplayText="QueryText"
                   DropDownWidthMode="DropDownWidthMode.EditorWidth"
                   SizeMode="Params.SizeMode"
                   InputId="ddbMultipleSelectionListBox"
                   CssClass="cw-480">
        <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"
                       ShowSearchBox="true"
                       CssClass="templateListbox"
                       >
            </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();
        Value = ListBoxData.Take(2);
    }
    

    ListBox in DropDown Box

    If you use the EditBoxDisplayTemplate property to specify input element content, the QueryDisplayText function result does not affect the input element.

    See Also