Grid - Virtualization

1Sales ConsultantPaul HenriotFrance
2Marketing AssistantPaul HenriotGermany
3Sales RepresentativePaul HenriotSpain
4Sales RepresentativePaul HenriotItaly
5Sales AssociatePatricio SimpsonGermany
6OwnerPaul HenriotFrance
7OwnerMatti KarttunenItaly
8Accounting ManagerPatricio SimpsonGermany
9Marketing AssistantHanna MoosGermany
10Sales AssociateMatti KarttunenItaly
11Sales AssociateJaime YorresSpain
12Marketing AssistantPatricio SimpsonItaly
13OwnerHoward SnyderSpain
14OwnerPatricio SimpsonGermany
15AccountantElizabeth LincolnItaly
16Sales ManagerElizabeth LincolnAustria
17Sales ManagerPatricio SimpsonItaly
18Marketing AssistantPaul HenriotUSA
19OwnerPatricio SimpsonArgentina
20Marketing ManagerJaime YorresArgentina
21AccountantJaime YorresEngland
22Sales ConsultantHanna MoosItaly
23OwnerPaul HenriotSpain
24Sales ConsultantHoward SnyderArgentina
25Sales AssociateHoward SnyderSpain
26Accounting ManagerMatti KarttunenItaly
27Sales ConsultantHoward SnyderBulgaria
28Sales AssociateJaime YorresArgentina
29Marketing AssistantHanna MoosBrazil
30Accounting ManagerJaime YorresFrance
31Sales ManagerElizabeth LincolnAustria
32AccountantAntonio MorenoArgentina
33Sales RepresentativeMatti KarttunenGermany
34OwnerAntonio MorenoEngland
35Sales ManagerGeorg PippsArgentina
36Marketing AssistantMatti KarttunenBulgaria
37Sales AgentPascale CartrainSpain
38Marketing AssistantJaime YorresUSA
39Sales AgentGeorg PippsBulgaria
40Marketing AssistantPascale CartrainBulgaria
41Marketing ManagerPascale CartrainBulgaria
42Sales RepresentativePascale CartrainSpain
43Sales AssociateGeorg PippsItaly
44Sales AssociateAntonio MorenoGermany
45Sales ConsultantHoward SnyderGermany
46Sales ManagerPatricio SimpsonArgentina
47AccountantElizabeth LincolnGermany
48Sales ConsultantElizabeth LincolnGermany
49AccountantJaime YorresBulgaria
50Marketing AssistantElizabeth LincolnSpain
51Sales ManagerMatti KarttunenSpain
52Sales AssociateGeorg PippsAustria
53Sales AssociateHoward SnyderBulgaria
54Sales ConsultantPatricio SimpsonArgentina
55Marketing ManagerPaul HenriotUSA
56OwnerMatti KarttunenGermany
57AccountantHoward SnyderFrance
58Sales ConsultantPatricio SimpsonSpain
59Sales RepresentativeAntonio MorenoAustria
60AccountantHanna MoosSpain
61Sales AgentGeorg PippsAustria
62OwnerPascale CartrainAustria
63OwnerAntonio MorenoGermany
64Marketing AssistantPatricio SimpsonAustria
65Sales ConsultantMatti KarttunenBulgaria
66Marketing ManagerMatti KarttunenAustria
67Sales ManagerPatricio SimpsonUSA
68OwnerHoward SnyderUSA
69Sales RepresentativeHoward SnyderEngland
70Sales ConsultantHoward SnyderSpain
71Sales ConsultantHoward SnyderUSA
72Sales AgentHoward SnyderAustria
73Sales RepresentativePatricio SimpsonBrazil
74AccountantPatricio SimpsonSpain
75Accounting ManagerPaul HenriotSpain
76Sales RepresentativePatricio SimpsonAustria
77Marketing AssistantElizabeth LincolnUSA
78OwnerGeorg PippsArgentina
79Accounting ManagerHoward SnyderFrance
80Sales ConsultantHoward SnyderGermany
81Sales AssociateHanna MoosGermany
82AccountantMatti KarttunenEngland
83OwnerHoward SnyderAustria
84OwnerJaime YorresGermany
85Sales RepresentativeMatti KarttunenBulgaria
86Sales AssociateHoward SnyderFrance
87AccountantPaul HenriotFrance
88Sales AssociateGeorg PippsAustria
89AccountantHoward SnyderAustria
90Accounting ManagerMatti KarttunenItaly
91OwnerPaul HenriotBulgaria
92Sales AssociateGeorg PippsSpain
93Sales AgentPaul HenriotArgentina
94Sales ManagerHanna MoosFrance
95Marketing ManagerElizabeth LincolnUSA
96Marketing ManagerGeorg PippsItaly
97Sales ManagerMatti KarttunenItaly
98Sales AssociateAntonio MorenoBrazil
99Sales AgentAntonio MorenoBrazil
100Accounting ManagerPascale CartrainItaly
 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?