Rendered DetailItemTemplate rows are not taken into account in some scenarios

Progress® Telerik® UI for ASP.NET AJAX Feedback Portal

Create an account Log In

Back to Feed

Request a Feature Report a Bug

Unplanned

Last Updated: 08 Apr 2020 14:52 by ADMIN

Vidya

Created on: 12 Feb 2020 11:25

Category: Grid

Type: Bug Report

Rendered DetailItemTemplate rows are not taken into account in some scenarios - RadGrid Client-Side Binding

Issue #1. When the Grid is not having any records (i.e. when the grid is initialized for the first time), if we define the Detail Item Template than the item template is shown 10-11 times.

Issue#2: When we have the pagination enabled in the grid and the records are fully filled on the first page and suppose the second page is half-filled with records, then in this scenario On the second page even the records of the first page are hidden but the data item template for those rows are visible which is not correct. Screenshot is attached.

Issue #3: The same scenario is happening when we searched the grid first with 10 records and then we search for 2 records, In this case also 8 records will be removed but there data item templates will still be visible on the grid.

1 comment

ADMIN

Attila Antal

Posted on: 12 Feb 2020 11:28

The problem is that the Grid does not take into consideration the DetailItemTemplate when using Client-Side binding, thus if hiding items/rows as a result of filtering, the templates remain visible.

For example, if using a template and binding 10 rows to RadGrid. The number of rendered TR elements will be 20, out of which 10 are data items and each comes with an additional item (template). If filtering to reduce the number of records, the dataItems will be hidden, templates will not. If filtering returns 2 dataItems, the page will contain 12 items in total (2 data item + 10 template item).

A potential workaround for this would be to use CSS to hide the templates of each hidden data

div.RadGrid tbody tr[style*="display:none"] + tr:not([id]),
div.RadGrid tbody tr[style*="display: none"] + tr:not([id]) {
    display: none;
}

Create an account Log In

View

Type

Status