Hello,
When using grid command button edit with the onedit handler shown in this documentation https://docs.telerik.com/blazor-ui/components/grid/editing/inline
There is a bug that causes the grid to reset to the first page when editing the last item on any page that isn't the first. In other words we can edit the last item in the gird on the first page but not on the second, third, fourth...etc.
I have taken out all the logic in my edit handler as well and the problem still presents itself.
Below is the relevenat code sample and I have also zipped a short video demonstrating the behavior.
<TelerikGrid @ref="@GridNameHere"
Class="smallerFont"
Data="@DataHere"
Pageable="true"
Page="@Page"
PageSize="@PageSize"
TotalCount="@Total"
Sortable="@true"
Groupable="@false"
FilterMode="@GridFilterMode.FilterMenu"
Reorderable="@true"
OnEdit="@OnEdit"
OnUpdate="@OnUpdate"
OnCreate="@OnUpdate">
<GridToolBar>
<GridCommandButton Command="Add" Icon="add">Add</GridCommandButton>
</GridToolBar>
<GridColumns>
<GridCommandColumn Width="150px">
<GridCommandButton Command="Edit" Icon="edit">Edit</GridCommandButton>
<GridCommandButton Command="Save" Icon="save" ShowInEdit="true">Save</GridCommandButton>
<GridCommandButton Command="Cancel" Icon="cancel" ShowInEdit="true">Cancel</GridCommandButton>
</GridCommandColumn>
<GridColumn Field="@(nameof(ModelName.FieldName))" Title="Column Name" Width="100px" />
</GridColumns>
</TelerikGrid>
//Handler for edit
protected void OnEdit(GridCommandEventArgs args)
{
// no code in here and problem still presents itself but feel free to put anything I recommend using the sample from the documentation above
}
The issue can be reproduced using the Filter From Code -> FilterMenu code snippet provided here:
https://docs.telerik.com/blazor-ui/components/grid/filtering#filter-from-code
1. Load a page with a Grid with Reorderable = true
2. While Grid is rendering load a different page
--> Unhandled ObjectDisposedException
Error: System.ObjectDisposedException: Cannot access a disposed object. Object name: 'DotNetObjectReference`1'. at Microsoft.JSInterop.DotNetObjectReference`1.ThrowIfDisposed() at Microsoft.JSInterop.JSRuntime.TrackObjectReference[TValue](DotNetObjectReference`1 dotNetObjectReference) at Microsoft.JSInterop.Infrastructure.DotNetObjectReferenceJsonConverter`1.Write(Utf8JsonWriter writer, DotNetObjectReference`1 value, JsonSerializerOptions options) at System.Text.Json.JsonSerializer.WriteDictionary[TProperty](JsonConverter`1 converter, JsonSerializerOptions options, WriteStackFrame& current, Utf8JsonWriter writer) at System.Text.Json.JsonPropertyInfoNotNullable`4.OnWriteDictionary(WriteStackFrame& current, Utf8JsonWriter writer) at System.Text.Json.JsonPropertyInfo.WriteDictionary(WriteStack& state, Utf8JsonWriter writer) at System.Text.Json.JsonSerializer.HandleDictionary(JsonClassInfo elementClassInfo, JsonSerializerOptions options, Utf8JsonWriter writer, WriteStack& state) at System.Text.Json.JsonSerializer.Write(Utf8JsonWriter writer, Int32 originalWriterDepth, Int32 flushThreshold, JsonSerializerOptions options, WriteStack& state) at System.Text.Json.JsonSerializer.WriteCore(Utf8JsonWriter writer, Object value, Type type, JsonSerializerOptions options) at System.Text.Json.JsonSerializer.WriteCore(PooledByteBufferWriter output, Object value, Type type, JsonSerializerOptions options) at System.Text.Json.JsonSerializer.WriteCoreString(Object value, Type type, JsonSerializerOptions options) at Microsoft.JSInterop.JSRuntime.InvokeAsync[TValue](String identifier, CancellationToken cancellationToken, Object[] args) at Microsoft.JSInterop.JSRuntime.InvokeWithDefaultCancellation[T](String identifier, Object[] args) at Telerik.Blazor.Components.Grid.GridHeaderRowBase`1.InitColumnReorderable() at Telerik.Blazor.Components.Grid.GridHeaderRowBase`1.OnAfterRenderAsync(Boolean firstRender) at Microsoft.AspNetCore.Components.RenderTree.Renderer.GetErrorHandledTask(Task taskToHandle)
You might have to try a few times to dispose the page at the correct time. With larger Grids it happens more frequently.
Grids without Reorderable = true do not throw an exception!
Would be helpful to have the feature of copying selected row to the clipboard.
The copy format could be CSV or just tabbed delimiter.
---
ADMIN EDIT
In the meantime, you can consider your own JS-based solution (example StackOverflow thread) and integrate them on a command button in the grid or in the row context menu.
---
When a column is displayed conditionally, it's order is not preserved. In the code sample below, the ProductId column is the first column in the grid. When you click the checkbox to hide the column, it is removed. Click the checkbox again and the column reappears but it is the last column in the grid.
ADMIN EDIT: At the end of this post there is an attachment with a workaround through a custom column chooser.
<input type="checkbox" @onchange="@ToggleColumn" />
<TelerikGrid Data=@GridData>
<GridColumns>
@if (ShowColumn)
{
<GridColumn Field=@nameof(Product.ProductId) Title="Id" />
}
<GridColumn Field=@nameof(Product.ProductName) Title="Product Name" />
<GridColumn Field=@nameof(Product.UnitPrice) Title="Unit Price">
<Template>
@(String.Format("{0:C2}", (context as Product).UnitPrice))
</Template>
</GridColumn>
</GridColumns>
</TelerikGrid>
@code {
public IEnumerable<Product> GridData { get; set; }
bool ShowColumn = true;
protected override void OnInitialized()
{
List<Product> products = new List<Product>();
for (int i = 0; i < 20; i++)
{
products.Add(new Product()
{
ProductId = i,
ProductName = "Product" + i.ToString(),
UnitPrice = (decimal)(i * 3.14)
});
}
GridData = products.AsQueryable();
}
private void ToggleColumn(ChangeEventArgs args)
{
ShowColumn = (bool)args.Value;
}
public class Product
{
public int ProductId { get; set; }
public string ProductName { get; set; }
public decimal UnitPrice { get; set; }
}
}
I am editing parent and child records in the hierarchy grid. I can edit parent and child records without issue. The only problem I have now is this; when I click edit on a child record, then collapse the parent, the edit of the child record is lost or cancelled but there is no event I can see to use to put things back in non-edit mode.
I enable buttons and links in non-edit (view) mode and disable them when editing a record.
So, is there an event or some way to know the user is collapsing or expanding a parent record?
Thank you,
With using the Grid, I have several GridCommandButtons. Instead of displaying the button with an icon followed by text, I wanted to display just the icon and use the TelerikTooltip to display the text on hover. When I set the GridCommandButton.Title and inspect the DOM, there is no title attribute on the button even though the description of the GridCommandButton.Title property reads "The title attribute of the Button".
<TelerikGrid @ref="@Grid"
when setting a default filter in code the grid does not show any type of indicator that a filter is applied to a column
desiredState = newGridState<Employee>()
{
FilterDescriptors = newList<FilterDescriptorBase>()
{
newCompositeFilterDescriptor()
{
FilterDescriptors = newFilterDescriptorCollection()
{
newFilterDescriptor() { Member = "Active", Operator = FilterOperator.IsEqualTo, Value = true, MemberType = typeof(bool) }
}
}
}
};
Video here
https://drive.google.com/file/d/12em-oc6xRJ_JjbFSANK9IqKDkK0f7p6y/view
Select an item in the grid and press and hold down arrow...
System.NullReferenceException: Object reference not set to an instance of an object. at Telerik.Blazor.Components.TelerikGridBase`1.FocusPagerAsync() at Telerik.Blazor.Components.TelerikGridBase`1.FocusCellAsync(GridNavigationCommandEventArgs args) at Telerik.Blazor.Components.TelerikGridBase`1.FocusAdjacentCellAsync(GridNavigationCommandEventArgs args, Int32 rowIndexOffset, Int32 columnIndexOffset) at Telerik.Blazor.Components.TelerikGridBase`1.FocusBottomCellAsync(GridNavigationCommandEventArgs args) at Telerik.Blazor.Components.TelerikGridBase`1.ExecuteNavigationCommandAsync(GridNavigationCommandEventArgs args) at Telerik.Blazor.Components.TelerikGridBase`1.ExecuteCommand(Object args) at Telerik.Blazor.Components.Grid.GridRowBase`1.OnExecuteCommand(GridCommandEventArgs commandArgs) at Telerik.Blazor.Components.Grid.GridDataCellBase`1.ExecuteCommandAsync(GridCommandEventArgs args) at Telerik.Blazor.Components.Grid.GridNavigableCellBase`1.ExecuteNavigationCommandAsync(String commandName, Int32 rowIndexOffset, Int32 columnIndexOffset, KeyboardEventArgs args) at Telerik.Blazor.Components.Grid.GridNavigableCellBase`1.ProcessKeyDown(KeyboardEventArgs args) at Telerik.Blazor.Components.Grid.GridContentCell`1.ProcessKeyDown(KeyboardEventArgs args) at Telerik.Blazor.Components.Grid.GridNavigableCellBase`1.OnKeyDown(KeyboardEventArgs args) at Microsoft.AspNetCore.Components.ComponentBase.CallStateHasChangedOnAsyncCompletion(Task task) at Microsoft.AspNetCore.Components.RenderTree.Renderer.GetErrorHandledTask(Task taskToHandle)
Hi.
Is it possiblle add a contextual menu on a grid row and choose actions for that row?
Thanks.
If I'm filtering a column containing enum values I expect a dropdown of available values to choose from (as it is the case when filtering a grid using telerik UI for .net core).
Unfortunately with Blazor Grids the filter for Enums displays a numberbox. This is not usable since the user does not know the IDs for the enum values.
Please let me know how I can get the filter to let the user choose from the available enum values!