Back to Devexpress

DxComboBoxSettings.ItemDisplayTemplate Property

blazor-devexpress-dot-blazor-dot-dxcomboboxsettings-c2ccdf8a.md

latest2.7 KB
Original Source

DxComboBoxSettings.ItemDisplayTemplate Property

Specifies a template used to display the combo box editor items.

Namespace : DevExpress.Blazor

Assembly : DevExpress.Blazor.v25.2.dll

NuGet Package : DevExpress.Blazor

Declaration

csharp
[Parameter]
public RenderFragment<ComboBoxItemDisplayTemplateContext> ItemDisplayTemplate { get; set; }

Property Value

TypeDescription
RenderFragment<ComboBoxItemDisplayTemplateContext>

The template content.

|

Remarks

Place HTML markup in the <ItemDisplayTemplate> tag to define custom content for ComboBox items. Use the template’s context parameter to access a data object and its fields (for instance, get the value of a data field).

The following code snippet makes the editor’s items bold:

razor
<DxGrid Data="Products"
        EditMode="GridEditMode.EditRow"
        CustomizeEditModel="Grid_CustomizeEditModel"
        EditModelSaving="Grid_EditModelSaving">
    <Columns>
        <DxGridCommandColumn DeleteButtonVisible="false" Width="15%" />
        <DxGridDataColumn FieldName="ProductName" Width="25%" />
        <DxGridDataColumn FieldName="CategoryId" Caption="Category" Width="10%">
            <EditSettings>
                <DxComboBoxSettings Data="Categories" ValueFieldName="CategoryId" TextFieldName="CategoryName">
                    <ItemDisplayTemplate>
                        <div><b>@context.DisplayText</b></div>
                    </ItemDisplayTemplate>
                </DxComboBoxSettings>
            </EditSettings>
        </DxGridDataColumn>
        <DxGridDataColumn FieldName="UnitPrice" DisplayFormat="c" Width="10%">
            <EditSettings>
                <DxSpinEditSettings MinValue="0M" Mask="n3" />
            </EditSettings>
        </DxGridDataColumn>
        <DxGridDataColumn FieldName="UnitsInStock" />
        <DxGridDataColumn FieldName="QuantityPerUnit" Width="15%" />   
        <DxGridDataColumn FieldName="Discontinued" />
    </Columns>
</DxGrid>

Implements

ItemDisplayTemplate

See Also

DxComboBoxSettings Class

DxComboBoxSettings Members

DevExpress.Blazor Namespace