Telerik is a leading vendor of ASP.NET AJAX, ASP.NET MVC, Silverlight, WinForms and WPF controls and components, as well as .NET Reporting, .NET ORM , .NET CMS, Code Analysis, Mocking, Team Productivity and Automated Testing Tools. Building on its expertise in interface development and Microsoft technologies, Telerik helps customers build applications with unparalleled richness, responsiveness and interactivity. Telerik products help thousands of companies to be more productive and deliver reliable applications under budget and on time.
Version Q1 2012 released 04/11/2012
select

Rotator / Declarative DataSources

Horizontal Rotator bound to a XmlDataSource
  • Customer image
    Ana Trujillo
    Owner
    Ana Trujillo Emparedados y helados
  • Customer image
    Antonio Moreno
    Owner
    Antonio Moreno Taquería
  • Customer image
    Elizabeth Lincoln
    Accounting Manager
    Bottom-Dollar Markets
  • Customer image
    Patricio Simpson
    Sales Agent
    Cactus Comidas para llevar
  • Customer image
    Francisco Chang
    Marketing Manager
    Centro comercial Moctezuma
  • Customer image
    Roland Mendel
    Sales Manager
    Ernst Handel
  • Customer image
    Yoshi Tannamuri
    Marketing Assistant
    Laughing Bacchus Wine Cellars
  • Customer image
    Catherine Dewey
    Sales Agent
    Maison Dewey
  • Customer image
    Jean Fresnière
    Marketing Assistant
    Mère Paillarde
  • Customer image
    Yvonne Moncada
    Sales Agent
    Océano Atlántico Ltda.
  • Customer image
    Guillermo Fernández
    Sales Representative
    Pericles Comidas clásicas
  • Customer image
    Georg Pipps
    Sales Manager
    Piccolo und mehr
  • Customer image
    Sergio Gutiérrez
    Sales Representative
    Rancho grande
  • Customer image
    Jonas Bergulfsen
    Owner
    Santé Gourmet
  • Customer image
    Jytte Petersen
    Owner
    Simons bistro
  • Customer image
    Pascale Cartrain
    Accounting Manager
    Suprêmes délices
  • Customer image
    Miguel Angel Paolino
    Owner
    Tortuga Restaurante
  • Customer image
    Palle Ibsen
    Sales Manager
    Vaffeljernet
  • Customer image
    Accounting Manager
    Wartian Herkku
  • Customer image
    Matti Karttunen
    Owner/Marketing Assistant
    Wilman Kala
    
Vertical Rotator bound to a SqlDataSource

  • Declarative Data Sources
    RadRotator supports binding to declarative datasources.

    Table-based DataSource components can be used to bind the rotator declaratively at design time.

Source Code

C# VB.NET
Show code in new window Demo isolation steps
  • <%@ Page Language="c#" AutoEventWireup="false" %>

    <%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
    <%@ Register TagPrefix="qsf" Namespace="Telerik.QuickStart" %>
    <%@ Register TagPrefix="qsf" TagName="Header" Src="~/Common/Header.ascx" %>
    <%@ Register TagPrefix="qsf" TagName="HeadTag" Src="~/Common/HeadTag.ascx" %>
    <%@ Register TagPrefix="qsf" TagName="Footer" Src="~/Common/Footer.ascx" %>
    <!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">
        <qsf:HeadTag ID="Headtag1" runat="server" />
        <link href="Styles.css" rel="stylesheet" type="text/css" />
    </head>
    <body class="BODY">
        <form id="Form1" method="post" runat="server">
        <qsf:Header ID="Header1" runat="server" NavigationLanguage="c#" />
        <telerik:RadScriptManager ID="ScriptManager1" runat="server">
        </telerik:RadScriptManager>
        <script type="text/javascript">
            function OnClientLoad(sender, args) {
                configureButtons(sender);
            }
        </script>
        <div style="width: 100%;">
            <div class="leftPanel">
                <div class="bigModule" style="margin-bottom: 40px">
                    <div>
                        <div class="bigModuleBottom">
                            <strong>Horizontal Rotator bound to a XmlDataSource</strong>
                        </div>
                    </div>
                </div>
                <div style="width: 450px;">
                    <div class="qsfClear">
                        <!-- -->
                    </div>
                    <telerik:RadRotator ID="RadRotator1" runat="server" DataSourceID="XmlDataSource1"
                        Width="300px" ItemWidth="302px" Height="100px" ItemHeight="100px" ScrollDuration="2000"
                        FrameDuration="2000" RotatorType="AutomaticAdvance" CssClass="rotatorNoButtons"
                        BorderColor="#bfd8e8" BorderWidth="1">
                        <ItemTemplate>
                            <div class="itemTemplateNoButtons">
                                <asp:Image ID="CustomerImage" runat="server" AlternateText="Customer image" ImageUrl='<%# XPath("ImageUrl") %>'
                                    CssClass="personImage" />
                                <div style="width: 200px; text-align: center; float: right;">
                                    <div class="personName">
                                        <asp:Label ID="PersonName" runat="server"><%# XPath("ContactName")%></asp:Label>
                                    </div>
                                    <div class="contactTitle">
                                        <asp:Label ID="Label1" runat="server"><%# XPath("ContactTitle")%></asp:Label>
                                    </div>
                                    <div class="companyName">
                                        <asp:Label ID="CompanyName" runat="server"><%# XPath("CompanyName")%></asp:Label>
                                    </div>
                                </div>
                            </div>
                        </ItemTemplate>
                    </telerik:RadRotator>
                </div>
            </div>
            <div class="rightPanel">
                <div class="bigModule" style="margin-bottom: 15px">
                    <div>
                        <div class="bigModuleBottom">
                            <strong>Vertical Rotator bound to a SqlDataSource</strong>
                        </div>
                    </div>
                </div>
                <div style="width: 420px;">
                    <div class="qsfClear">
                        <!-- -->
                    </div>
                    <telerik:RadRotator ID="RadRotator2" runat="server" DataSourceID="SqlDataSource1"
                        RotatorType="ButtonsOver" FrameDuration="300" Width="100px" Height="140px" ItemHeight="100px"
                        ScrollDirection="Up,Down" CssClass="rotatorWithButtons" OnClientLoad="OnClientLoad">
                        <ItemTemplate>
                            <asp:Image runat="server" ID="Image" ImageUrl='<%# Eval("CustomerID", "~/Img/Northwind/Customers/{0}.jpg") %>'
                                CssClass="personImage" AlternateText="Customer Image" />
                        </ItemTemplate>
                    </telerik:RadRotator>
                </div>
            </div>
        </div>
        <asp:XmlDataSource ID="XmlDataSource1" runat="server" DataFile="~/Rotator/Examples/DeclarativeDataSources/RotatorDataSourceFile.xml">
        </asp:XmlDataSource>
        <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
            SelectCommand="SELECT [CustomerID] FROM [Customers]"></asp:SqlDataSource>
        <script type="text/javascript">
            function configureButtons(rotator) {
                $telerik.$(rotator.get_element()).find(".rrButtonDown").css({ marginBottom: "-17px" });
                $telerik.$(rotator.get_element()).find(".rrButtonUp").css({ marginLeft: "-8px" });
            }
        </script>
        <qsf:Footer runat="server" ID="Footer1" />
        </form>
    </body>
    </html>

Get more than expected!

Take your time to truly experience the power of RadControls for ASP.NET AJAX with a free 60-day trial backed up by Telerik’s unlimited dedicated support.

Download your RadControls for ASP.NET AJAX trial and jumpstart your development with the available Getting Started resources.

If you have any questions, do not hesitate to contact us at sales@telerik.com.

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