Issuu on Google+

Contact us

+1‒888‒365‒2779

usa +44‒20‒7291‒0580

uk +359‒2‒8099850

bg

Your account

We are here for you.

+49‒89‒2441642‒70

de +61‒2‒8090‒1465

au sales@telerik.com

email

Access to your products, updates and support

ListView Overview Migration from ASP.NET ListView Templates

ABOUT US

view source

next demo

SEARCH

All Controls

PRODUCT FAMILIES

rate / review

ListView - Data and layout templates Employees Company: Ana Trujillo Emparedados y helados Name: Ana Trujillo Title: Owner City: México D.F. Country: Mexico (5) 555Phone: 4729

Company: Antonio Moreno Taquería Antonio Moreno Title: Owner City: México D.F. Country: Mexico Phone: (5) 555-3932 Name:

Data and layout templates

Company: Around the Horn

Company: Berglunds snabbköp

Edit and insert templates

Name:

Thomas Hardy Sales Title: Representative City: London Country: UK Phone: (171) 555-7788

Name:

Company: Blauer See Delikatessen

Company: Blondesddsl père et fils

Name:

Name:

Client-Side Data Binding Server-Side Data Binding Defining Structure Paging Sorting Grouping Filtering Selecting Insert/Update/Delete Items Drag and Drop

GET TRIAL

Christina Berglund Order Title: Administrator City: Luleå Country: Sweden Phone: 0921-12 34 65

Frédérique Citeaux Marketing Title: Manager City: Strasbourg Country: France Phone: 88.60.15.31

Hanna Moos Sales Title: Representative City: Mannheim Country: Germany Phone: 0621-08460

Customers No records for customers available. Categories Beverages - Soft drinks, coffees, teas, beers, and ales :: Condiments - Sweet and savory sauces, relishes, spreads, and seasonings :: Confections and sweet breads :: Dairy Products - Cheeses :: Grains/Cereals - Breads, crackers, pasta, and cereal :: Meat/Poultry - Prepared meats :: Produce and bean curd :: Seafood - Seaweed and fish

Appearance/Styling Application scenarios

Description

Related Resources

SharePoint Web Part This example demonstrates the usage of data and layout templates in RadListView for ASP.NET AJAX. These templates allows you to define the look and feel of the common layout template of the control (LayoutTemplate), the items in it (ItemTemplate/AlternatingItemTemplate and ItemSeparatorTemplate) and the content that will be shown when there is no data available (EmptyDataTemplate).

Bitdefender Antivirus Plus 2012

Keep in mind that you need to specify ItemPlaceholderID property value for RadListView which matches the id of an ASP.NET server control (with id and runat=server properties set) which will be used as a holder of the actual listview data content. The three RadListView instances on the example have asp PlaceHolder and asp Panels defined inside their LayoutTemplates for this purpose.

C#

VB

DefaultCS.aspx Show code in new window <%@ Page Language="c#" %>

Demo isolation steps


<%@ 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> <title>ASP.NET ListView Demo - Data and layout templates</title> </head> <body> <form id="form1" runat="server"> <telerik:RadScriptManager runat="server" ID="RadScriptManager1" /> <telerik:RadListView ID="RadListView1" DataSourceID="SqlDataSource1" runat="server" ItemPlaceholderID="EmployeesContainer"> <LayoutTemplate> <fieldset style="width: 900px"> <legend>Employees</legend> <asp:PlaceHolder ID="EmployeesContainer" runat="server"></asp:PlaceHolder> </fieldset> </LayoutTemplate> <ItemTemplate> <fieldset style="float: left; width: 420px;"> <legend>Company: <%#Eval("CompanyName")%> </legend> <table cellpadding="0" cellspacing="0"> <tr> <td> <table cellpadding="0" cellspacing="0"> <tr> <td style="width: 25%">Name: </td> <td style="width: 50%"> <%#Eval("ContactName")%> </td> </tr> <tr> <td>Title: </td> <td> <%#Eval("ContactTitle")%> </td> </tr> <tr> <td>City: </td> <td> <%# Eval("City")%> </td> </tr> <tr> <td>Country: </td> <td> <%# Eval("Country")%> </td> </tr> <tr> <td>Phone: </td> <td> <%#Eval("Phone")%> </td> </tr> </table>


</td> <td align="right" style="width: 25%; padding-left: 10px;"> <telerik:RadBinaryImage ID="RadBinaryImage1" runat="server" AlternateText="Contact Photo" ToolTip="Contact Photo" Width="90px" Height="110px" ResizeMode="Fit" DataValue='<%# Eval("Photo") == DBNull.Value? new System.Byte[0]: Eval("Photo") %>'> </telerik:RadBinaryImage> </td> </tr> </table> </fieldset> </ItemTemplate> <AlternatingItemTemplate> <fieldset style="float: left; width: 420px;"> <legend>Company: <%#Eval("CompanyName")%> </legend> <table cellpadding="0" cellspacing="0"> <tr> <td> <table cellpadding="0" cellspacing="0"> <tr> <td style="width: 25%">Name: </td> <td style="width: 50%;"> <%#Eval("ContactName")%> </td> </tr> <tr> <td>Title: </td> <td> <%#Eval("ContactTitle")%> </td> </tr> <tr> <td>City: </td> <td> <%# Eval("City")%> </td> </tr> <tr> <td>Country: </td> <td> <%# Eval("Country")%> </td> </tr> <tr> <td>Phone: </td> <td> <%#Eval("Phone")%> </td> </tr> </table> </td> <td align="right" style="width: 25%; padding-left: 10px;"> <telerik:RadBinaryImage ID="RadBinaryImage1" runat="server" AlternateText="Contact Photo" ToolTip="Contact Photo" Width="90px" Height="110px" ResizeMode="Fit" DataValue='<%# Eval("Photo") == DBNull.Value? new System.Byte[0]: Eval("Photo") %>'> </telerik:RadBinaryImage> </td>


</td> </tr> </table> </fieldset> </AlternatingItemTemplate> </telerik:RadListView> <div style="clear: both"> </div> <telerik:RadListView ID="RadListView2" runat="server" DataSourceID="SqlDataSource2" ItemPlaceholderID="EmptyDataHolder"> <LayoutTemplate> <asp:Panel ID="EmptyDataHolder" runat="server"> </asp:Panel> </LayoutTemplate> <EmptyDataTemplate> <fieldset style="width: 900px"> <legend>Customers</legend>No records for customers available. </fieldset> </EmptyDataTemplate> </telerik:RadListView> <telerik:RadListView ID="RadListView3" runat="server" DataSourceID="SqlDataSource3" ItemPlaceholderID="CategoryItemsHolder" DataKeyNames="CategoryID"> <LayoutTemplate> <fieldset style="width: 900px"> <legend>Categories</legend> <asp:Panel ID="CategoryItemsHolder" runat="server"> </asp:Panel> </fieldset> </LayoutTemplate> <ItemTemplate> <span><b> <%# Eval("CategoryName") %> - </b> <%# Eval("Description")%> </span> </ItemTemplate> <ItemSeparatorTemplate> <span style="color: Blue; font-weight: bold;">&nbsp;&nbsp;&nbsp;::&nbsp;&nbsp;&nbsp;</span> </ItemSeparatorTemplate> </telerik:RadListView> <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:TelerikConnectionString %>" ProviderName="System.Data.SqlClient" SelectCommand="SELECT TOP 6 * FROM [CustomerPhotos]"> </asp:SqlDataSource> <asp:SqlDataSource ID="SqlDataSource2" runat="server" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>" ProviderName="System.Data.SqlClient" SelectCommand="SELECT CustomerID, ContactName, CompanyName, Country, City FROM Customers WHERE 1 = 0"> </asp:SqlDataSource> <asp:SqlDataSource ID="SqlDataSource3" runat="server" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>" ProviderName="System.Data.SqlClient" SelectCommand="SELECT CategoryID, CategoryName, Description FROM Categories"> </asp:SqlDataSource> </form> </body> </html>


TRY NOW

Download a free 30-day trial with unlimited technical support.

Copyright 2002-2013 Š Telerik. All right reserved Telerik Inc, 201 Jones Rd, Waltham, MA 02451

Get Started Easily

See Pricing

Explore our help resources to get up to speed with the RadControls faster.

Check out the offers. Purchase an individu suite or treat yourself to one of our bund

WWW.TELERIK.COM

TERMS OF USE

PRIVACY POLIC


Asp listview