This is a migrated thread and some comments may be shown as answers.

[Solved] The News Rotator Freezes upon loading

2 Answers 115 Views

Rotator

This is a migrated thread and some comments may be shown as answers.

Art Handy asked on 06 Oct 2011, 05:10 PM

ScreenCapture.png

While attempting to use the RadRotator, built upon one of telerik's examples, the data seems to be read fine from the database, however when attempting to display the RadRotator just freezes displaying on partilal data. Here is my code:

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="OCSNews.aspx.vb" Inherits="NewsFeed_OCSNews" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<title>News Ticker</title>

</head>

<script runat="server">

Protected Function GetDayOfWeek(dateTimeString As String) As String

Dim result As DateTime = DateTime.Parse(dateTimeString)

Dim dayOfWeek As String = [Enum].GetName(GetType(DayOfWeek), result.DayOfWeek)

Return dayOfWeek

End Function

Protected Function GetTimeOnly(dateValue As String) As String

Return System.DateTime.Parse(dateValue).ToString("hh:mm tt")

End Function

Protected Function GetDateOnly(dateValue As String) As String

Return System.DateTime.Parse(CDate(dateValue)).ToString("ddd, MMM d, yyyy")

End Function

</script>

<body>

<form id="frmDefault" runat="server">

<telerik:RadScriptManager ID="RadScriptManager1" runat="server">

</telerik:RadScriptManager>

<table id="tblNews" runat="server">

<tr>

<td>

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" DefaultLoadingPanelID="InfoUpdatePanel">

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="rotSchoolNews">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="panSchoolNews" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<telerik:RadAjaxLoadingPanel ID="InfoUpdatePanel" runat="server" Transparency="30"

BackColor="#E0E0E0">

<asp:Image ID="imgLoading" runat="server" ImageUrl="~/Images/sm_loading.gif" Width="60px"

Style="border: 0px;" AlternateText="Loading..." ToolTip="Loading..." />

</telerik:RadAjaxLoadingPanel>

<div id="panSchoolNews" runat="server">

<a href='<%# Eval("Event_DTG").ToString() %>' style="cursor: pointer; text-decoration: none;

color: Black; background-image: url('images/Monday.png');"></a>

<div>

<div class="backElement">

<br />

<telerik:RadRotator ID="rotSchoolNews" ScrollDirection="Up" ScrollDuration="2000"

runat="server" Width="493px" ItemWidth="493px" Height="344px" ItemHeight="64px"

FrameDuration="1" InitialItemIndex="-1" CssClass="rotator" DataSourceID="SqlNews">

<ItemTemplate>

<div class="itemTemplate" onclick="javascript:popwindowfull('NewsFeed/OCSNews.aspx?ID=<%# DataBinder.Eval(Container.DataItem,"Event_ID") %>')"

style="background-image: url('images/<%# Me.GetDayOfWeek(Eval("Event_DTG").ToString()) %>.png');">

<div class="dateTime">

<div class="time">

<%# (Me.GetTimeOnly(DataBinder.Eval(Container.DataItem, "Event_DTG")))%>

</div>

<div class="date">

<%# (Me.GetDateOnly(DataBinder.Eval(Container.DataItem, "Event_DTG")))%>

</div>

<div class="title">

<span>

<%# System.Web.HttpUtility.HtmlEncode(DataBinder.Eval(Container.DataItem, "Event_Headline").ToString())%>

</span>

</div>

</ItemTemplate>

</telerik:RadRotator>

</div>

<asp:SqlDataSource ID="SqlNews" runat="server" ConnectionString="<%$ ConnectionStrings:OglethorpeConnectionString %>"

SelectCommand="SELECT Event_ID, Event_DTG, Event_Headline, Event_Text, Event_Group, Event_Location FROM OCS_Event WHERE (Event_EffectiveDate <= getdate()) AND (Event_DTG >= getdate()) ORDER BY Event_DTG">

</asp:SqlDataSource>

</div>

</td>

</tr>

</table>

</form>

</body>

</html>

I can't seem to figure out what's going on. Can anyone please help? Thanks
P.S. I have attached a screen shot to help visualize the isssue.

2 Answers, 1 is accepted

answered on 11 Oct 2011, 09:36 AM

RadRotatorDemo.zip

Hello Art,

I tried to reproduce the described problem, but to no avail. You can find attached the sample page that I used for testing. Please compare it with your actual project and check if there are differences in the setup. I have added also a short video, demonstrating the behavior of the RadRotator on my end.

By default the rotator control pauses when hovered with the cursor. This behavior can be controlled through the property PauseOnMouseOver, so you can set it to false if you want to prevent stopping of the items' rotation.

Note that at the current circumstances I am mostly guessing as to what your setup is. If you are still unable to resolve your problems please open a regular support ticket and send us a sample, runnable project that isolates your issue so that we can examine it locally and provide a more specific answer.

Greetings,
Slav
the Telerik team

If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now