Grid - Virtualization

1Sales AgentPascale CartrainSpain
2Marketing ManagerPatricio SimpsonBulgaria
3Marketing ManagerHanna MoosArgentina
4Sales RepresentativeAntonio MorenoFrance
5Sales RepresentativePascale CartrainFrance
6OwnerPatricio SimpsonUSA
7Marketing AssistantGeorg PippsAustria
8Marketing AssistantPascale CartrainSpain
9Sales RepresentativeElizabeth LincolnSpain
10OwnerElizabeth LincolnUSA
11Sales AgentHanna MoosBrazil
12Marketing ManagerPatricio SimpsonEngland
13Marketing AssistantPatricio SimpsonBulgaria
14Accounting ManagerJaime YorresArgentina
15Sales ConsultantGeorg PippsAustria
16Sales ConsultantAntonio MorenoItaly
17Sales AssociateJaime YorresSpain
18Sales AssociatePascale CartrainEngland
19Sales ManagerPatricio SimpsonArgentina
20Sales AgentGeorg PippsGermany
21Marketing AssistantJaime YorresGermany
22Sales ConsultantHanna MoosSpain
23AccountantJaime YorresUSA
24OwnerHanna MoosArgentina
25Marketing AssistantGeorg PippsFrance
26Sales AssociatePaul HenriotBulgaria
27Sales AssociateHanna MoosUSA
28Marketing ManagerGeorg PippsFrance
29Sales AgentPatricio SimpsonGermany
30Sales RepresentativePascale CartrainAustria
31Marketing ManagerJaime YorresGermany
32OwnerJaime YorresSpain
33Sales AgentElizabeth LincolnFrance
34Sales AgentElizabeth LincolnItaly
35Sales AssociateHanna MoosItaly
36Accounting ManagerGeorg PippsAustria
37Marketing AssistantHanna MoosBulgaria
38Accounting ManagerJaime YorresItaly
39OwnerJaime YorresArgentina
40AccountantElizabeth LincolnUSA
41Accounting ManagerJaime YorresFrance
42Sales RepresentativePaul HenriotBrazil
43AccountantPaul HenriotSpain
44Sales AssociatePascale CartrainSpain
45OwnerPascale CartrainBrazil
46OwnerElizabeth LincolnEngland
47Accounting ManagerHanna MoosArgentina
48Sales RepresentativeHoward SnyderBrazil
49AccountantPatricio SimpsonEngland
50Sales ConsultantMatti KarttunenEngland
51Sales ConsultantMatti KarttunenItaly
52Sales AgentPascale CartrainItaly
53Sales ConsultantPascale CartrainFrance
54Sales AgentJaime YorresGermany
55Sales RepresentativeMatti KarttunenBulgaria
56Sales AgentPaul HenriotArgentina
57Sales RepresentativeHanna MoosItaly
58Sales AssociatePascale CartrainItaly
59Sales AssociatePaul HenriotArgentina
60Sales RepresentativePatricio SimpsonBulgaria
61OwnerAntonio MorenoAustria
62Accounting ManagerAntonio MorenoAustria
63AccountantPascale CartrainFrance
64Marketing ManagerHanna MoosItaly
65Sales ConsultantGeorg PippsAustria
66Sales RepresentativeJaime YorresItaly
67Sales ConsultantPatricio SimpsonSpain
68Sales ManagerPaul HenriotEngland
69Accounting ManagerPascale CartrainEngland
70Sales AssociateHoward SnyderSpain
71Sales AgentPatricio SimpsonAustria
72Sales ConsultantAntonio MorenoSpain
73Sales RepresentativeHanna MoosItaly
74OwnerPatricio SimpsonGermany
75Sales AgentElizabeth LincolnFrance
76OwnerMatti KarttunenFrance
77Sales ConsultantAntonio MorenoAustria
78Accounting ManagerGeorg PippsUSA
79Sales AssociateHanna MoosAustria
80Sales AssociatePascale CartrainFrance
81AccountantMatti KarttunenItaly
82Marketing ManagerJaime YorresFrance
83Marketing ManagerPascale CartrainFrance
84Sales AgentPaul HenriotEngland
85Marketing AssistantJaime YorresSpain
86OwnerHoward SnyderItaly
87Sales AgentGeorg PippsSpain
88Marketing ManagerAntonio MorenoAustria
89Sales ManagerPatricio SimpsonUSA
90Marketing ManagerHoward SnyderBulgaria
91AccountantAntonio MorenoEngland
92Sales AssociatePaul HenriotBrazil
93Marketing ManagerAntonio MorenoGermany
94OwnerElizabeth LincolnUSA
95Sales ManagerGeorg PippsBulgaria
96AccountantHoward SnyderSpain
97Marketing ManagerPascale CartrainAustria
98AccountantHoward SnyderEngland
99AccountantPascale CartrainEngland
100Sales RepresentativeHoward SnyderItaly
 Item 1 to 1000 of 300000
Page:
of 300 Page size:
  • Sort Ascending
  • Sort Descending
  • Clear Sorting
  • Columns
Isolate this demo as a stand-alone application
  • About this demo
  • C#
  • VB
RadGrid's virtualization feature allows you to handle hundreds of thousands of rows without negatively impacting the user experience. The control achieves this thanks to its ItemsPerView property allowing you to control the number of items loaded at a time. Users can now scroll, as well as show, hide, resize and reorder columns without any waiting time.

This demo shows how quickly Telerik's ASP.NET DataGrid can handle user interactions with 300,000 items. You can configure the component to allow scrolling through the entire data set or only through the current page by using EnableCurrentPageScrollOnly property,.
  • DefaultCS.aspx
  • DefaultCS.aspx.cs
  • styles.css
<%@ Page Language="c#" CodeFile="DefaultCS.aspx.cs" Inherits="Telerik.GridExamplesCSharp.Performance.Virtualization.DefaultCS" %>

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<%@ Register TagPrefix="qsf" Namespace="Telerik.QuickStart" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns='http://www.w3.org/1999/xhtml'>
<head runat="server">
    <title>Telerik ASP.NET Example</title>
    <link href="styles.css" rel="stylesheet" />
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
    <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />
    <telerik:RadAjaxLoadingPanel runat="server" ID="RadAjaxLoadingPanel1"></telerik:RadAjaxLoadingPanel>
    <telerik:RadAjaxPanel runat="server" ID="RadAjaxPanel" LoadingPanelID="RadAjaxLoadingPanel1" CssClass="demo-container">
        <telerik:RadGrid RenderMode="Lightweight" ID="RadGrid1" runat="server"  AutoGenerateColumns="false"
            AllowSorting="true" GroupingEnabled="false"
            EnableHeaderContextMenu="true" AllowPaging="true" PageSize="1000" OnNeedDataSource="RadGrid1_NeedDataSource">
            <MasterTableView TableLayout="Fixed">
                <Columns>
                    <telerik:GridBoundColumn UniqueName="ID" HeaderText="ID" HeaderStyle-Width="50px" DataField="ID"></telerik:GridBoundColumn>
                    <telerik:GridBoundColumn UniqueName="ContactTitle" HeaderText="Contact Title" HeaderStyle-Width="150px" DataField="ContactTitle"></telerik:GridBoundColumn>
                    <telerik:GridBoundColumn UniqueName="ContactName" HeaderText="Contact Name" HeaderStyle-Width="150" DataField="ContactName"></telerik:GridBoundColumn>
                    <telerik:GridBoundColumn UniqueName="Country" HeaderText="Country" HeaderStyle-Width="100px" DataField="Country"></telerik:GridBoundColumn>
                    <telerik:GridRatingColumn UniqueName="Rating" HeaderText="Rating" HeaderStyle-Width="100px" DataField="Rating"></telerik:GridRatingColumn>
                </Columns>
            </MasterTableView>
            <ClientSettings ReorderColumnsOnClient="true" AllowColumnsReorder="true" ColumnsReorderMethod="Reorder">
                <Virtualization EnableVirtualization="true" InitiallyCachedItemsCount="2000"
                    LoadingPanelID="RadAjaxLoadingPanel1" ItemsPerView="100"/>
                <Scrolling AllowScroll="true" UseStaticHeaders="true" ScrollHeight="500px" />
                <Resizing AllowColumnResize="true" />
            </ClientSettings>
            <PagerStyle Mode="NextPrevNumericAndAdvanced"></PagerStyle>
        </telerik:RadGrid>
    </telerik:RadAjaxPanel>
    </form>
</body>
</html>

Find Assistance

Help Us Improve

Was this example helpful?