如何在Blazorise Datagrid CustomFilter中设置值?

Question

我试图添加一个自定义过滤器到我的Blazorise数据网格列。目前我可以输入值，它开始过滤每个输入的值。我希望过滤器值是基于现有的值从上下文对象下拉。下面是我到目前为止的代码，如果可能的话，我只需要一点帮助来配置自定义过滤器。

@page "/Loadinglist"
@using myDB.Data
<DataGrid TItem="LoadData"
Data="@loadList"
@bind-SelectedRow="@selectedLoad"
Editable="true"
Resizable
Filterable
FilterMethod="DataGridFilterMethod.StartsWith"
Responsive="true"
Striped="true"
ShowPager="true"
ShowPageSizes="true"
CommandMode="DataGridCommandMode.ButtonRow"
EditMode="editMode">
<DataGridColumns>
<DataGridColumn Field="@nameof(LoadData.id)" Caption="#" Sortable="true" />
<DataGridColumn Field="@nameof(LoadData.caliber)" Caption="Caliber" Editable  />  @*<---Trying to use queryAllCalibers as source to custom filter*@
</DataGridColumns>
</DataGrid>
@code {
[Inject]
public GetLoadData? getLoadData { get; set; }
private IEnumerable<LoadData>? loadList;
private IEnumerable<string> queryAllCalibers;
private LoadData? selectedLoad;

protected override async Task OnInitializedAsync()
{
loadList = await getLoadData.GetDataAsync();
GetCalibersFromContext();
await base.OnInitializedAsync();
}
protected void GetCalibersFromContext()
{
//Existing values in the context
queryAllCalibers = (from calibers in loadList
select calibers.caliber).Distinct();
}
}

Answer 1

您必须在DataGridColumn上指定<FilterTemplate>:

<DataGridColumn CustomFilter="@OnCaliberCustomFilter" Field="@nameof(LoadData.caliber)" Caption="Caliber" Editable>
<FilterTemplate>
<Select TValue="string" SelectedValue="@selectedCaliberFilter" SelectedValueChanged="@(value => { selectedCaliberFilter = value; context.TriggerFilterChange(selectedCaliberFilter); })">
<SelectItem Value="@("*")">All</SelectItem>
@foreach(var caliber in queryAllCalibers)
{
<SelectItem Value="@caliber">@caliber</SelectItem>
}
</Select>
</FilterTemplate>
</DataGridColumn>
@code {
private string? selectedCaliberFilter;
private bool OnCaliberCustomFilter(object itemValue, object searchValue)
{
if (searchValue is string caliberFilter)
{
return caliberFilter == "*" || caliberFilter == itemValue?.ToString();
}
return true;
}
}

检查DataGrid: Features ->自定义列过滤