Skip to main content

DxComboBoxSettings.EditFormat Property

Specifies the format pattern applied to the value of the focused combo box editor.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.1.dll

NuGet Package: DevExpress.Blazor

Declaration

[DefaultValue(null)]
[Parameter]
public string EditFormat { get; set; }

Property Value

Type Default Description
String null

The format pattern.

Remarks

Specify the DisplayFormat property to format the unfocused combo box editor’s display value. To format the focused editor’s edit value, use the EditFormat property. If the EditFormat property is unspecified, the TextFieldName property specifies the editor display text.

The EditFormat property allows you to format edit values displayed in single-column and multi-column combo boxes. To change formatting at runtime, use the IComboBoxSettings.EditFormat property.

Note

A multi-column combo box applies the filter condition only to the columns displayed in the edit value.

Format a Single-Column Combo Box

The following code snippet applies the following formats to the combo box editor:

Single-Column Combo Box

@inject IDbContextFactory<NorthwindContext> NorthwindContextFactory

<DxGrid Data="Products"
        EditMode="GridEditMode.EditRow">
    <Columns>
        <DxGridCommandColumn />
        <DxGridDataColumn FieldName="ProductName"  Width="25%" />
        <DxGridDataColumn FieldName="UnitPrice">
            <EditSettings>
                <DxComboBoxSettings Data="Prices" DisplayFormat="C" EditFormat="F" />
            </EditSettings>
        </DxGridDataColumn>
        <DxGridDataColumn FieldName="UnitsInStock" />
    </Columns>
</DxGrid>

@code {
    NorthwindContext Northwind { get; set; }
    List<Product> Products { get; set; }
    IEnumerable<decimal?> Prices = new List<decimal?>() { 5, 10, 25, 50, 100};

    protected override async Task OnInitializedAsync() {
        Northwind = NorthwindContextFactory.CreateDbContext();
        Products = await Northwind.Products.ToListAsync();
    }

    public void Dispose() {
        Northwind?.Dispose();
    }
}

Format a Multi-Column Combo Box

The following code snippet adds three columns to the combo box editor and applies the {1} {2} format pattern to the edit value. This format specifies that the editor should display column values with listed visible indexes:

Multi-Column Combo Box

@inject IDbContextFactory<NorthwindContext> NorthwindContextFactory

<DxGrid Data="Orders"
        EditMode="GridEditMode.EditRow">
    <Columns>
        <DxGridCommandColumn />
        <DxGridDataColumn FieldName="EmployeeId" Caption="Employee" Width="20%">
            <EditSettings>
                <DxComboBoxSettings Data="Employees"
                                    TextFieldName="LastName" 
                                    ValueFieldName="EmployeeId" 
                                    EditFormat="{1} {2}" >
                    <Columns>
                        <DxListEditorColumn FieldName="EmployeeId" Caption="Id" Width="30px" />
                        <DxListEditorColumn FieldName="FirstName" Caption="Name" />
                        <DxListEditorColumn FieldName="LastName" Caption="Surname" />
                    </Columns>
                </DxComboBoxSettings>
            </EditSettings>
        </DxGridDataColumn>
        <DxGridDataColumn FieldName="ShippedDate" />
        <DxGridDataColumn FieldName="ShipCountry" />
        <DxGridDataColumn FieldName="ShipCity" />
        <DxGridDataColumn FieldName="ShipName" Width="20%" />
    </Columns>
</DxGrid>


@code {
    NorthwindContext Northwind { get; set; }
    List<Order> Orders { get; set; }
    List<Employee> Employees { get; set; }

    protected override async Task OnInitializedAsync() {
        Northwind = NorthwindContextFactory.CreateDbContext();
        Orders = await Northwind.Orders.ToListAsync();
        Employees = await Northwind.Employees.ToListAsync();
    }

    public void Dispose() {
        Northwind?.Dispose();
    }
}

Implements

See Also