When Virtual Scrolling is enabled and the grid is set to inline editing, clicking the Add button does not start editing on the first click. The button must be clicked twice for a new row to enter edit mode.
Steps to Reproduce:
1. Open this example - https://blazorrepl.telerik.com/QfaZEibY50abpby200
2. Scroll down the grid.
3. Click the "Add" button.
Upon the first click, a new row is inserted but then immediately closed. You have to click it a second time to insert a new row.
On the bright side, I don't have to write a repro code sample for this issue since this is present in the example on https://www.telerik.com/blazor-ui/documentation/components/grid/templates/popup-form-template#example
The popup for adding a new item now shows the values of the previously edited item. The same goes for editing any other item. As long as the popup is closed with the "x" in the top right, the edit context remains.
The Problem relates to the ExitGridEditMode method and when it is and isn't called. Specifically, it is not called when the edit popup is closed with the close button in the top right of the window. I have also not found any way to get notified about the edit popup being closed with the close button. The Grid contains a hard-coded <TelerikWindow> and there doesn't appear to be a way to influence this window action or any events that it triggers.
Hello,
there is inconsistency/behaviour/order in events of the Grid: OnStateInit and OnRead. Which leads to scenario with no clear sollution and would be nice to fix it, and how to solve it as "hotfix".
Also i think its not new in 12.x. release, it exists longer ;)
<TelerikGrid TItem="GData" @ref="gHL" OnRead=@GReadItems OnStateInit="@OnStateGHL">
...
<GridAggregates>
@if(1==2){...}
</GridAggregates>
@code{
protected async Task GReadItems(GridReadEventArgs args)
{
**hack for C)
if(gHL==null)return;//state init AVOID 2x call gread PRIOR OnStateInit
...// must be called:
args.AggregateResults = rr.ToDataSourceResult(args.Request).AggregateResults;
...
}
void OnStateGHL(GridStateEventArgs<GData> args) //or async Task doesnt matter
{
//default SORTing:args.GridState = new GridState<GData>
{
SortDescriptors = new List<Telerik.DataSource.SortDescriptor>
{
new Telerik.DataSource.SortDescriptor{ Member = nameof(GData.DatPorizeni), SortDirection = Telerik.DataSource.ListSortDirection.Descending },
//new Telerik.DataSource.SortDescriptor{ Member = nameof(GData.Skupina), SortDirection = Telerik.DataSource.ListSortDirection.Ascending }
}
};
}
}
Problematic scenarios, single page, same grid:
A) when NO aggregates markup EXISTS at all
1. OnStateInit
2. OnRead - gHL IS NULL
=OK
B) when EMPTY aggregates markup EXISTS
1. OnRead
2. OnStateInit
=FAIL
HOW to read and ui data with correct STATE?
https://www.telerik.com/blazor-ui/documentation/components/grid/state
cannot call gHL.rebind, also gHL is null
NONE initinal "sorting,filtering etc" is set, WRONG data,columns,displayed to the user
C) when SOME real aggregates markup EXISTS
1. OnRead
2. OnStateInit
3. OnRead
=partial FAIL("**hack used"), but managed by if(gHL==null)return
D) "hotfix" used with GridAggregates="@( HasAggregates ? GridAggregatesTemplate : null )"
act as A or C, but gHL is always null, which is also bad againts C)
Expected:
ALWAYS only A) - First 1.OnStateInit THEN 2.OnRead. its the best one, without any additional hacks = UNIFY the event orders and behaviour.
OR
A) or C)
everything else is unmanagable.
Especially when initial sorting "is must" and aggregates,columns and so on, are managed by user(non static)
B) is completly WRONG: incorrect event order of OnStateInit and OnRead
D) is againts C) (cannot detect reference of gHL)
related to:
https://feedback.telerik.com/blazor/1654029-onstateinit-does-not-fire-if-gridaggregates-exists-but-is-empty
https://www.telerik.com/forums/grid-onstateinit-event-and-onread-event-chaos
OR how to solve it generally = what is the way to LOAD gridState, and after that, LOAD Data by defined GridState?
Thanks
Column headers and column data do not match after reordering.
See this example: https://blazorrepl.telerik.com/GKkFcwlF54CvZoVp34
1. Reorder Group 1 and Group 2.
2. The column headers within these 2 groups are not reordered with their parent.
Reordering should work according to the rules specified in the documentation: https://www.telerik.com/blazor-ui/documentation/components/grid/columns/multi-column-headers#reordering
Hello,
seems like the GridToolbar(even the GridToolbarTemplate) in grid is not rendering "GridToolBarOverflowMode.Section". The "Scroll" mode is ok.
Is there any additional setup, or did i missed some setup...?
REPL:
https://blazorrepl.telerik.com/wqYQvvEq40GkajEZ30
based on:
https://www.telerik.com/blazor-ui/documentation/components/grid/toolbar
some mention about "sections" but it seems for another purpose:
https://www.telerik.com/blazor-ui/documentation/knowledge-base/common-net8-sections
Thanks
Hello,
we recently updated Telerik.UI.for.Blazor from 9.0.0 to 12.3.0, afterwords we noticed that in several instances where we use the `TelerikGrid` component, keyboard interactions stopped working. Specifically the `@onkeydown` seems to no longer propagate to parent elements of the grid. As this was not mentioned in the Breaking changes for the version 10 or 12 releases we assume this to be a bug.
here a simplified example:
<div style="padding: 0; width: @(ShowSidePanel ? "65%" : "99%")" tabindex="0" @onkeydown="@(OnKeyPress)">
<TelerikGrid TItem="IncomingInvoiceGridItemViewModel"
@ref="GridRef"
Class="admin-grid"
Height="@OverviewHeight"
RowHeight="50"
Pageable="false"
PageSize="PageSize"
FilterMode="@GridFilterMode.FilterMenu"
Sortable="true"
Resizable="true"
Reorderable="true"
ShowColumnMenu="true"
ScrollMode="@GridScrollMode.Virtual"
SelectionMode="@GridSelectionMode.Single"
OnStateInit="@OnStateInit_SetStateAsync"
OnStateChanged="@OnStateChanged_SaveStateAsync"
SelectedItemsChanged="@OnSelectedItemsChanged_LoadPdf"
OnRead="@OnRead_UpdateFilteredItems">
<GridSettings>
<GridColumnMenuSettings Lockable="false" />
</GridSettings>
...
<!-- aggregates, columns and noDataTemplate omitted -->
...
</TelerikGrid>
</div>Implementation / usages of the features did not change, only updates where changes required by the update Telerik.UI.for.Blazor from 9.0.0 to 12.3.0.
These were the dependencies updated alongside the update of Telerik.UI.for.Blazor from 9.0.0 to 12.3.0 :
An exception occurs if a Grid row is dropped in another empty Grid in RTL mode:
Error: System.FormatException: the input string '-1' was not in a correct format.
Hi,
The ask is for a feature request to take the already wonderfully done globally applied filter features down to a per column basis without the overhead and burden of resorting to the custom FilterMenuTemplate approach.
The current way of doing business creates much overhead in code particularly when several columns are involved.
Something like:
<TelerikGrid Data="@MyData"
FilterMode="@GridFilterMode.PerColumn"
<GridColumns>
<GridColumn Field="MyField01" FilterMode="@GridFilterColumnMode.FilterRow" />
<GridColumn Field="MyField02" FilterMode="@GridFilterColumnMode.FilterMenu" />
<GridColumn Field="MyField03" Filterable="false"/>
etc..
</GridColumns>
</TelerikGrid>
Thanks!
Ron
Introduced in v13.1.0. An item that has no text (empty string) renders a span (.k-list-item-text) with height 0px.
Steps to reproduce the behavior:
Also reproducible in: https://dojo.telerik.com/ZVOXYUsb/3
The item that has no text should have the same height as items that have text.
The height of the span.k-list-item-text is 0px.
Please specify the component(s) where the bug occurs: ___________
https://blazorrepl.telerik.com/mgEobKlm00OJm8OW55
https://dojo.telerik.com/ZVOXYUsb/3
<TelerikDropDownList Data="@DropDownListData" @bind-Value="DropDownListValue" />
@code {
private List<string> DropDownListData = new List<string>() { "Item1", string.Empty, "Item3" };
private string DropDownListValue { get; set; } = string.Empty;
protected override void OnInitialized()
{
DropDownListValue = string.Empty;
}
}<style>
.k-list-item-text {
min-height: 20px;
}
</style>
Hi Support,
I have an issue with the DragToSelect feature of a Telerik grid in Blazor when this grid is inside a TelerikWindow.
Summary
When a TelerikGrid configured with GridSelectionSettings DragToSelect="true" is rendered inside the <WindowContent> of a <TelerikWindow>, the drag-to-select (rubber-band) behavior is not working properly — the user can only select cells/rows via individual clicks.
Single-click selection continues to work in both cases. The issue is specific to the drag gesture.
Steps to reproduce
Create a page with a TelerikWindow set to Visible="true".
Inside <WindowContent>, place a TelerikGrid with:
SelectionMode="@GridSelectionMode.Multiple"
SelectedCells / SelectedCellsChanged bound
<GridSettings><GridSelectionSettings SelectionType="@GridSelectionType.Cell" DragToSelect="true" /></GridSettings>
Open the window and try to select multiple cells by pressing the mouse button on a cell and dragging over neighboring cells.
Expected behavior
A rubber-band selection rectangle appears and all cells the pointer passes over become selected — same as when the identical grid is placed on a regular page (outside a modal window).
Actual behavior
Drag selection occur rarely. Only the single cell under the initial mousedown gets selected. The rubber-band rectangle rarely appears, and SelectedCellsChanged fires with a single descriptor instead of the full drag range.
Minimal repro (REPL-ready)
<TelerikWindow Visible="true" Width="800px" Height="500px">
<WindowTitle>Repro</WindowTitle>
<WindowContent>
<TelerikGrid Data="@Data" TItem="SampleItem"
SelectionMode="@GridSelectionMode.Multiple"
SelectedCells="@SelectedCells"
SelectedCellsChanged="@((IEnumerable<GridSelectedCellDescriptor> c) => SelectedCells = c)">
<GridSettings>
<GridSelectionSettings SelectionType="@GridSelectionType.Cell" DragToSelect="true" />
</GridSettings>
<GridColumns>
<GridColumn Field="@nameof(SampleItem.Id)" />
<GridColumn Field="@nameof(SampleItem.Name)" />
</GridColumns>
</TelerikGrid>
</WindowContent>
</TelerikWindow>
@code {
public record SampleItem(int Id, string Name);
private List<SampleItem> Data = Enumerable.Range(1, 20).Select(i => new SampleItem(i, $"Item {i}")).ToList();
private IEnumerable<GridSelectedCellDescriptor> SelectedCells = Enumerable.Empty<GridSelectedCellDescriptor>();
}
Now my questions :
- Is this a known limitation of DragToSelect when the grid is inside a modal TelerikWindow?
- Is there an officially supported workaround (CSS pointer-events tweak on .k-overlay, event capture override, grid setting, etc.)?
- If it is a bug, could you open a public issue we can track?
Many thanks you in advance.
Franck Boisdé
(bug report only)
Regression introduced in 13.0.0.
1. Run this example: https://blazorrepl.telerik.com/wUuSGClv00orFeRm59
(optional)
The Size, Rounded, FillMode parameters are ignored.
The parameter values should apply and change the appearance of the SearchBox.