DxGrid.SearchBoxTemplate Property

Specifies a template for the search box.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.1.dll

NuGet Package: DevExpress.Blazor

Declaration

[Parameter]
public RenderFragment<GridSearchBoxTemplateContext> SearchBoxTemplate { get; set; }

Property Value

Type	Description
RenderFragment<GridSearchBoxTemplateContext>	The search box template.

Remarks

When the ShowSearchBox property is set to true, the Grid displays the search box. Users can type text in the box editor to filter and highlight data.

The SearchBoxTemplate property allows you to specify custom content for the search box. The template accepts a GridSearchBoxTemplateContext object as the context parameter. You can use the parameter’s SearchText property to specify the search text.

The following code snippet uses the DxSpinEdit<T> component to search for numbers in the Grid.

<DxGrid Data="Products" ShowSearchBox="true">
    <Columns>
        <DxGridDataColumn FieldName="ProductName" />
        <DxGridDataColumn FieldName="CategoryId" Caption="Category" />
        <DxGridDataColumn FieldName="UnitPrice" DisplayFormat="c" />
    </Columns>
    <SearchBoxTemplate> 
        <DxSpinEdit Value="GetSpinEditValue(context.SearchText)"
                    ValueChanged="(int? v) => context.SearchText = v.ToString()"
                    ClearButtonDisplayMode="DataEditorClearButtonDisplayMode.Auto" />
    </SearchBoxTemplate>
</DxGrid>
@code {
    int? GetSpinEditValue(string searchText) {
        if(string.IsNullOrEmpty(searchText))
            return null;
        return Convert.ToInt32(searchText);
    }
}

For more information, refer to the following topics:

• Search Box in Blazor Grid
• Templates in Blazor Grid

Implements

SearchBoxTemplate