Triggering Edit in a Grid bound to a DataTable or ExpandoObject and with edit mode set to Popup throws an unhandled exception. This started to occur in 4.1.0 - the same code runs fine on 4.0.1
To reproduce:
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; } = "";
}
}
When the page is printed, the Grid is extended down onto multiple sheets of paper. This is because the Grid is large. The issue I am having is that the column headers are not repeating on each printed page. This makes the grid very hard to read. Is there a setting that can force the column headers to print on each printed page?
=====ADMIN EDIT=====
Reference: Repeated Table Headers Kendo jQuery.
For Excel export, this depends on: https://feedback.telerik.com/document-processing/1356293-print-titles.
For PDF export, this depends on: https://feedback.telerik.com/blazor/1434269-export-grid-to-pdf.
The filter list item menu defined as follows do not have accessible name. Please provide work around or fix that I can implement.
<TelerikGrid Data="@ViewModel.RouterAndDataLossInformation" TItem="TrafficLossSummary"
Pageable="true"
Sortable="true"
Groupable="false"
FilterMode="Telerik.Blazor.GridFilterMode.FilterRow"
Resizable="true"
Reorderable="true"
Height = "100%">
I noticed a different behavior when filtering programmatically through the state and when you use the filter UI.
When filtering programmatically the filter is set after the data arrives. I am using a FiltterMenu and the filter icon is colored to indicate there is an applied filter only after the data is filtered. When filtering from the menu, I can the opposite behavior - the filter is set first and then the data is filtered. To me, this seems to be the correct behavior.
Reproduction: https://blazorrepl.telerik.com/wSavwTPd367WqA9r37.
The Grid is supposed to show a loading animation when it detects a data operation that requires more than 600ms to complete. However, if this operation is triggered programmatically through the state and not through the UI, the loading indicator is not shown.
Reproduction: https://blazorrepl.telerik.com/mSuPQpvx498wHvV816.
===
ADMIN EDIT
===
A possible workaround for the time being is to use a LoaderContainer component when invoking programmatic data operation similar to how the initial loader is shown here: https://demos.telerik.com/blazor-ui/grid/loading-animation.
I want to be able to enter numbers and the grid to filter numeric fields too according to those numbers. Enums would be nice too.
**Admin Edit**
The feature request will be researched and evaluated. It contradicts to our datasource filtering logic that relies on the type of the fields. Thus, it is highly possible that we will handle the task through a knowledge base example.
**Admin Edit**
The request targets a hierarchical Grid where some items are expanded - when I edit a parent item and then update it, all the respective detail items collapse.
Please add support for persisting the expanded state of the items.
---
ADMIN EDIT
---
The feature applies to the other data operations as well (for example, paging, sorting, filtering etc.).
https://docs.telerik.com/blazor-ui/components/grid/editing/incell#notes
I am using an EditorTemplate with a method called ChangeHandler(). After clicking in another row everything works fine but if I leave the cell by pressing enter the UpdateHandler gets called more than two times and comparing args.Item with the GridItem doesn't help because the calls are asynchronous.
=====
Admin Edit
With 2.22.0, the InCell editing mode was revamped to provide better user experience and this alters the way it worked. In the common case, there will no longer be double OnUpdate calls (unless explicit application logic invokes them). With 2.23.0, Tab and Enter keys that bubble from editor templates will be handled by the grid like they are handled for the built-in editors.
This means that this issue is, effectively, solved. You can see the Notes section about editor templates to see how you can also handle the OnBlur event to capture mouse clicks outside of the component so that you can save changes and remove the edited item. See the full notes here (the Event Sequence section was heavily revamped for clarity) and here on editor template behavior.
Thus, the previous ides about Save and Cancel methods on the edit context might not be implemented, which will also be one breaking change that we could avoid:
After discussion with the development team, the proposed resolution is to provide a context that provides Save/Cancel operations. The goal is to provide easier configuration for IncellEditing and EditorTemplates and consistent behavior with mouse and keyboard interaction. However, the change will introduce a breaking change in our EditorTemplate, should be researched further and that is why this is logged as a feature request.
=====
I want to add a custom sort comparer but I don't want to perform the whole sorting manually through the OnRead event.
Please allow adding custom expressions that will be applied to the query that the DataSource package does for easier customizations of the data operations.