Grid popup editing throws about parameterless constructor even when I use the OnModelInit event.
The inline and incell edit modes are still working.
The regression occurs in version 4.2.0.
Selection performance suffers if the Grid has a large page size and uses child components in column templates:
https://blazorrepl.telerik.com/QHaLcVbl25YrVZU821
This is because the Grid doesn't apply performance optimizations for templates and always re-renders them.
Please expose a setting to disable re-rendering if it's not necessary.
When I define a bigger number of MultiColumn Header the rendering performance of the Grid component quickly deteriorates.
I would like an improvement in this regard.
App just crashed with the below exception. My code isn't in the stack trace. Chances are there is no proper validation on parameters, allowing me to supply bad data, which later causes this problem. Please validate the data better, debugging these things is not easy.
Microsoft.AspNetCore.Diagnostics.ExceptionHandlerMiddleware: Error: An unhandled exception has occurred while executing the request.
System.ArgumentNullException: Value cannot be null. (Parameter 'source')
at System.Linq.ThrowHelper.ThrowArgumentNullException(ExceptionArgument argument)
at System.Linq.Enumerable.ToList[TSource](IEnumerable`1 source)
at Telerik.Blazor.Components.TelerikGrid`1.SetProcessedData(IEnumerable data)
at Telerik.Blazor.Components.Common.DataBoundComponent`1.ProcessDataSourceResult(DataSourceResult result)
at Telerik.Blazor.Components.Common.GridBase`1.ProcessDataSourceResult(DataSourceResult result)
at Telerik.Blazor.Components.Common.DataBoundComponent`1.ProcessDataInternal()
at Telerik.Blazor.Components.TelerikGrid`1.ProcessDataInternal()
at Telerik.Blazor.Components.Common.DataBoundComponent`1.OnParametersSetAsync()
at Telerik.Blazor.Components.TelerikGrid`1.OnParametersSetAsync()
at Microsoft.AspNetCore.Components.ComponentBase.CallStateHasChangedOnAsyncCompletion(Task task)
at Microsoft.AspNetCore.Components.ComponentBase.RunInitAndSetParametersAsync()
at Microsoft.AspNetCore.Components.Rendering.ComponentState.SetDirectParameters(ParameterView parameters)
at Microsoft.AspNetCore.Components.RenderTree.RenderTreeDiffBuilder.InitializeNewComponentFrame(DiffContext& diffContext, Int32 frameIndex)
at Microsoft.AspNetCore.Components.RenderTree.RenderTreeDiffBuilder.InitializeNewSubtree(DiffContext& diffContext, Int32 frameIndex)
at Microsoft.AspNetCore.Components.RenderTree.RenderTreeDiffBuilder.InsertNewFrame(DiffContext& diffContext, Int32 newFrameIndex)
at Microsoft.AspNetCore.Components.RenderTree.RenderTreeDiffBuilder.AppendDiffEntriesForRange(DiffContext& diffContext, Int32 oldStartIndex, Int32 oldEndIndexExcl, Int32 newStartIndex, Int32 newEndIndexExcl)
at Microsoft.AspNetCore.Components.RenderTree.RenderTreeDiffBuilder.ComputeDiff(Renderer renderer, RenderBatchBuilder batchBuilder, Int32 componentId, ArrayRange`1 oldTree, ArrayRange`1 newTree)
at Microsoft.AspNetCore.Components.Rendering.ComponentState.RenderIntoBatch(RenderBatchBuilder batchBuilder, RenderFragment renderFragment, Exception& renderFragmentException)
at Microsoft.AspNetCore.Components.RenderTree.Renderer.ProcessRenderQueue()
--- End of stack trace from previous location ---
at Microsoft.AspNetCore.Components.RenderTree.Renderer.ProcessRenderQueue()
at Microsoft.AspNetCore.Components.RenderTree.Renderer.AddToRenderQueue(Int32 componentId, RenderFragment renderFragment)
at Microsoft.AspNetCore.Components.ComponentBase.StateHasChanged()
at Microsoft.AspNetCore.Components.ComponentBase.CallOnParametersSetAsync()
at Microsoft.AspNetCore.Components.ComponentBase.RunInitAndSetParametersAsync()
at Microsoft.AspNetCore.Components.Rendering.ComponentState.SetDirectParameters(ParameterView parameters)
at Microsoft.AspNetCore.Components.RenderTree.Renderer.RenderRootComponentAsync(Int32 componentId, ParameterView initialParameters)
at Microsoft.AspNetCore.Components.Rendering.HtmlRenderer.RenderComponentAsync(Type componentType, ParameterView initialParameters)
at Microsoft.AspNetCore.Components.Rendering.RendererSynchronizationContext.<>c__11`1.<<InvokeAsync>b__11_0>d.MoveNext()
--- End of stack trace from previous location ---
at Microsoft.AspNetCore.Mvc.ViewFeatures.StaticComponentRenderer.PrerenderComponentAsync(ParameterView parameters, HttpContext httpContext, Type componentType)
at Microsoft.AspNetCore.Mvc.ViewFeatures.ComponentRenderer.PrerenderedServerComponentAsync(HttpContext context, ServerComponentInvocationSequence invocationId, Type type, ParameterView parametersCollection)
at Microsoft.AspNetCore.Mvc.ViewFeatures.ComponentRenderer.RenderComponentAsync(ViewContext viewContext, Type componentType, RenderMode renderMode, Object parameters)
at Microsoft.AspNetCore.Mvc.TagHelpers.ComponentTagHelper.ProcessAsync(TagHelperContext context, TagHelperOutput output)
at Microsoft.AspNetCore.Razor.Runtime.TagHelpers.TagHelperRunner.<RunAsync>g__Awaited|0_0(Task task, TagHelperExecutionContext executionContext, Int32 i, Int32 count)
at EnrichmentEngine.Pages.Pages__Host.<ExecuteAsync>b__15_1() in C:\Users\PeterDrier\source\repos\fleet\src\sovereign\dotnet\services\studio-calc-engine\SummaReportsPoc\Pages\_Host.cshtml:line 25
at Microsoft.AspNetCore.Razor.Runtime.TagHelpers.TagHelperExecutionContext.SetOutputContentAsync()
at EnrichmentEngine.Pages.Pages__Host.ExecuteAsync() in C:\Users\PeterDrier\source\repos\fleet\src\sovereign\dotnet\services\studio-calc-engine\SummaReportsPoc\Pages\_Host.cshtml:line 7
at Microsoft.AspNetCore.Mvc.Razor.RazorView.RenderPageCoreAsync(IRazorPage page, ViewContext context)
at Microsoft.AspNetCore.Mvc.Razor.RazorView.RenderPageAsync(IRazorPage page, ViewContext context, Boolean invokeViewStarts)
at Microsoft.AspNetCore.Mvc.Razor.RazorView.RenderAsync(ViewContext context)
at Microsoft.AspNetCore.Mvc.ViewFeatures.ViewExecutor.ExecuteAsync(ViewContext viewContext, String contentType, Nullable`1 statusCode)
at Microsoft.AspNetCore.Mvc.ViewFeatures.ViewExecutor.ExecuteAsync(ViewContext viewContext, String contentType, Nullable`1 statusCode)
at Microsoft.AspNetCore.Mvc.Infrastructure.ResourceInvoker.<InvokeResultAsync>g__Logged|22_0(ResourceInvoker invoker, IActionResult result)
at Microsoft.AspNetCore.Mvc.Infrastructure.ResourceInvoker.<InvokeNextResultFilterAsync>g__Awaited|30_0[TFilter,TFilterAsync](ResourceInvoker invoker, Task lastTask, State next, Scope scope, Object state, Boolean isCompleted)
at Microsoft.AspNetCore.Mvc.Infrastructure.ResourceInvoker.Rethrow(ResultExecutedContextSealed context)
at Microsoft.AspNetCore.Mvc.Infrastructure.ResourceInvoker.ResultNext[TFilter,TFilterAsync](State& next, Scope& scope, Object& state, Boolean& isCompleted)
at Microsoft.AspNetCore.Mvc.Infrastructure.ResourceInvoker.InvokeResultFilters()
--- End of stack trace from previous location ---
at Microsoft.AspNetCore.Mvc.Infrastructure.ResourceInvoker.<InvokeNextResourceFilter>g__Awaited|25_0(ResourceInvoker invoker, Task lastTask, State next, Scope scope, Object state, Boolean isCompleted)
at Microsoft.AspNetCore.Mvc.Infrastructure.ResourceInvoker.Rethrow(ResourceExecutedContextSealed context)
at Microsoft.AspNetCore.Mvc.Infrastructure.ResourceInvoker.Next(State& next, Scope& scope, Object& state, Boolean& isCompleted)
at Microsoft.AspNetCore.Mvc.Infrastructure.ResourceInvoker.InvokeFilterPipelineAsync()
--- End of stack trace from previous location ---
at Microsoft.AspNetCore.Mvc.Infrastructure.ResourceInvoker.<InvokeAsync>g__Logged|17_1(ResourceInvoker invoker)
at Microsoft.AspNetCore.Mvc.Infrastructure.ResourceInvoker.<InvokeAsync>g__Logged|17_1(ResourceInvoker invoker)
at Microsoft.AspNetCore.Routing.EndpointMiddleware.<Invoke>g__AwaitRequestTask|6_0(Endpoint endpoint, Task requestTask, ILogger logger)
at Microsoft.AspNetCore.Authorization.AuthorizationMiddleware.Invoke(HttpContext context)
at Microsoft.AspNetCore.Diagnostics.ExceptionHandlerMiddlewareImpl.<Invoke>g__Awaited|8_0(ExceptionHandlerMiddlewareImpl middleware, HttpContext context, Task task)
I have a Grid bound to ObservableCollection and I try to add a new record, the Grid stays in edit mode even if I click the Save button.
Workaround:
@using System.Collections.ObjectModel
@using Telerik.FontIcons
<TelerikGrid Data="@Cards"
Height="800px"
FilterMode="GridFilterMode.FilterRow"
EditMode="GridEditMode.Inline"
OnCreate="NewCard"
OnUpdate="UpdateCard"
OnDelete="DeleteCard"
ConfirmDelete="true"
@ref="@GridReference">
<GridToolBarTemplate>
<GridCommandButton Command="Add" Icon="@FontIcon.Plus">New</GridCommandButton>
</GridToolBarTemplate>
<GridColumns>
<GridColumn Field="@nameof(AdminCard.SerialNumber)" Title="Serial number" />
<GridColumn Field="@nameof(AdminCard.DisplayNumber)" Title="Display number" />
<GridColumn Field="@nameof(AdminCard.Name)" />
<GridCommandColumn Width="140px">
<GridCommandButton Command="Save" Icon="@FontIcon.Save" ShowInEdit="true" />
<GridCommandButton Command="Edit" Icon="@FontIcon.Pencil" />
<GridCommandButton Command="Delete" Icon="@FontIcon.Trash" />
<GridCommandButton Command="Cancel" Icon="@FontIcon.Cancel" ShowInEdit="true" />
</GridCommandColumn>
</GridColumns>
</TelerikGrid>
@code {
TelerikGrid<AdminCard> GridReference { get; set; }
public ObservableCollection<AdminCard> Cards { get; set; } = new();
protected override async Task OnInitializedAsync() =>
Cards = new ObservableCollection<AdminCard>{
new AdminCard{SerialNumber="123", DisplayNumber="1234 1234", Name="Jim"}
};
private async Task NewCard(GridCommandEventArgs args)
{
AdminCard card = (AdminCard)args.Item;
Cards.Add(card);
//apply this after saving the new record to the database
var gridState = GridReference.GetState();
gridState.InsertedItem = null;
gridState.OriginalEditItem = null;
await GridReference.SetStateAsync(gridState);
}
private async Task UpdateCard(GridCommandEventArgs args)
{
AdminCard fromGrid = (AdminCard)args.Item;
AdminCard existing = Cards.Single(c => c.Id == fromGrid.Id);
existing.SerialNumber = fromGrid.SerialNumber;
existing.DisplayNumber = fromGrid.DisplayNumber;
existing.Name = fromGrid.Name;
}
private async Task DeleteCard(GridCommandEventArgs args)
{
AdminCard card = (AdminCard)args.Item;
Cards.Remove(card);
}
public class AdminCard
{
public string Id { get; set; } = Guid.NewGuid().ToString();
public string SerialNumber { get; set; } = "";
public string DisplayNumber { get; set; } = "";
public string Name { get; set; } = "";
}
}
I added a comment to this feedback post. In this post, I made a comment on how to get Tab select working in a grid component for a combobox.
It would be nice if tab select was a parameter for any dropdown component and autocomplete. Maybe a parameter called "TabSelect"? It would need to fire before the grid component picks up the Tab key first in InCellEdit mode.
If that was changed above, then the grid component could have the following:
Enter key to move down the list, and Shift-Enter keys to move up the list. Is there a way to do that currently, or could it be added?
Hi Telerik Support
Facing an issue with Keyboard navigation in Telerik Grid component.
When we use TAB to navigate, the grid header gets focus only for the first time. After completing one round of navigation, second time after the Toolbar buttons, if we TAB out, focus goes to the pager sections skipping the grid header part.
Pls refer the REPL sample from Telerik website:
Steps to reproduce:
1) Use ALT + W and then use TAB key to navigate
2) First focus goes to the Toolbar button (Add Product), then goes to the Grid Header and then if we TAB again focus goes to the Pager section
3) After the Pager section, if we do steps 1 and 2 again, we can see that it skips the Grid Header focus second time onwards.
Using CheckBoxList filtering changes the filter menu for all columns. I would like to specify CheckBoxList only for certain columns, but that doesn't currently appear to be an easy option.
1) Leave as FilterMenuType "Menu" but implement a custom filter template for the columns I want. That would be the most obvious, but CheckBoxList is not a usable control on its own?
2) Or do the inverse, use FilterMenuType "CheckBoxList" and implement a custom filter template for all the columns where I don't want to use that. Seems like a lot of extra work to manually recreate default filters.
3) I guess I roll my own clone of the CheckBoxList control and use that like #1 on individual columns?
Any chance the CheckBoxList control could be publicly exposed for direct use?
I need to lock the "expand" column in the Grid(Locked=true).
When I scroll horizontally, the first column with the expand/collapse icon scrolls out of view. I would like a way to lock it.
When initial grouping is set through the state, the GroupFooterTemplate does not render. One has to perform some action for refreshing the Grid in order to display the template - for example, collapsing/expanding a group.
For reference, the GroupHeaderTemplate renders correctly.
Reproduction: https://blazorrepl.telerik.com/wRaJFgFy10vagYnf05
===
ADMIN EDIT
===
The GroupFooterTemplate renders with a delay after the Grid. A possible workaround for the time being is to refresh the Grid after it has been initialized to ensure the GroupFooterTemplate will be displayed.
Grid with columns price1 and price2. Enter value in price1, switch to price2, enter value there, and editor is set to old value after async events finish.
The value entered in price2 is correctly set to the property, but the editor reverts to the previous value. If you escape edit mode of the cell, the value entered before the events finish will be shown.
On (fast) tabbing and entering values, this removes the first values entered before the async background events finish.
I tried reproducing the problem in REPL, but could not get the exact same behaviour. In our case no specific value is being set to price2, it just reverts.
https://blazorrepl.telerik.com/cxEzvQvE52q8aaAi27
How would you approach preventing the editor from being overridden by other cells' delayed events?
Scenario #1
I want my users to confirm the update of a cell value with the built-in Confirmation Dialog for Blazor. If I use the keyboard (Enter, Tab) to close the edit the Confirmation dialog will popup, but after closing it the Grid hangs.
Scenario #2
If I edit a cell and press enter very quickly, the grid is not able to get the new value inserted after confirming it through the dialog.
Scenario #3
If you press Enter very quickly to confirm the value for deletion, the value is not always removed.
Hello
What is the purpose of this (https://docs.telerik.com/blazor-ui/components/grid/selection/overview#row-drag-and-drop);
If the user drags selected rows, the current row selection will be cleared on row drop.
Is this a bug? As when you select multiple rows, then drag and drop the rows, it clears the bound selectedItems object (but the rows still remain ticked in the UI). Just confirming this is something that will be fixed?
Cheers
Phil