ListView - Predefined layouts

  • Floated Tiles
  • Grid
  • Unordered List
  • Ordered List
  • Flow
  • Single Row

1
Chai
10 boxes x 20 bags
18.00
39

2
Chang
24 - 12 oz bottles
19.00
17

3
Aniseed Syrup
12 - 550 ml bottles
10.00
13

4
Chef Anton's Cajun Seasoning
48 - 6 oz jars
22.00
53

5
Chef Anton's Gumbo Mix
36 boxes
21.35
0

6
Grandma's Boysenberry Spread
12 - 8 oz jars
25.00
120

7
Uncle Bob's Organic Dried Pears
12 - 1 lb pkgs.
30.00
15
ProductID ProductName QuantityPerUnit UnitPrice UnitsInStock
123
1 Chai 10 boxes x 20 bags 18.00 39
2 Chang 24 - 12 oz bottles 19.00 17
3 Aniseed Syrup 12 - 550 ml bottles 10.00 13
4 Chef Anton's Cajun Seasoning 48 - 6 oz jars 22.00 53
5 Chef Anton's Gumbo Mix 36 boxes 21.35 0
6 Grandma's Boysenberry Spread 12 - 8 oz jars 25.00 120
7 Uncle Bob's Organic Dried Pears 12 - 1 lb pkgs. 30.00 15
8 Northwoods Cranberry Sauce 12 - 12 oz jars 40.00 6
9 Mishi Kobe Niku 18 - 500 g pkgs. 97.00 29
10 Ikura 12 - 200 ml jars 31.00 31
  •  1  Chai  10 boxes x 20 bags  18.00  39
  •  2  Chang  24 - 12 oz bottles  19.00  17
  •  3  Aniseed Syrup  12 - 550 ml bottles  10.00  13
  •  4  Chef Anton's Cajun Seasoning  48 - 6 oz jars  22.00  53
  •  5  Chef Anton's Gumbo Mix  36 boxes  21.35  0
  •  6  Grandma's Boysenberry Spread  12 - 8 oz jars  25.00  120
  •  7  Uncle Bob's Organic Dried Pears  12 - 1 lb pkgs.  30.00  15
  •  8  Northwoods Cranberry Sauce  12 - 12 oz jars  40.00  6
  •  9  Mishi Kobe Niku  18 - 500 g pkgs.  97.00  29
  •  10  Ikura  12 - 200 ml jars  31.00  31
123
  1.  1  Chai  10 boxes x 20 bags  18.00  39
  2.  2  Chang  24 - 12 oz bottles  19.00  17
  3.  3  Aniseed Syrup  12 - 550 ml bottles  10.00  13
  4.  4  Chef Anton's Cajun Seasoning  48 - 6 oz jars  22.00  53
  5.  5  Chef Anton's Gumbo Mix  36 boxes  21.35  0
  6.  6  Grandma's Boysenberry Spread  12 - 8 oz jars  25.00  120
  7.  7  Uncle Bob's Organic Dried Pears  12 - 1 lb pkgs.  30.00  15
  8.  8  Northwoods Cranberry Sauce  12 - 12 oz jars  40.00  6
  9.  9  Mishi Kobe Niku  18 - 500 g pkgs.  97.00  29
  10.  10  Ikura  12 - 200 ml jars  31.00  31
123
 1  Chai  10 boxes x 20 bags  18.00  39
 2  Chang  24 - 12 oz bottles  19.00  17
 3  Aniseed Syrup  12 - 550 ml bottles  10.00  13
 4  Chef Anton's Cajun Seasoning  48 - 6 oz jars  22.00  53
 5  Chef Anton's Gumbo Mix  36 boxes  21.35  0
 6  Grandma's Boysenberry Spread  12 - 8 oz jars  25.00  120
 7  Uncle Bob's Organic Dried Pears  12 - 1 lb pkgs.  30.00  15
 8  Northwoods Cranberry Sauce  12 - 12 oz jars  40.00  6
 9  Mishi Kobe Niku  18 - 500 g pkgs.  97.00  29
 10  Ikura  12 - 200 ml jars  31.00  31
123
1
Chai
10 boxes x 20 bags
18.00
39
2
Chang
24 - 12 oz bottles
19.00
17
3
Aniseed Syrup
12 - 550 ml bottles
10.00
13
4
Chef Anton's Cajun Seasoning
48 - 6 oz jars
22.00
53
5
Chef Anton's Gumbo Mix
36 boxes
21.35
0
6
Grandma's Boysenberry Spread
12 - 8 oz jars
25.00
120
7
Uncle Bob's Organic Dried Pears
12 - 1 lb pkgs.
30.00
15
Isolate this demo as a stand-alone application
  • About this demo
  • C#
  • VB

RadListView gives you the opportunity to specify custom layouts and thus display your data in any preferrable way. In addition, as a greater convenience to the developer, the control offers five predefined layouts that enable you to display your data as a Grid, as an Ordered or Unordered list, in a flow or single row pattern.

In order to take advantage of this feature of RadListView's you need to use the smart tag control designer and pick the Open Layout Editor option. The designer will open a dialog window where you can choose the preferred layout, the skin that should be applied to the control as well as several other options related to operations on the data populating the ListView. After a layout has been chosen the designer will automatically generate the necessary mark-up and binding expressions.

This example demonstrates all five predefined layouts. Just go over the tab strip options to see what display pattern the given layout offers.

This demo demonstrates the predefined layouts of the RadListView control. Switch the tab options to see the different possibilities to layout your control without writing any code for this.
  • DefaultCS.aspx
  • DefaultCS.aspx.cs
  • styles.css
<%@ Page Language="C#"  CodeFile="DefaultCS.aspx.cs"
    Inherits="ListView.Examples.PredefinedLayouts.DefaultCS" AutoEventWireup="true" %>

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<!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" />
    <div class="demo-container">
        <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
            <AjaxSettings>
                <telerik:AjaxSetting AjaxControlID="ListViewPanel">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="ListViewPanel" LoadingPanelID="RadAjaxLoadingPanel1"></telerik:AjaxUpdatedControl>
                    </UpdatedControls>
                </telerik:AjaxSetting>
            </AjaxSettings>
        </telerik:RadAjaxManager>
        <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server">
        </telerik:RadAjaxLoadingPanel>
        <telerik:RadTabStrip RenderMode="Lightweight" runat="server" ID="LayoutsTabStrip" MultiPageID="LayoutsMultiPage"
            ShowBaseLine="true">
            <Tabs>
                <telerik:RadTab Text="Floated Tiles" Selected="true">
                </telerik:RadTab>
                <telerik:RadTab Text="Grid">
                </telerik:RadTab>
                <telerik:RadTab Text="Unordered List">
                </telerik:RadTab>
                <telerik:RadTab Text="Ordered List">
                </telerik:RadTab>
                <telerik:RadTab Text="Flow">
                </telerik:RadTab>
                <telerik:RadTab Text="Single Row">
                </telerik:RadTab>
            </Tabs>
        </telerik:RadTabStrip>
        <asp:Panel runat="server" ID="ListViewPanel" CssClass="mainPanel">
            <telerik:RadMultiPage runat="server" ID="LayoutsMultiPage">
                <telerik:RadPageView ID="RadPageView1" runat="server" Selected="true">
                    <telerik:RadListView runat="server" ID="FloatedTilesListView" RenderMode="Lightweight" AllowPaging="True"
                        DataKeyNames="ProductID" DataSourceID="SqlDataSource1">
                        <AlternatingItemTemplate>
                            <div class="rlvA productItemWrapper" >
                                <br />
                                <asp:Label ID="ProductIDLabel" runat="server" Text='<%# Eval("ProductID") %>'></asp:Label>
                                <br />
                                <asp:Label ID="ProductNameLabel" runat="server" Text='<%# Eval("ProductName") %>'></asp:Label>
                                <br />
                                <asp:Label ID="QuantityPerUnitLabel" runat="server" Text='<%# Eval("QuantityPerUnit") %>'></asp:Label>
                                <br />
                                <asp:Label ID="UnitPriceLabel" runat="server" Text='<%# Eval("UnitPrice") %>'></asp:Label>
                                <br />
                                <asp:Label ID="UnitsInStockLabel" runat="server" Text='<%# Eval("UnitsInStock") %>'></asp:Label>
                            </div>
                        </AlternatingItemTemplate>
                        <ItemTemplate>
                            <div class="rlvI productItemWrapper">
                                <br />
                                <asp:Label ID="ProductIDLabel" runat="server" Text='<%# Eval("ProductID") %>'></asp:Label>
                                <br />
                                <asp:Label ID="ProductNameLabel" runat="server" Text='<%# Eval("ProductName") %>'></asp:Label>
                                <br />
                                <asp:Label ID="QuantityPerUnitLabel" runat="server" Text='<%# Eval("QuantityPerUnit") %>'></asp:Label>
                                <br />
                                <asp:Label ID="UnitPriceLabel" runat="server" Text='<%# Eval("UnitPrice") %>'></asp:Label>
                                <br />
                                <asp:Label ID="UnitsInStockLabel" runat="server" Text='<%# Eval("UnitsInStock") %>'></asp:Label>
                            </div>
                        </ItemTemplate>
                        <EmptyDataTemplate>
                            <div class="RadListView RadListView_<%# Container.Skin %>">
                                <div class="rlvEmpty">
                                    There are no items to be displayed.
                                </div>
                            </div>
                        </EmptyDataTemplate>
                        <LayoutTemplate>
                            <div class="RadListView RadListViewFloated RadListView_<%# Container.Skin %>">
                                <div class="rlvFloated rlvAutoScroll">
                                    <div id="itemPlaceholder" runat="server">
                                    </div>
                                </div>
                                <telerik:RadDataPager RenderMode="Lightweight" ID="RadDataPager1" runat="server" PageSize="7">
                                    <Fields>
                                        <telerik:RadDataPagerButtonField FieldType="Numeric"></telerik:RadDataPagerButtonField>
                                    </Fields>
                                </telerik:RadDataPager>
                            </div>
                        </LayoutTemplate>
                    </telerik:RadListView>
                </telerik:RadPageView>
                <telerik:RadPageView runat="server" ID="RadPageView2">
                    <telerik:RadListView runat="server" RenderMode="Lightweight" ID="GridListView" AllowPaging="True" DataKeyNames="ProductID"
                        DataSourceID="SqlDataSource1">
                        <AlternatingItemTemplate>
                            <tr class="rlvA">
                                <td>
                                    <asp:Label ID="ProductIDLabel" runat="server" Text='<%# Eval("ProductID") %>'></asp:Label>
                                </td>
                                <td>
                                    <asp:Label ID="ProductNameLabel" runat="server" Text='<%# Eval("ProductName") %>'></asp:Label>
                                </td>
                                <td>
                                    <asp:Label ID="QuantityPerUnitLabel" runat="server" Text='<%# Eval("QuantityPerUnit") %>'></asp:Label>
                                </td>
                                <td>
                                    <asp:Label ID="UnitPriceLabel" runat="server" Text='<%# Eval("UnitPrice") %>'></asp:Label>
                                </td>
                                <td>
                                    <asp:Label ID="UnitsInStockLabel" runat="server" Text='<%# Eval("UnitsInStock") %>'></asp:Label>
                                </td>
                            </tr>
                        </AlternatingItemTemplate>
                        <ItemTemplate>
                            <tr class="rlvI">
                                <td>
                                    <asp:Label ID="ProductIDLabel" runat="server" Text='<%# Eval("ProductID") %>'></asp:Label>
                                </td>
                                <td>
                                    <asp:Label ID="ProductNameLabel" runat="server" Text='<%# Eval("ProductName") %>'></asp:Label>
                                </td>
                                <td>
                                    <asp:Label ID="QuantityPerUnitLabel" runat="server" Text='<%# Eval("QuantityPerUnit") %>'></asp:Label>
                                </td>
                                <td>
                                    <asp:Label ID="UnitPriceLabel" runat="server" Text='<%# Eval("UnitPrice") %>'></asp:Label>
                                </td>
                                <td>
                                    <asp:Label ID="UnitsInStockLabel" runat="server" Text='<%# Eval("UnitsInStock") %>'></asp:Label>
                                </td>
                            </tr>
                        </ItemTemplate>
                        <EmptyDataTemplate>
                            <div class="RadListView RadListView_<%# Container.Skin %>">
                                <div class="rlvEmpty">
                                    There are no items to be displayed.
                                </div>
                            </div>
                        </EmptyDataTemplate>
                        <LayoutTemplate>
                            <div class="RadListView RadListView_<%# Container.Skin %>">
                                <table class="gridMainTable">
                                    <thead>
                                        <tr class="rlvHeader">
                                            <th>ProductID
                                            </th>
                                            <th>ProductName
                                            </th>
                                            <th>QuantityPerUnit
                                            </th>
                                            <th>UnitPrice
                                            </th>
                                            <th>UnitsInStock
                                            </th>
                                        </tr>
                                    </thead>
                                    <tfoot>
                                        <tr>
                                            <td colspan="5">
                                                <telerik:RadDataPager RenderMode="Lightweight" ID="RadDataPager1" runat="server">
                                                    <Fields>
                                                        <telerik:RadDataPagerButtonField FieldType="Numeric"></telerik:RadDataPagerButtonField>
                                                    </Fields>
                                                </telerik:RadDataPager>
                                            </td>
                                        </tr>
                                    </tfoot>
                                    <tbody>
                                        <tr id="itemPlaceholder" runat="server">
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </LayoutTemplate>
                    </telerik:RadListView>
                </telerik:RadPageView>
                <telerik:RadPageView runat="server" ID="RadPageView3">
                    <telerik:RadListView runat="server" ID="UnorderedListView" RenderMode="Lightweight" AllowPaging="True" DataKeyNames="ProductID"
                        DataSourceID="SqlDataSource1">
                        <AlternatingItemTemplate>
                            <li class="rlvA">&nbsp;<asp:Label ID="ProductIDLabel" runat="server" Text='<%# Eval("ProductID") %>'></asp:Label>
                                &nbsp;<asp:Label ID="ProductNameLabel" runat="server" Text='<%# Eval("ProductName") %>'></asp:Label>
                                &nbsp;<asp:Label ID="QuantityPerUnitLabel" runat="server" Text='<%# Eval("QuantityPerUnit") %>'></asp:Label>
                                &nbsp;<asp:Label ID="UnitPriceLabel" runat="server" Text='<%# Eval("UnitPrice") %>'></asp:Label>
                                &nbsp;<asp:Label ID="UnitsInStockLabel" runat="server" Text='<%# Eval("UnitsInStock") %>'></asp:Label>
                            </li>
                        </AlternatingItemTemplate>
                        <ItemTemplate>
                            <li class="rlvI">&nbsp;<asp:Label ID="ProductIDLabel" runat="server" Text='<%# Eval("ProductID") %>'></asp:Label>
                                &nbsp;<asp:Label ID="ProductNameLabel" runat="server" Text='<%# Eval("ProductName") %>'></asp:Label>
                                &nbsp;<asp:Label ID="QuantityPerUnitLabel" runat="server" Text='<%# Eval("QuantityPerUnit") %>'></asp:Label>
                                &nbsp;<asp:Label ID="UnitPriceLabel" runat="server" Text='<%# Eval("UnitPrice") %>'></asp:Label>
                                &nbsp;<asp:Label ID="UnitsInStockLabel" runat="server" Text='<%# Eval("UnitsInStock") %>'></asp:Label>
                            </li>
                        </ItemTemplate>
                        <EmptyDataTemplate>
                            <div class="RadListView RadListView_<%# Container.Skin %>">
                                <div class="rlvEmpty">
                                    There are no items to be displayed.
                                </div>
                            </div>
                        </EmptyDataTemplate>
                        <LayoutTemplate>
                            <div class="RadListView RadListView_<%# Container.Skin %>">
                                <ul class="listItem">
                                    <li id="itemPlaceholder" runat="server"></li>
                                </ul>
                                <telerik:RadDataPager RenderMode="Lightweight" ID="RadDataPager1" runat="server">
                                    <Fields>
                                        <telerik:RadDataPagerButtonField FieldType="Numeric"></telerik:RadDataPagerButtonField>
                                    </Fields>
                                </telerik:RadDataPager>
                            </div>
                        </LayoutTemplate>
                    </telerik:RadListView>
                </telerik:RadPageView>
                <telerik:RadPageView runat="server" ID="RadPageView4">
                    <telerik:RadListView runat="server" ID="OrderedListView" RenderMode="Lightweight" AllowPaging="True" DataKeyNames="ProductID"
                        DataSourceID="SqlDataSource1">
                        <AlternatingItemTemplate>
                            <li class="rlvA">&nbsp;<asp:Label ID="ProductIDLabel" runat="server" Text='<%# Eval("ProductID") %>'></asp:Label>
                                &nbsp;<asp:Label ID="ProductNameLabel" runat="server" Text='<%# Eval("ProductName") %>'></asp:Label>
                                &nbsp;<asp:Label ID="QuantityPerUnitLabel" runat="server" Text='<%# Eval("QuantityPerUnit") %>'></asp:Label>
                                &nbsp;<asp:Label ID="UnitPriceLabel" runat="server" Text='<%# Eval("UnitPrice") %>'></asp:Label>
                                &nbsp;<asp:Label ID="UnitsInStockLabel" runat="server" Text='<%# Eval("UnitsInStock") %>'></asp:Label>
                            </li>
                        </AlternatingItemTemplate>
                        <ItemTemplate>
                            <li class="rlvI">&nbsp;<asp:Label ID="ProductIDLabel" runat="server" Text='<%# Eval("ProductID") %>'></asp:Label>
                                &nbsp;<asp:Label ID="ProductNameLabel" runat="server" Text='<%# Eval("ProductName") %>'></asp:Label>
                                &nbsp;<asp:Label ID="QuantityPerUnitLabel" runat="server" Text='<%# Eval("QuantityPerUnit") %>'></asp:Label>
                                &nbsp;<asp:Label ID="UnitPriceLabel" runat="server" Text='<%# Eval("UnitPrice") %>'></asp:Label>
                                &nbsp;<asp:Label ID="UnitsInStockLabel" runat="server" Text='<%# Eval("UnitsInStock") %>'></asp:Label>
                            </li>
                        </ItemTemplate>
                        <EmptyDataTemplate>
                            <div class="RadListView RadListView_<%# Container.Skin %>">
                                <div class="rlvEmpty">
                                    There are no items to be displayed.
                                </div>
                            </div>
                        </EmptyDataTemplate>
                        <LayoutTemplate>
                            <div class="RadListView RadListView_<%# Container.Skin %>">
                                <ol class="listItem">
                                    <li id="itemPlaceholder" runat="server"></li>
                                </ol>
                                <telerik:RadDataPager RenderMode="Lightweight" ID="RadDataPager1" runat="server">
                                    <Fields>
                                        <telerik:RadDataPagerButtonField FieldType="Numeric"></telerik:RadDataPagerButtonField>
                                    </Fields>
                                </telerik:RadDataPager>
                            </div>
                        </LayoutTemplate>
                    </telerik:RadListView>
                </telerik:RadPageView>
                <telerik:RadPageView runat="server" ID="RadPageView5">
                    <telerik:RadListView runat="server" ID="FlowListView" RenderMode="Lightweight" AllowPaging="True" DataKeyNames="ProductID"
                        DataSourceID="SqlDataSource1">
                        <AlternatingItemTemplate>
                            <div class="rlvA">
                                &nbsp;<asp:Label ID="ProductIDLabel" runat="server" Text='<%# Eval("ProductID") %>'></asp:Label>
                                &nbsp;<asp:Label ID="ProductNameLabel" runat="server" Text='<%# Eval("ProductName") %>'></asp:Label>
                                &nbsp;<asp:Label ID="QuantityPerUnitLabel" runat="server" Text='<%# Eval("QuantityPerUnit") %>'></asp:Label>
                                &nbsp;<asp:Label ID="UnitPriceLabel" runat="server" Text='<%# Eval("UnitPrice") %>'></asp:Label>
                                &nbsp;<asp:Label ID="UnitsInStockLabel" runat="server" Text='<%# Eval("UnitsInStock") %>'></asp:Label>
                            </div>
                        </AlternatingItemTemplate>
                        <ItemTemplate>
                            <div class="rlvI">
                                &nbsp;<asp:Label ID="ProductIDLabel" runat="server" Text='<%# Eval("ProductID") %>'></asp:Label>
                                &nbsp;<asp:Label ID="ProductNameLabel" runat="server" Text='<%# Eval("ProductName") %>'></asp:Label>
                                &nbsp;<asp:Label ID="QuantityPerUnitLabel" runat="server" Text='<%# Eval("QuantityPerUnit") %>'></asp:Label>
                                &nbsp;<asp:Label ID="UnitPriceLabel" runat="server" Text='<%# Eval("UnitPrice") %>'></asp:Label>
                                &nbsp;<asp:Label ID="UnitsInStockLabel" runat="server" Text='<%# Eval("UnitsInStock") %>'></asp:Label>
                            </div>
                        </ItemTemplate>
                        <EmptyDataTemplate>
                            <div class="RadListView RadListView_<%# Container.Skin %>">
                                <div class="rlvEmpty">
                                    There are no items to be displayed.
                                </div>
                            </div>
                        </EmptyDataTemplate>
                        <LayoutTemplate>
                            <div class="RadListView RadListView_<%# Container.Skin %>">
                                <div id="itemPlaceholder" runat="server">
                                </div>
                                <telerik:RadDataPager RenderMode="Lightweight" ID="RadDataPager1" runat="server">
                                    <Fields>
                                        <telerik:RadDataPagerButtonField FieldType="Numeric"></telerik:RadDataPagerButtonField>
                                    </Fields>
                                </telerik:RadDataPager>
                            </div>
                        </LayoutTemplate>
                    </telerik:RadListView>
                </telerik:RadPageView>
                <telerik:RadPageView runat="server" ID="RadPageView6">
                    <telerik:RadListView runat="server" ID="SingleRowListView" RenderMode="Lightweight" AllowPaging="True" DataKeyNames="ProductID"
                        DataSourceID="SqlDataSource1">
                        <AlternatingItemTemplate>
                            <td class="rlvA">
                                <asp:Label ID="ProductIDLabel" runat="server" Text='<%# Eval("ProductID") %>'></asp:Label>
                                <br />
                                <asp:Label ID="ProductNameLabel" runat="server" Text='<%# Eval("ProductName") %>'></asp:Label>
                                <br />
                                <asp:Label ID="QuantityPerUnitLabel" runat="server" Text='<%# Eval("QuantityPerUnit") %>'></asp:Label>
                                <br />
                                <asp:Label ID="UnitPriceLabel" runat="server" Text='<%# Eval("UnitPrice") %>'></asp:Label>
                                <br />
                                <asp:Label ID="UnitsInStockLabel" runat="server" Text='<%# Eval("UnitsInStock") %>'></asp:Label>
                                <br />
                            </td>
                        </AlternatingItemTemplate>
                        <ItemTemplate>
                            <td class="rlvI">
                                <asp:Label ID="ProductIDLabel" runat="server" Text='<%# Eval("ProductID") %>'></asp:Label>
                                <br />
                                <asp:Label ID="ProductNameLabel" runat="server" Text='<%# Eval("ProductName") %>'></asp:Label>
                                <br />
                                <asp:Label ID="QuantityPerUnitLabel" runat="server" Text='<%# Eval("QuantityPerUnit") %>'></asp:Label>
                                <br />
                                <asp:Label ID="UnitPriceLabel" runat="server" Text='<%# Eval("UnitPrice") %>'></asp:Label>
                                <br />
                                <asp:Label ID="UnitsInStockLabel" runat="server" Text='<%# Eval("UnitsInStock") %>'></asp:Label>
                                <br />
                            </td>
                        </ItemTemplate>
                        <EmptyDataTemplate>
                            <div class="RadListView RadListView_<%# Container.Skin %>">
                                <div class="rlvEmpty">
                                    There are no items to be displayed.
                                </div>
                            </div>
                        </EmptyDataTemplate>
                        <LayoutTemplate>
                            <div class="RadListView RadListView_<%# Container.Skin %>">
                                <table cellspacing="0">
                                    <tr>
                                        <td id="itemPlaceholder" runat="server"></td>
                                    </tr>
                                </table>
                                <telerik:RadDataPager RenderMode="Lightweight" ID="RadDataPager1" runat="server" PageSize="7">
                                    <Fields>
                                        <telerik:RadDataPagerButtonField FieldType="Numeric"></telerik:RadDataPagerButtonField>
                                    </Fields>
                                </telerik:RadDataPager>
                            </div>
                        </LayoutTemplate>
                    </telerik:RadListView>
                </telerik:RadPageView>
            </telerik:RadMultiPage>
        </asp:Panel>
        <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
            SelectCommand="SELECT top 30 [ProductID], [ProductName], [QuantityPerUnit], [UnitPrice], [UnitsInStock] FROM [Products]"></asp:SqlDataSource>
    </div>
    </form>
</body>
</html>

Find Assistance

Help Us Improve

Was this example helpful?