rotator and loading part of an xml file to it

2 posts, 0 answers
  1. maha
    maha avatar
    44 posts
    Member since:
    Jun 2010

    Posted 09 Aug 2010 Link to this post

    I have the following rotator that is linked to an xml file

    <table><tr>
                                                 <td><img  style="position:static;"  id="rrButtonLeftg1" alt="" onmouseover="imgleftover('rrButtonLeftg1')" onmouseout="imgleftout('rrButtonLeftg1')"  src="rotator/rotator_left_01.png"  /></td>
                                                <td>
                                                                <telerik:RadRotator ID="RadRotator1g" runat="server" Height="190px" Width="800px"
                                                                    BackColor="#526b75" RotatorType="ButtonsOver" ItemHeight="100px" ItemWidth="160px"
                                                                    DataSourceID="XmlDataSourceg1" Skin=""  ScrollDuration="350"
                                                                    FrameDuration="800">
                                                                    <ItemTemplate>
                                                                        <div class="itemTemplate">
                                                                            <table style='margin: 1px 1px 1px 1px; background-color: transparent; padding: 0;
                                                                                border: none; cursor: pointer; width: 100%; -moz-border-radius: 1px; -webkit-border-radius: 1px;'>
                                                                                <tr>
                                                                                    <td style="width: 10%">
                                                                                                
                                                                                    </td>
                                                                                    <td style="width: 80%">
                                                                                        <a href='<%# XPath("link") %>' style="width: 100%" >
                                                                                            <img align="center" border="0" height="130" hspace="0" src='<%# XPath("src") %>'
                                                                                                width="90" />
                                                                                        </a>
                                                                                    </td>
                                                                                    <td style="width: 10%">
                                                                                              
                                                                                    </td>
                                                                                </tr>
                                                                                <tr>
                                                                                    <td style="width: 100%" colspan='3' align="center">
                                                                                        <a href='<%# XPath("link") %>' style='font-weight: bold; font-size: 8pt; color: #484849;'>
                                                                                            <%# XPath("title") %>
                                                                                        </a></font>
                                                                                    </td>
                                                                                </tr>
                                                                            </table>
                                                                        </div>
                                                                    </ItemTemplate>
                                                                <ControlButtons LeftButtonID="rrButtonLeftg1" RightButtonID="rrButtonRightg1" />
                                                    </telerik:RadRotator></td>
                                                <td><img  style="position:static;"  id="rrButtonRightg1" onmouseover="imgrightover('rrButtonRightg1')" onmouseout="imgrightout('rrButtonRightg1')" alt=""   src="rotator/rotator_righ_01.png"  /></td>
                                                </tr></table>

    The rotator shows an image and title below it
    The XML file contains 12 entities. I want to do display 4 each time we click on the button next or previous.So on load i want to show only 4 images and corresponding titles without downloading all remaining others.And on next click i need to load into the rotator the next 4 entities but without doing any post back without reloading the whole page. How can i do that?
  2. Svetlina Anati
    Admin
    Svetlina Anati avatar
    2795 posts

    Posted 12 Aug 2010 Link to this post

    Hello maha,

     The LOD of RadRotator gives you the possibility to show as many items as you want on each request. This being said you should go through the following steps:


    1) Use some standard technique to extract only 4 records from teh XML - e.g use XmlReader, etc - this is general ASP.NET knowledge and it is not directly related to RadControls

    2) Form the HTMl for the item based on the extracted data and return the 4 items back to the rotator

    3) The rotator will be populated with the returned items only. After that, it will automatically understand when it is needed to load additional items when going to next or previous and will call your method in teh WebService again, you should read and form the next 4 items, etc.

    To better understand how this is done, please examine the demo below:

    http://demos.telerik.com/aspnet-ajax/rotator/examples/loadondemand/defaultcs.aspx

    On a side note, when you install RadControls, our online examples projects are automatically installed on your computer and you can not only examine their full source code, but also extend them further in order to meet your requirements.

    You can open the demos from here:

    Start\Programs\Telerik\RadControls for ASPNET AJAX\Open Sample WebSite In VisualStudio

    The actual location on your hard disk is the following one:

    C:\Program Files\Telerik\RadControls for ASPNET AJAX \Live Demos

    I hope that this information is helpful.



    Sincerely yours,
    Svetlina
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top