RadRotator, dynamic control within XSL

10 posts, 2 answers
  1. helloitsliam
    helloitsliam avatar
    5 posts
    Member since:
    Aug 2007

    Posted 19 Nov 2008 Link to this post

    Hi,
       I have been working on a solution for a while now that basically grabs an XML document, and then transforms it using XSL. Nothing special there except within the XSL I am declaring the asp.net controls such as:

    <asp:Table> etc

    I have got this to work succesfully for all the standard Asp.net and Ajax controls available within Visual Studio. I had built some scrolling capabilities using custom JavaScript which works but now I want to use the RadRotator control instead of the custom JavaScript. However the databinding of the control requires a datasource, in my scenario I do not have a datasource as such as it is within the XSL that is used to render the on-the-fly XML document. I have not seen any examples of using the rotator as a standard rotator without a data source attached. Is there a way of doing this? I need it to work like shown below:

    <xsl:template match="/">
    <div class="UpdatePanelContainer">
     <asp:UpdatePanel id="UpdatePanel" UpdateMode="Always" runat="server">
      <ContentTemplate>

        <telerik:RadRotator FrameDuration="4000" ID="Rotator1" runat="server" ScrollDirection="Up">
            <xsl:apply-templates select="rows/row"/>
        </telerik:RadRotator>

      </ContentTemplate>
     </asp:UpdatePanel>
    </div>
    </xsl:template>

    <xsl:template match="row">
        <ItemTemplate>
            <xsl:value-of select="MyXMLField" />
        </ItemTemplate>      
    </xsl:template>

    Any help would be gratefully recieved. Thanks

    Liam
  2. Answer
    Lini
    Admin
    Lini avatar
    2144 posts

    Posted 21 Nov 2008 Link to this post

    Hello Liam,

    You can bind the rotator directly to an XML file - http://demos.telerik.com/aspnet/prometheus/Rotator/Examples/Testimonial/DefaultCS.aspx

    If you do not wish to use any datasource, then you can also declare the rotator items inline - http://demos.telerik.com/aspnet/prometheus/Rotator/Examples/RotatorTypes/DefaultCS.aspx

    Look at the ASPX source of the two examples I linked to see how exactly the rotator gets its data. I think the inline item declaration will be easiest to implement for you. Just change the row template to:


    <xsl:template match="row">
      <telerik:RadRotatorItem>
        <ItemTemplate>
     
    <xsl:value-of select="MyXMLField" />
        </ItemTemplate>
      </telerik:RadRotatorItem>

    </xsl:template>

    and make sure the rotator definition has the <items> collection:

        <telerik:RadRotator FrameDuration="4000" ID="Rotator1" runat="server" ScrollDirection="Up">
    <Items>
            <xsl:apply-templates select="rows/row"/>
    </Items>
        </telerik:RadRotator>

    Regards,
    Lini
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. helloitsliam
    helloitsliam avatar
    5 posts
    Member since:
    Aug 2007

    Posted 24 Nov 2008 Link to this post

    Hi Lini,
        Thank you for this it works like a treat. Is the same process needed for using the RadTicker within the RadRotator? I have tried with the similar structure but to no avail. Any examples would be great if you have one.

    Liam
  5. Lini
    Admin
    Lini avatar
    2144 posts

    Posted 25 Nov 2008 Link to this post

    Hello Liam,

    The ticker is very similar to the rotator - it has an Items collection where you put RadTickerItem objects. Here is an example:

    <xsl:template match="row">
      <telerik:RadTickerItem>
     
    <xsl:value-of select="MyXMLField" />
      </telerik:
    RadTickerItem>
    </xsl:template>

    <telerik:RadTicker ID="RadTicker1" AutoStart="true" Loop="true" runat="Server">
      <Items>
        <xsl:apply-templates select="rows/row"/>
     </Items>
    </telerik:RadTicker>

    The only difference is that the ticker items have no templates - you put the text directly inside them.

    Best wishes,
    Lini
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  6. helloitsliam
    helloitsliam avatar
    5 posts
    Member since:
    Aug 2007

    Posted 25 Nov 2008 Link to this post

    Hi Lini,
        Thanks again for your response. However I am facing the following problem:

    'Rows' could not be initialized. Details: 'Rows' could not be added to the collection. Details: 'Cells' could not be initialized. Details: 'Cells' could not be added to the collection. Details: Cannot instantiate type 'RadTicker' because it is not public.

    Can I confirm what version of the DLL's I need in order for the RadTicker to be used? Also can you confirm that it can be embedded inside a RadRotator. Thanks for your help.

    Liam

  7. Answer
    Lini
    Admin
    Lini avatar
    2144 posts

    Posted 25 Nov 2008 Link to this post

    Hello,

    This error means that you have an older version of the Telerik.Web.UI.dll assembly. Please update to the latest available build from our site in order to unlock the RadTicker control. I can confirm that you can use the ticker inside a rotator. We have several online demos with that scenario - http://demos.telerik.com/aspnet/prometheus/Rotator/Examples/Forecast/DefaultCS.aspx

    Regards,
    Lini
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  8. helloitsliam
    helloitsliam avatar
    5 posts
    Member since:
    Aug 2007

    Posted 26 Nov 2008 Link to this post

    Hi Lini,
        Thanks for your guidance on this. I now have it working, had the latest version on the system but had not updated my web.config to the correct version I was using. Much appreciated.

    Inside the RadRotator there is a Enumerator for AnimationType, the options are Fade, None and Pulse. Does this mean that the RadRotator supports fade and pulse effects? Just wondered. Thanks

    Liam
  9. Tervel
    Admin
    Tervel avatar
    1337 posts

    Posted 28 Nov 2008 Link to this post

    Hello Liam,

    Yes, that is correct. We plan on adding more cross-browser animations using the jQuery library, which was recently incorporated in the Telerik.Web.UI suite.


    Sincerely yours,
    Tervel
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  10. helloitsliam
    helloitsliam avatar
    5 posts
    Member since:
    Aug 2007

    Posted 08 Dec 2008 Link to this post

    Hi,
        After working with the control I have a problem where the RadRotator keeps erroring and saying the following:

    An error occurred during the processing of . Telerik.Web.UI.RadRotatorItemCollection must have items of type 'Telerik.Web.UI.RadRotatorItem'. 'td' is of type 'System.Web.UI.HtmlControls.HtmlTableCell'.

    The code I am using is:

    XSL file 1

    <telerik:RadRotator FrameDuration="5000" ID="Rotator1" AnimationType="Fade" runat="server" ScrollDirection="Up" WrapFrames="True">
           <Items>
                                 <xsl:call-template name="MyTemplate.Body">
                                     <xsl:with-param name="Rows" select="$Rows" />
                                     <xsl:with-param name="FirstRow" select="1" />
                                     <xsl:with-param name="LastRow" select="$RowCount" />
                                </xsl:call-template>
           </Items>
    </telerik:RadRotator>

    XSL File 2

    <telerik:RadRotatorItem>
       <ItemTemplate>
                        <xsl:value-of select="@Quote" />
       </ItemTemplate>
    </telerik:RadRotatorItem>

    Any ideas as to why it errors with this would be helpful.
    Thanks

    Liam

  11. Fiko
    Admin
    Fiko avatar
    1406 posts

    Posted 09 Dec 2008 Link to this post

    Hi Liam Cleary,

    The solution is to build RadRotator in the following sequence  :

    1. <Items>
    2. <telerik:RadRotatorItem>
    3. <ItemTemplate>
    e.g. :

    <telerik:RadRotator FrameDuration="5000" ID="Rotator1" AnimationType="Fade" runat="server" ScrollDirection="Up" WrapFrames="True">
           <Items>
                    <telerik:RadRotatorItem>
                        <ItemTemplate>
                                 <xsl:call-template name="MyTemplate.Body">
                                     <xsl:with-param name="Rows" select="$Rows" />
                                     <xsl:with-param name="FirstRow" select="1" />
                                     <xsl:with-param name="LastRow" select="$RowCount" />
                                </xsl:call-template>
                       </ItemTemplate>
                    </telerik:RadRotatorItem>
           </Items>
    </telerik:RadRotator>




    Best wishes,
    Fiko
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017