radrotator asynchronous loading pictures

[Berrabah]

Hello,
I would like to use a RadRotator that get the url pictures from an sql db and display it with two button (next and previous) so first that display the first picture and then the others like this way http://www.cantoncomunique.fr 
Thank you

[Princy]

Hi Berrabah,

You can use RadBinaryImage for binding images from database. Here is the sample code.

ASPX:

<telerik:RadRotator ID="RadRotator1" runat="server" Width="470px" Height="364" ItemWidth="470px" ItemHeight="230" ScrollDuration="500" RotatorType="Buttons" DataSourceID="SqlDataSource2"  >
  <ItemTemplate>
     <telerik:RadBinaryImage runat="server" ID="RadBinaryImage1" DataValue='<%#Eval("Picture") %>' AutoAdjustImageControlSize="false" Width="90px" Height="110px" />
  </ItemTemplate>
</telerik:RadRotator>

Hope this helps.

Thanks,
Princy.

[Berrabah]

Hi Princy and thank you for your help,
I have stored just the URL of pictures in the Database cause I have many pictures (more than 50) and I can't put there all in the Datatable so I get dynamically a list of url pictures and I bind this list with RadRotator, I use a JavaScript function to show the next and previous picturs :

<script type="text/javascript">
    function showNextItem(clickedButton, rotator, direction) {
        rotator.showNext(direction);
    }
</script>
<div class="rotator">

    <div class="boutonsuivant" onclick="showNextItem(this, $find('<%= myrotator.ClientID %>'), Telerik.Web.UI.RotatorScrollDirection.Left); return false;" >
        <asp:ImageButton ID="btnsuivant" runat="server" ImageUrl="~/App_Themes/Default/images/suivant.png" />
    </div>
    <div class="boutonprecedent" onclick="showNextItem(this, $find('<%= myrotator.ClientID %>'), Telerik.Web.UI.RotatorScrollDirection.Right); return false;" >
        <asp:ImageButton ID="ImageButton1" runat="server" ImageUrl="~/App_Themes/Default/images/precedent.png" />        
    </div>

    <telerik:RadRotator runat="server" ID="myrotator" Height="400px" Width="1024px" 
        RotatorType="FromCode" FrameDuration="5000">
        <ItemTemplate>
                <telerik:RadBinaryImage runat="server" ID="imagerotator" 
                    DataValue='<%# Container.DataItem %>' Height="400px" Width="1024px" 
                    ResizeMode="Crop" />
        </ItemTemplate>
    </telerik:RadRotator>
</div>


The probleme is that some times the RadRotator crashe so what should I do 
THANKS TELERIK'S MASTERS

[Slav]

Hello Berrabah,

I would recommend setting the RadRotator properties ItemWidth and ItemHeight as explained in the help article How to configure RadRotator to ensure that its items will be scrolled as expected.

Aside from this, your setup of the RadRotator appears to be correct. Please elaborate on the problem that you encountered and provide reliable steps for reproduction so that I can examine it and suggest an according solution.

Greetings,
Slav
the Telerik team