Web20 skin

Grid - Virtualization

1Marketing ManagerGeorg PippsSpain
2Accounting ManagerPascale CartrainArgentina
3Accounting ManagerPascale CartrainArgentina
4Sales ManagerMatti KarttunenFrance
5Sales AssociateMatti KarttunenAustria
6OwnerHoward SnyderArgentina
7Sales ManagerMatti KarttunenUSA
8Marketing AssistantJaime YorresGermany
9Marketing ManagerAntonio MorenoEngland
10Sales AgentPatricio SimpsonBrazil
11OwnerGeorg PippsSpain
12Sales AgentMatti KarttunenEngland
13AccountantMatti KarttunenUSA
14Accounting ManagerGeorg PippsArgentina
15Marketing ManagerAntonio MorenoFrance
16Sales AgentPascale CartrainBrazil
17Marketing AssistantHoward SnyderSpain
18Sales RepresentativePascale CartrainSpain
19AccountantHanna MoosUSA
20Sales AgentAntonio MorenoArgentina
21OwnerElizabeth LincolnBulgaria
22Marketing AssistantPaul HenriotBrazil
23Marketing ManagerPatricio SimpsonAustria
24Sales RepresentativePaul HenriotEngland
25Sales RepresentativePascale CartrainItaly
26AccountantPascale CartrainGermany
27Sales RepresentativeElizabeth LincolnBulgaria
28Sales RepresentativeHanna MoosArgentina
29Sales AssociateElizabeth LincolnSpain
30Sales RepresentativeElizabeth LincolnFrance
31Accounting ManagerHanna MoosGermany
32Sales AssociateAntonio MorenoFrance
33Sales AssociateHanna MoosUSA
34Sales ManagerElizabeth LincolnArgentina
35Sales ManagerPatricio SimpsonItaly
36AccountantJaime YorresFrance
37Sales AgentHanna MoosBrazil
38Marketing AssistantPatricio SimpsonSpain
39OwnerHanna MoosAustria
40OwnerJaime YorresUSA
41Sales AssociateJaime YorresBulgaria
42Sales ManagerJaime YorresItaly
43Sales AgentPatricio SimpsonArgentina
44Accounting ManagerHoward SnyderFrance
45Sales ConsultantGeorg PippsAustria
46Sales RepresentativeElizabeth LincolnBulgaria
47Marketing ManagerPascale CartrainItaly
48Accounting ManagerPatricio SimpsonAustria
49Sales AssociateHoward SnyderItaly
50Sales ConsultantAntonio MorenoArgentina
51Sales AgentPascale CartrainBulgaria
52Marketing AssistantGeorg PippsBrazil
53Accounting ManagerHoward SnyderItaly
54Accounting ManagerAntonio MorenoBulgaria
55Sales AssociateHoward SnyderBrazil
56Marketing ManagerElizabeth LincolnUSA
57AccountantAntonio MorenoFrance
58OwnerPatricio SimpsonItaly
59OwnerPaul HenriotArgentina
60Sales RepresentativeJaime YorresEngland
61Sales RepresentativePascale CartrainAustria
62Sales ConsultantHoward SnyderGermany
63Sales ManagerHoward SnyderFrance
64Marketing AssistantElizabeth LincolnBulgaria
65Sales ConsultantPascale CartrainGermany
66Accounting ManagerHoward SnyderItaly
67Sales ManagerPascale CartrainEngland
68Sales ConsultantHanna MoosBulgaria
69Accounting ManagerPatricio SimpsonArgentina
70Accounting ManagerPatricio SimpsonGermany
71Sales ManagerPascale CartrainBrazil
72Accounting ManagerGeorg PippsArgentina
73Sales RepresentativeHoward SnyderEngland
74Accounting ManagerHanna MoosBrazil
75Sales AgentElizabeth LincolnUSA
76Accounting ManagerJaime YorresBrazil
77Marketing AssistantMatti KarttunenArgentina
78Marketing ManagerHoward SnyderSpain
79Sales ManagerAntonio MorenoItaly
80Marketing AssistantPascale CartrainBrazil
81Sales RepresentativePascale CartrainUSA
82Sales ManagerAntonio MorenoFrance
83Marketing AssistantHanna MoosArgentina
84Accounting ManagerHanna MoosEngland
85Sales ManagerPascale CartrainAustria
86Sales ConsultantMatti KarttunenUSA
87Accounting ManagerJaime YorresItaly
88AccountantPascale CartrainUSA
89Sales RepresentativeMatti KarttunenSpain
90Sales AgentPascale CartrainFrance
91Sales ConsultantElizabeth LincolnAustria
92Sales AgentGeorg PippsBulgaria
93Sales AgentHoward SnyderAustria
94AccountantMatti KarttunenBrazil
95OwnerHoward SnyderAustria
96OwnerPaul HenriotBulgaria
97AccountantHanna MoosBulgaria
98Sales ConsultantGeorg PippsAustria
99Sales RepresentativePascale CartrainArgentina
100Accounting ManagerJaime YorresBrazil
 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?