Hi guys,
Quick question here, recently I converted a few datagrids into using virtualization and loving the benefits. I just found out that when selecting rows a small delay occurs before the row is actually highlighted.
When using the debugger I can actually see that a select query is executed against the database (each causing a 10 - 20ms delay). I can't really see any benefit of doing this but maybe I'm missing something here.
Is the normal behaviour or am I missing something here? This is the actual page:
@page "/projects"
@using XXX.Application.Interfaces
@using XXX.Domain.Common.Enum
@using XXX.Domain.Entities
@using XXX.Persistance.Contexts
@using XXX.WebUI.Components.Dialogs
@using XXX.WebUI.Components.Services
@using XXX.WebUI.Controllers
@using Microsoft.EntityFrameworkCore
@inject ApplicationController _applicationController;
@inject NavigationManager _navigationManager;
@inject IDbContextFactory<AppDbContext> _dbContactFactory;
<RadzenDataGrid Data="@projects" @ref="projectsGrid" AllowVirtualization="true" Style="height: calc(100vh - 150px)" TItem="Project" IsLoading=@isLoading
AllowFiltering="true" AllowSorting="true" FilterMode="FilterMode.Simple" FilterCaseSensitivity="FilterCaseSensitivity.CaseInsensitive" LogicalFilterOperator="LogicalFilterOperator.And"
RowDoubleClick="@((args) => NavigateToProjectPage(args))" @bind-Value=@selectedProject>
<HeaderTemplate>
<RadzenStack Orientation="Orientation.Horizontal">
<RadzenButton Icon="add" Text="New project" Click="@CreateProject"></RadzenButton>
<RadzenButton Icon="delete" Click="@DeleteSelectedProject"></RadzenButton>
</RadzenStack>
</HeaderTemplate>
<Columns>
<RadzenDataGridColumn Property="@nameof(Status)" Title="Status" Width="160px" />
<RadzenDataGridColumn Property="@nameof(Project.ProjectNumber)" Title="Project number" Width="160px" />
<RadzenDataGridColumn Property="@nameof(Project.Description)" Title="Description" Width="200px" />
<RadzenDataGridColumn Property="@nameof(Project.StartDate)" Title="Start Date" FormatString="{0:d}" Width="160px" />
<RadzenDataGridColumn Property="@nameof(Project.OrderDate)" Title="Order Date" FormatString="{0:d}" Width="160px" SortOrder="SortOrder.Descending" />
<RadzenDataGridColumn Property="@nameof(ProjectType)" Title="Project type" Width="160px" />
</Columns>
</RadzenDataGrid>
@code
{
private AppDbContext? dbContext;
IEnumerable<Project> projects;
protected override async Task OnInitializedAsync()
{
await base.OnInitializedAsync();
await ShowLoading();
//Create dbContext, scoped to the lifetime of this component/page
dbContext = _dbContactFactory.CreateDbContext();
projects = dbContext.Projects.Include(x => x.Customer).AsNoTracking();
}
public void Dispose()
{
dbContext?.Dispose();
}
async Task ShowLoading()
{
isLoading = true;
await Task.Yield();
isLoading = false;
}
private void NavigateToProjectPage(DataGridRowMouseEventArgs<Project> args)
{
_navigationManager.NavigateTo("/project/" + args.Data.Id);
}
private async Task DeleteSelectedProject()
{
if (await _applicationController.DeleteProjectAsync(selectedProject.First()))
{
await projectsGrid.Reload();
}
}
}