This is a migrated thread and some comments may be shown as answers.

Row Selection and Virtualization

2 Answers 245 Views

Grid

This is a migrated thread and some comments may be shown as answers.

Van asked on 19 May 2020, 08:35 PM

virtualgrid.png

We have a need to be able to select from ~15,000 rows and need to use the RadGrid virtualization for a continuous grid instead of the "paging" mechanism. We have encountered 2 issues that hopefully you can assist with.

Issue 1:

When a user scrolls down in the grid - say row 5000, and they select a row, the code-behind does not receive the correct values that are displayed to the user but instead the value of the row as initially set - guessing since the grid doesn't really change, just the values. You can see this behavior in the sample code provided by setting a break in RadGrid1_ItemCommand and looking at the values coming into the method vs what is displayed to the user at that row.

Issue 2:

The scroll position is not maintained even when setting - ClientSettings-Scrolling-SaveScrollPosition="true".

Attached is a screen capture of the issues and code from captures to verify.

Is it possible to correct these issues or workaround???

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="SimpleGridVirtual.aspx.cs" Inherits="UX.SimpleGridVirtual" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<title></title>

</head>

<body>

<form id="form1" runat="server">

<telerik:RadScriptManager runat="server" ID="RadScriptManager1" />

<telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="false" Skin="Silk" />

<telerik:RadAjaxLoadingPanel runat="server" ID="RadAjaxLoadingPanel1"></telerik:RadAjaxLoadingPanel>

<telerik:RadAjaxPanel runat="server" ID="RadAjaxPanel" LoadingPanelID="RadAjaxLoadingPanel1" CssClass="demo-container">

<telerik:RadGrid ID="RadGrid1" runat="server" AutoGenerateColumns="true" AllowPaging="true" PageSize="10000" AllowMultiRowSelection="true"

AllowSorting="true" OnNeedDataSource="RadGrid1_NeedDataSource" ClientSettings-Selecting-AllowRowSelect="true" OnItemCommand="RadGrid1_ItemCommand" ClientSettings-Scrolling-SaveScrollPosition="true">

<ClientSettings ReorderColumnsOnClient="true" AllowColumnsReorder="true" ColumnsReorderMethod="Reorder" EnablePostBackOnRowClick="true">

<Virtualization EnableVirtualization="true" InitiallyCachedItemsCount="2000" ItemsPerView="100" />

<Scrolling AllowScroll="true" UseStaticHeaders="true" ScrollHeight="500px" />

<Resizing AllowColumnResize="true" />

</ClientSettings>

<MasterTableView>

<Columns>

<telerik:GridClientSelectColumn UniqueName="UserSelect" HeaderStyle-Width="100px"></telerik:GridClientSelectColumn>

<telerik:GridBoundColumn UniqueName="Column" HeaderText="Column" HeaderStyle-Width="300px" DataField="Column" Visible="true"></telerik:GridBoundColumn>

<telerik:GridBoundColumn UniqueName="Date" HeaderText="Date" HeaderStyle-Width="300px" DataField="Date"></telerik:GridBoundColumn>

</Columns>

</MasterTableView>

</telerik:RadGrid>

<asp:ListBox Height="300px" Width="300px" runat="server" ID="RowClickedStatus">

</asp:ListBox>

</telerik:RadAjaxPanel>

</form>

</body>

</html>

using System;

using System.Collections.Generic;

using System.Data;

using System.Linq;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

namespace UX

{

public partial class SimpleGridVirtual : System.Web.UI.Page

{

protected void Page_Load(object sender, EventArgs e)

{

}

protected void RadGrid1_NeedDataSource(object sender, Telerik.Web.UI.GridNeedDataSourceEventArgs e)

{

System.Diagnostics.Debug.WriteLine("Get DataSource");

RadGrid1.DataSource = GetDataSource();

}

private DataTable GetDataSource()

{

if (Session["datasource"] == null)

{

DataTable dt = new DataTable();

dt.Columns.Add("Column", typeof(string));

dt.Columns.Add("Date", typeof(string));

for (int i = 0; i < 10000; i++)

{

dt.Rows.Add("Row " + i.ToString(), DateTime.Now.AddDays(i) + "_" + i.ToString());

}

Session["datasource"] = dt;

}

return Session["datasource"] as DataTable;

}

protected void RadGrid1_ItemCommand(object sender, Telerik.Web.UI.GridCommandEventArgs e)

{

if ((string.Compare(e.CommandName, "RowClick", true) == 0) && (e.Item != null))

{

DataTable GridItems = Session["VirtualizationDataSource"] as DataTable;

List<string> SelectedItems = (List<string>)Session["CurrentSelections"];

string ColumnValue = e.Item.Cells[3].Text;

RowClickedStatus.Items.Add(ColumnValue);

System.Diagnostics.Debug.WriteLine("Got Value: " + ColumnValue);

string DateValue = e.Item.Cells[4].Text;

}

2 Answers, 1 is accepted

answered on 22 May 2020, 01:06 PM

Hi Van,

The Virtualization functionality does not render separate items for every row, instead, it uses the same rows and replaces their values. That means, the row with ID 1 will have the same item index as the first row on the second page, and therefore, if selecting the first item on the second page, the first occurrence of the item with that index (first row on the first page) will be chosen.

I am afraid that both Saving the Scroll position and Row/Cell Selection is a limitation of the Virtualization functionality of RadGrid. This is mentioned in the Limitation section of the Virtualization Documentation.

Kind regards,
Attila Antal
Progress Telerik

Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
Our thoughts here at Progress are with those affected by the outbreak.