I'm unsure if this is possible.
I'm trying to pass my search term on the page load to the data grid. currently it give me null on column when I try to set incoming searchterm
@switch (_status)
{
case Status.Loaded:
<p>Search Term = @SearchTerm</p>
<RadzenDataGrid style="miheight: 335px" @ref="grid" AllowFiltering="true" AllowColumnResize="true"
Count="@Count" Density="Density.Compact" IsLoading=@isLoading
AllowSorting="true" Data="@OpenEngClientSearch"
TItem="EngagementsViewModel" ColumnWidth="300px"
AllowPaging="true" PageSizeOptions="@pageSizeOptions" ShowPagingSummary="@showPagerSummary"
FilterMode="FilterMode.Simple" FilterCaseSensitivity="FilterCaseSensitivity.CaseInsensitive" LogicalFilterOperator="LogicalFilterOperator.Or">
<EmptyTemplate>
<p style="color: lightgrey; font-size: 24px; text-align: center; margin: 2rem;">No records to display.</p>
</EmptyTemplate>
<Columns>
<RadzenDataGridColumn TItem="EngagementsViewModel" Width="80px" Filterable="true" Frozen="true" TextAlign="TextAlign.Left" Property="InstitutionName" Title="Institution Name" />
<RadzenDataGridColumn TItem="EngagementsViewModel" Width="80px" Filterable="false" Frozen="false" TextAlign="TextAlign.Left" Property="SaleId" Title="Sale Id" />
<RadzenDataGridColumn TItem="EngagementsViewModel" Width="80px" Filterable="false" Frozen="false" TextAlign="TextAlign.Left" Property="EngagementNum" Title="Engagement Num." />
<RadzenDataGridColumn TItem="EngagementsViewModel" Width="80px" Filterable="false" Frozen="false" TextAlign="TextAlign.Left" Property="Ename" Title="Engagement Name" />
</Columns>
</RadzenDataGrid>
break;
}
@code {
[Parameter]
public string SearchTerm { get; set; }
private string _errorMessage;
private Status _status { get; set; } = Status.Loading;
bool showPagerSummary = true;
IEnumerable<int> pageSizeOptions = new int[] { 5, 10, 20, 30 };
IEnumerable<EngagementsViewModel> OpenEngClientSearch;
//IEnumerable<string> selectedTitles;
//List<string> titles = new List<string> { "Sales Representative", "Vice President, Sales", "Sales Manager", "Inside Sales Coordinator" };
/// LoadData=@LoadData IsLoading=@isLoading
///
///
private RadzenDataGrid<EngagementsViewModel> grid { get; set; } = default;
bool isLoading = false;
int Count;
protected override async Task OnInitializedAsync()
{
_status = Status.Loading;
OpenEngClientSearch = await UnitOfWork.TasksAssigned.OpenEngagementClientAsNoTrackingAsync();
_status = Status.Loaded;
isLoading = true;
Count = OpenEngClientSearch.Count();
if (string.IsNullOrEmpty(SearchTerm))
{
isLoading = false;
}
}
protected override Task OnAfterRenderAsync(bool firstRender)
{
if (firstRender && !string.IsNullOrEmpty(SearchTerm))
{
isLoading = true;
var column = grid.ColumnsCollection.Where(c => c.Property == "InstitutionName").FirstOrDefault();
if (column != null)
{
column.FilterValue = SearchTerm;
column.FilterOperator = FilterOperator.StartsWith;
grid.Reload();
}
isLoading = false;
}
return base.OnAfterRenderAsync(firstRender);
}
enchev
February 27, 2023, 7:26am
2
Similar working example can be found here:
I've gotten the filter to work once the page loads. But it's not using the search term on the first render
@switch (_status)
{
case Status.Loading:
<p>
<em>Loading...</em>
</p>
break;
case Status.Error:
<p>@_errorMessage</p>
break;
case Status.Loaded:
<RadzenDataGrid style="min-height: 330px;max-height: 350px" @ref="grid" AllowFiltering="true" AllowColumnResize="true"
Count="@Count" Density="Density.Compact" IsLoading=@isLoading AllowVirtualization="false"
AllowSorting="true" Data="@OpenEngClientSearch"
TItem="EngagementsViewModel" ColumnWidth="300px"
AllowPaging="true" PageSize="5" PageSizeOptions="@pageSizeOptions" ShowPagingSummary="@showPagerSummary"
FilterMode="FilterMode.Simple" FilterCaseSensitivity="FilterCaseSensitivity.CaseInsensitive"
LogicalFilterOperator="LogicalFilterOperator.And" Filter="@OnFilter">
<EmptyTemplate>
<p style="color: lightgrey; font-size: 24px; text-align: center; margin: 2rem;">No records to display.</p>
</EmptyTemplate>
<Columns>
<RadzenDataGridColumn TItem="EngagementsViewModel" Width="80px" Filterable="true" Frozen="true" TextAlign="TextAlign.Left" Property="InstitutionName" Title="Institution Name" />
@* <RadzenDataGridColumn TItem="EngagementsViewModel" Width="25px" Filterable="false" Frozen="false" TextAlign="TextAlign.Left" Property="SaleId" Title="Sale Id" />*@
<RadzenDataGridColumn TItem="EngagementsViewModel" Width="80px" Filterable="false" Frozen="false" TextAlign="TextAlign.Left" Property="EngagementNum" Title="Engagement Num." />
<RadzenDataGridColumn TItem="EngagementsViewModel" Width="80px" Filterable="false" Frozen="false" TextAlign="TextAlign.Left" Property="Ename" Title="Engagement Name" />
</Columns>
</RadzenDataGrid>
break;
}
@code {
[Parameter]
public string SearchTerm { get; set; }
private string _errorMessage;
private Status _status { get; set; } = Status.Loading;
bool showPagerSummary = true;
IEnumerable<int> pageSizeOptions = new int[] { 5, 10, 20, 30 };
IEnumerable<EngagementsViewModel> OpenEngClientSearch;
//IEnumerable<string> selectedTitles;
//List<string> titles = new List<string> { "Sales Representative", "Vice President, Sales", "Sales Manager", "Inside Sales Coordinator" };
/// LoadData=@LoadData IsLoading=@isLoading
/// AllowVirtualization="false" LoadData="@LoadData"
/// Filter="@OnFilter"
private RadzenDataGrid<EngagementsViewModel> grid;
bool isLoading { get; set; }
int Count;
protected override async Task OnInitializedAsync()
{
_status = Status.Loading;
await base.OnInitializedAsync();
_status = Status.Loaded;
//StateHasChanged();
await LoadDataNow();
}
private async Task LoadDataNow()
{
isLoading = true;
OpenEngClientSearch = await UnitOfWork.TasksAssigned.QueryOpenEngagementClientAsync();
Count = OpenEngClientSearch.Count();
isLoading = false;
}
//private async Task LoadData(LoadDataArgs args)
//{
// isLoading = true;
// OpenEngClientSearch = await UnitOfWork.TasksAssigned.QueryOpenEngagementClientAsync();
// Count = OpenEngClientSearch.Count();
// OpenEngClientSearch = OpenEngClientSearch.Skip(args.Skip.Value).Take(args.Top.Value).ToList();
// isLoading = false;
//}
protected override Task OnAfterRenderAsync(bool firstRender)
{
if (firstRender && !string.IsNullOrEmpty(SearchTerm))
{
// isLoading = true;
var column = grid.ColumnsCollection.Where(c => c.Property == "InstitutionName").FirstOrDefault();
if (column != null)
{
column.FilterValue = SearchTerm;
column.FilterOperator = FilterOperator.Contains;
grid.Reload();
}
// isLoading = false;
}
return base.OnAfterRenderAsync(firstRender);
}
void OnFilter(DataGridColumnFilterEventArgs<EngagementsViewModel> args)
{
var column = grid.ColumnsCollection.Where(c => c.Property == "InstitutionName").FirstOrDefault();
if (column != null)
{
column.FilterValue = args.FilterValue;
column.FilterOperator = FilterOperator.Contains;
grid.Reload();
}
}
}
enchev
February 28, 2023, 7:03am
4
I don’t see anything wrong with your code. If you have active subscription you can send us your project at info@radzen.com to debug it.
I end up resolving this but implementing data load virtualization and removing the direct filter API interaction which seems to be working now:
<RadzenCard class="m-3 p=3">
<RadzenDataGrid style="min-height: 330px;max-height: 350px" @ref="grid" AllowColumnResize="true"
Count="@Count" Density="Density.Compact" IsLoading=@isLoading AllowVirtualization="true"
AllowSorting="true" Data="@OpenEngClientSearch" LoadData="@LoadData"
TItem="EngagementsViewModel" ColumnWidth="80px"
AllowFiltering="true" FilterMode="FilterMode.Simple" FilterCaseSensitivity="FilterCaseSensitivity.CaseInsensitive"
LogicalFilterOperator="LogicalFilterOperator.And">
<EmptyTemplate>
<p style="color: lightgrey; font-size: 24px; text-align: center; margin: 2rem;">No records to display.</p>
</EmptyTemplate>
<Columns>
<RadzenDataGridColumn TItem="EngagementsViewModel" Width="80px" Filterable="true" Frozen="true" TextAlign="TextAlign.Left" Property="InstitutionName" Title="Institution Name">
<Template Context="data">
<a href="@("/ClientManagement/"+@data.ClientId)">@data.InstitutionName</a>
</Template>
</RadzenDataGridColumn>
@* <RadzenDataGridColumn TItem="EngagementsViewModel" Width="25px" Filterable="false" Frozen="false" TextAlign="TextAlign.Left" Property="SaleId" Title="Sale Id" />*@
<RadzenDataGridColumn TItem="EngagementsViewModel" Width="70px" Filterable="false" Frozen="false" TextAlign="TextAlign.Left" Property="EngagementNum" Title="Engagement Num." />
<RadzenDataGridColumn TItem="EngagementsViewModel" Width="80px" Filterable="false" Frozen="false" TextAlign="TextAlign.Left" Property="Ename" Title="Engagement Name" />
</Columns>
</RadzenDataGrid>
</RadzenCard>
@code {
[Parameter]
public string SearchTerm { get; set; }
private string _errorMessage;
private Status _status { get; set; } = Status.Loading;
bool showPagerSummary = true;
IEnumerable<int> pageSizeOptions = new int[] { 5, 7, 10, 20, 30 };
IEnumerable<EngagementsViewModel> OpenEngClientSearch;
private RadzenDataGrid<EngagementsViewModel> grid { get; set; }
bool isLoading = false;
int Count;
bool FirstLoad = true;
private async Task LoadDataNow()
{
isLoading = true;
OpenEngClientSearch = await UnitOfWork.TasksAssigned.QueryOpenEngagementClientAsync();
Count = OpenEngClientSearch.Count();
isLoading = false;
}
async Task LoadData(LoadDataArgs args)
{
isLoading = true;
var data = await UnitOfWork.TasksAssigned.QueryOpenEngagementClientAsync();
var query = data.AsQueryable<EngagementsViewModel>();
if (FirstLoad)
{
var column = grid.ColumnsCollection.Where(c => c.Property == "InstitutionName").FirstOrDefault();
if (column != null)
{
column.FilterValue = SearchTerm;
column.FilterOperator = FilterOperator.Contains;
grid.Reload();
}
FirstLoad = false;
}
if (!string.IsNullOrEmpty(args.Filter))
{
// Filter via the Where method
query = query.Where(args.Filter);
}
if (!string.IsNullOrEmpty(args.OrderBy))
{
// Sort via the OrderBy method
query = query.OrderBy(args.OrderBy);
}
// Important!!! Make sure the Count property of RadzenDataGrid is set.
Count = query.Count();
// Perform paging via Skip and Take.
OpenEngClientSearch = query.Skip(args.Skip.Value).Take(args.Top.Value).ToList();
isLoading = false;
}
}