MetroTouch skin

Grid - Virtualization

1AccountantAntonio MorenoBulgaria
2Sales AgentPaul HenriotBrazil
3Sales ManagerElizabeth LincolnBulgaria
4Accounting ManagerJaime YorresGermany
5AccountantGeorg PippsUSA
6Sales ManagerAntonio MorenoEngland
7Marketing AssistantPatricio SimpsonBrazil
8AccountantGeorg PippsSpain
9OwnerElizabeth LincolnUSA
10AccountantPatricio SimpsonEngland
11Marketing AssistantHoward SnyderAustria
12Accounting ManagerPaul HenriotEngland
13Marketing AssistantPatricio SimpsonBrazil
14Accounting ManagerHanna MoosFrance
15AccountantMatti KarttunenArgentina
16Marketing AssistantAntonio MorenoSpain
17Marketing ManagerPascale CartrainEngland
18AccountantJaime YorresUSA
19Marketing AssistantMatti KarttunenSpain
20Sales AssociateJaime YorresAustria
21Marketing ManagerGeorg PippsArgentina
22Marketing ManagerPaul HenriotAustria
23OwnerJaime YorresEngland
24Sales RepresentativePatricio SimpsonFrance
25Sales AgentElizabeth LincolnEngland
26Sales ConsultantPaul HenriotAustria
27Sales AgentJaime YorresAustria
28OwnerPatricio SimpsonFrance
29Sales AgentMatti KarttunenItaly
30Marketing ManagerHoward SnyderGermany
31Accounting ManagerAntonio MorenoBulgaria
32Sales ConsultantGeorg PippsFrance
33Sales AssociateHanna MoosBulgaria
34Sales ManagerPascale CartrainUSA
35Sales RepresentativeGeorg PippsGermany
36OwnerHanna MoosFrance
37Marketing AssistantJaime YorresArgentina
38Sales AgentMatti KarttunenUSA
39Sales ManagerHoward SnyderBrazil
40Marketing ManagerJaime YorresSpain
41OwnerJaime YorresBrazil
42AccountantPatricio SimpsonArgentina
43Accounting ManagerElizabeth LincolnEngland
44OwnerGeorg PippsEngland
45AccountantMatti KarttunenArgentina
46Marketing AssistantPatricio SimpsonArgentina
47Sales ConsultantJaime YorresUSA
48Marketing ManagerElizabeth LincolnItaly
49AccountantElizabeth LincolnAustria
50Sales ConsultantPatricio SimpsonBulgaria
51Sales AgentPatricio SimpsonBrazil
52OwnerPatricio SimpsonItaly
53OwnerJaime YorresFrance
54Sales RepresentativeMatti KarttunenEngland
55Sales RepresentativeJaime YorresGermany
56Sales AssociateElizabeth LincolnFrance
57Sales AssociateMatti KarttunenUSA
58AccountantHanna MoosBrazil
59OwnerElizabeth LincolnBulgaria
60OwnerMatti KarttunenSpain
61Marketing ManagerElizabeth LincolnItaly
62Sales AssociateMatti KarttunenArgentina
63Sales ManagerPatricio SimpsonGermany
64Marketing AssistantPatricio SimpsonArgentina
65Sales ManagerAntonio MorenoFrance
66Sales RepresentativePaul HenriotSpain
67Accounting ManagerAntonio MorenoFrance
68Accounting ManagerGeorg PippsBulgaria
69Sales RepresentativeGeorg PippsAustria
70Sales ManagerPaul HenriotBrazil
71AccountantElizabeth LincolnItaly
72Sales ConsultantElizabeth LincolnFrance
73OwnerHoward SnyderBrazil
74Sales RepresentativeAntonio MorenoItaly
75Marketing ManagerMatti KarttunenBulgaria
76Marketing ManagerHanna MoosGermany
77OwnerPascale CartrainBrazil
78Sales AgentPatricio SimpsonBulgaria
79Marketing ManagerHanna MoosGermany
80Accounting ManagerPatricio SimpsonArgentina
81Sales RepresentativeHanna MoosBulgaria
82Sales AssociateElizabeth LincolnItaly
83Accounting ManagerJaime YorresUSA
84Marketing AssistantElizabeth LincolnEngland
85Sales ManagerPaul HenriotBrazil
86Sales ManagerGeorg PippsItaly
87Sales AssociateElizabeth LincolnBrazil
88Sales ConsultantElizabeth LincolnArgentina
89Sales ManagerHoward SnyderUSA
90Marketing ManagerJaime YorresBulgaria
91Marketing ManagerHoward SnyderUSA
92Sales AgentElizabeth LincolnEngland
93Sales AgentGeorg PippsBulgaria
94Sales AgentGeorg PippsGermany
95OwnerJaime YorresBulgaria
96Sales ConsultantJaime YorresBrazil
97AccountantPascale CartrainItaly
98AccountantPascale CartrainAustria
99Sales ManagerElizabeth LincolnUSA
100Sales AgentElizabeth LincolnSpain
 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?