Ajax broken after upgrade

[Dasha]

Dear Telerik,

We've been happily using your RadAjax controls from the 2011.2.712.35 build for the past 2 years, but this week it was time to upgrade the build version, mainly in our hope to deal with IE10 woes.  We're now running the 2013.1.403.35 build on our SharePoint components. The upgrade mainly went smooth, minus the calendar component.  None of the Ajax functionality is working.  I've setup a simple page to demonstrate the failure.  Is there anything that I need to make sure is present in my code?  Maybe you can suggest a place to start looking?... I'm running out of ideas.  Any help is appreciated!

broken calendar: http://2010test.corasworks.net/df/public/SitePages/calendar.aspx
working grid: http://2010test.corasworks.net/df/public/SitePages/grid.aspx
working tree view: http://2010test.corasworks.net/df/public/SitePages/tree%20view.aspx

Thank you,

Dasha.

[Plamen]

Hi Dasha,

 
I have inspected the "broken calendar" link that you shared and noticed that there is a javascript error that is thrown when the page is loaded and that may be causing the unusual behavior. Please have in mind that we are not aware of any bug or known issue with similar error so it seems that the issue is caused by some custom issue.

 Hope this will help you find out what is causing it. If you still can not find out what is causing it please share the exact code connected to RadScheduler that you use so we could inspect it and be more helpful.

Regards,
Plamen
the Telerik team

[Dasha]

Hello Plamen,

After trying to figure out what's wrong, I tried looking at your demos to see if I can get a clue.  What I discovered was the same exact behavior as in my own web parts!  Go here and try switching between the views (Month/Day/timeline, etc) http://sharepoint.telerik.com/aspnet-ajax/web-parts/Pages/RadScheduler-and-Exchange.aspx .  It works fine the first time, but fails the second time.  All you see is a '#' added to the end of the address line.

My co-worker was able to get your demo working fine on his IE9 browser, but it's failing in Chrome.  For me it fails in IE9, Chrome, and Safari.

We may be missing something, but at least it's something to help you help us :)

Thank you,

Dasha

[Plamen]

Hi Dasha,

 
We have inspected the demo once again but could not replicate the described behavior. Here is the video of my test. Please review it and let us know if I am not testing properly or there is something else that needs to be added or done.

Greetings,
Plamen
the Telerik team

[Dasha]

Plamen,

I made a little bit of progress in my investigating.  I found an error that I made while setting up the demo for you, and now that I've eliminated it, the error seems better isolated.  Ajax calls are working until I hit the Month or Timeline view.  Before those views are triggered, the ajax calls are working perfectly as expected.  I'm providing two screenshots of the js errors that I see thrown during the view change going into Month and Timeline views respectively.

The demo is still up here: http://2010test.corasworks.net/df/public/SitePages/calendar.aspx, the errors are very trivial to replicate.

Please share any thoughts that may help me figure this out.  I really do appreciate you working with me on this issue, I know it's not an easy one!

Thank you so much,

Dasha.

P.S.  We're still able to "break" your demo page in both Chrome and IE.  We were able to break the functionality by three different people yesterday from three different machines.  Maybe it would help to access the page from a different computer?

[Plamen]

Hi Dasha,

 
I have inspected the issue you described and it seems that is caused because of the way to change the view would you please share the code that you use to achieve is so we could inspect it and be more helpful.

As for our demo -we have tested it on different machines but could not observe any javascript error. Would you please send a sample video how you break it so we could inspect it and be able to research it further more?

Kind regards,
Plamen
the Telerik team

[Dasha]

Plamen,

Here's my html:

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="CWCalendarTelerik.ascx.cs" Inherits="CorasWorks.Workplace.Web.UI.Controls.CWCalendarTelerik,CorasWorks.Workplace.Web.UI.Controls, Version=11.0.0.0, Culture=neutral, PublicKeyToken=324bf3c6eca98326" %>
<%@ Register TagPrefix="asp" Namespace="System.Web.UI" Assembly="System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" %>
<%@ Register TagPrefix="cw" Namespace="CorasWorks.Workplace.Web.UI.Controls" Assembly="CorasWorks.Workplace.Web.UI.Controls, Version=11.0.0.0, Culture=neutral, PublicKeyToken=324bf3c6eca98326" %>
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI, Version=2013.1.403.35, Culture=neutral, PublicKeyToken=121fae78165ba3d4" %>
<%@ Register Assembly="CorasWorks.AJAX, Version=1.5.0.0, Culture=neutral, PublicKeyToken=c1ad2eac4457e69a" Namespace="CorasWorks.AJAX" TagPrefix="CWAjax" %>
<%@ Reference Control="/_layouts/CorasWorks.Central.Administration/CWToolTip.ascx" %>
<style type="text/css">
    .RadScheduler_Default .rsHeader
    {
        z-index: 100;
        display: none;
    }
    .RadScheduler .rsHeader
    {
        z-index: 100;
        display: none;
    }
    .RadScheduler .rsWrap
    {
        z-index: 100;
    }
    .RadScheduler_Default .rsWrap
    {
        z-index: 100;
    }
    .cw_DayWithAppointments
    {
        font-weight: bolder !important;
        text-decoration: underline;
    }
    .RadScheduler_Default .rsContentScrollArea, .RadScheduler .rsContentScrollArea
    {
        height: auto !important;
    }
</style>
<script type="text/javascript">
    /* Firefox resize scrollable content */
    function hideScrollableArea(sender, eventArgs) {
        if ($telerik.isFirefox)
            $telerik.$('.rsContentScrollArea').css('overflow', 'hidden');
    }
    function showScrollableArea(sender, eventArgs) {
        if ($telerik.isFirefox)
            $telerik.$('.rsContentScrollArea').css('overflow', 'auto');
    }

</script>
<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" />
<%--<asp:Button runat="server" ID="export" Text="Export" />--%>
<telerik:RadAjaxPanel ID="pnlMainContent" runat="server" LoadingPanelID="RadAjaxLoadingPanel1">
    <CWAjax:Label ID="lblSelectedView" runat="server" Visible="false" AutoUpdateAfterCallBack="true"></CWAjax:Label>
    <asp:Label runat="server" ID="lblJsVariables"></asp:Label>
    <asp:PlaceHolder ID="PHActionsProvider" runat="server"></asp:PlaceHolder>
    <telerik:RadToolTipManager runat="server" ID="RadToolTipManager1"></telerik:RadToolTipManager>
    <asp:Panel ID="pnlNoData" runat="server"></asp:Panel>
    <asp:PlaceHolder ID="placeHolderToolbar" runat="server"></asp:PlaceHolder>
    <table border="1" cellpadding="0" cellspacing="0" width="100%">
        <tr>
            <td style="vertical-align: top;">
                <asp:Table runat="server" ID="tblMain" Width="100%">
                    <asp:TableRow>
                        <asp:TableCell runat="server" ID="tblCellLeft">
                            <telerik:RadCalendar runat="server" ID="RadCalendar1" AutoPostBack="true">
                            </telerik:RadCalendar>
                            <telerik:RadPanelBar runat="server" ID="PanelBar">
                                <Items>
                                    <telerik:RadPanelItem runat="server">
                                        <Items>
                                            <telerik:RadPanelItem runat="server">
                                                <ItemTemplate>
                                                    <div class="rpCheckBoxPanel">
                                                        <asp:Table ID="tblResources" runat="server">
                                                        </asp:Table>
                                                    </div>
                                                </ItemTemplate>
                                            </telerik:RadPanelItem>
                                        </Items>
                                    </telerik:RadPanelItem>
                                    <telerik:RadPanelItem runat="server">
                                        <Items>
                                            <telerik:RadPanelItem runat="server">
                                                <ItemTemplate>
                                                    <div class="rpCheckBoxPanel">
                                                        <asp:Table ID="tblCategories" runat="server">
                                                        </asp:Table>
                                                    </div>
                                                </ItemTemplate>
                                            </telerik:RadPanelItem>
                                        </Items>
                                    </telerik:RadPanelItem>
                                </Items>
                            </telerik:RadPanelBar>
                        </asp:TableCell>
                        <asp:TableCell runat="server" ID="tblCellRight"> </asp:TableCell>
                    </asp:TableRow>
                </asp:Table>
            </td>
            <td style="width: 100%; vertical-align: top;">
                <telerik:RadToolBar runat="server" ID="CWHeader" Width="100%">
                    <Items>
                        <telerik:RadToolBarButton runat="server" ID="btnBack">
                        </telerik:RadToolBarButton>
                        <telerik:RadToolBarButton runat="server" ID="btnForward">
                        </telerik:RadToolBarButton>
                        <telerik:RadToolBarButton runat="server" ID="btnToday">
                        </telerik:RadToolBarButton>
                        <telerik:RadToolBarButton runat="server" ID="btnDatePicker">
                            <ItemTemplate>
                                <telerik:RadDatePicker ID="rdpDatePicker" runat="server" Width="110px" AutoPostBack="true">
                                </telerik:RadDatePicker>
                            </ItemTemplate>
                        </telerik:RadToolBarButton>
                        <telerik:RadToolBarButton runat="server" id="btnTodayLabel" Width="250px">
                            <ItemTemplate>
                                <asp:Label runat="server" ID="lblToday"></asp:Label>
                            </ItemTemplate>
                        </telerik:RadToolBarButton>
                        <telerik:RadToolBarButton runat="server" Value="cwSep1" id="cwSep1" IsSeparator="true">
                        </telerik:RadToolBarButton>
                        <telerik:RadToolBarButton runat="server" ID="btnDay_cwRight" AllowSelfUnCheck="true" CheckOnClick="true">
                        </telerik:RadToolBarButton>
                        <telerik:RadToolBarButton runat="server" ID="btnMonth_cwRight" AllowSelfUnCheck="true" CheckOnClick="true">
                        </telerik:RadToolBarButton>
                        <telerik:RadToolBarButton runat="server" ID="btnWeek_cwRight" AllowSelfUnCheck="true" CheckOnClick="true">
                        </telerik:RadToolBarButton>
                        <telerik:RadToolBarButton runat="server" ID="btnWorkWeek_cwRight" AllowSelfUnCheck="true" CheckOnClick="true">
                        </telerik:RadToolBarButton>
                        <%--<telerik:RadToolBarButton runat="server" ID="btnYear_cwRight" AllowSelfUnCheck="true"
                            CheckOnClick="true">
                        </telerik:RadToolBarButton>--%>
                        <telerik:RadToolBarButton runat="server" ID="btnTimeline_cwRight" AllowSelfUnCheck="true" CheckOnClick="true">
                        </telerik:RadToolBarButton>
                        <telerik:RadToolBarButton runat="server" ID="sepRight1_cwRight" IsSeparator="true">
                        </telerik:RadToolBarButton>
                        <telerik:RadToolBarButton runat="server" ID="btnExportPdf_cwRight">
                        </telerik:RadToolBarButton>
                        <telerik:RadToolBarButton runat="server" ID="btnExportICal_cwRight" PostBack="false">
                        </telerik:RadToolBarButton>
                        <telerik:RadToolBarButton runat="server" ID="sepRight2_cwRight" IsSeparator="true">
                        </telerik:RadToolBarButton>
                        <telerik:RadToolBarButton runat="server" ID="btnSelectDeselectAll_cwRight" PostBack="false">
                            <ItemTemplate>
                                <asp:CheckBox runat="server" ID="cbSelectDeselectAll" />
                            </ItemTemplate>
                        </telerik:RadToolBarButton>
                    </Items>
                </telerik:RadToolBar>
                <telerik:RadScheduler runat="server" ID="CWCalendar" ShowHeader="false" Width="100%">
                    <AppointmentTemplate>
                        <div runat="server" id="divCategories" style="overflow: hidden;">
                            <asp:Table ID="tblCategories" runat="server" BorderWidth="0px" BackColor="Transparent" CellPadding="0" CellSpacing="0">
                                <asp:TableRow BorderWidth="0px">
                                </asp:TableRow>
                            </asp:Table>
                        </div>
                        <div style="float: left; white-space: nowrap;">
                            <span class="rsAptSubject" style="float: left; white-space: nowrap;"><span runat="server" id="recImageEx" class="rsAptRecurrenceException" /><span runat="server" id="recImage" class="rsAptRecurrence" />
                                <%# HttpUtility.HtmlDecode(HttpUtility.HtmlDecode(Eval("Subject").ToString())) %>
                            </span>
                        </div>
                        <div runat="server" id="divDescription" style="font-size: xx-small!important; font-style: italic!important;">
                            <%# CWCalendar.DataDescriptionField %>
                            <%# Eval("Description") %></div>
                    </AppointmentTemplate>
                </telerik:RadScheduler>
            </td>
        </tr>
    </table>
</telerik:RadAjaxPanel>

And here's the event handler for the CWHeader control:

void CWHeader_ButtonClick(object sender, RadToolBarEventArgs e)
        {
            if (e.Item == btnBack)
            {
                if (CWCalendar.SelectedView == SchedulerViewType.DayView)
                    CWCalendar.SelectedDate = CWCalendar.SelectedDate.AddDays(-1);
                else if (CWCalendar.SelectedView == SchedulerViewType.MonthView)
                    CWCalendar.SelectedDate = CWCalendar.SelectedDate.AddMonths(-1);
                else if (CWCalendar.SelectedView == SchedulerViewType.MultiDayView || CWCalendar.SelectedView == SchedulerViewType.WeekView)
                    CWCalendar.SelectedDate = CWCalendar.SelectedDate.AddDays(-7);
                else if (CWCalendar.SelectedView == SchedulerViewType.TimelineView)
                    CWCalendar.SelectedDate = CWCalendar.SelectedDate.AddDays(-10);
            }
            else if (e.Item == btnForward)
            {
                if (CWCalendar.SelectedView == SchedulerViewType.DayView)
                    CWCalendar.SelectedDate = CWCalendar.SelectedDate.AddDays(1);
                else if (CWCalendar.SelectedView == SchedulerViewType.MonthView)
                    CWCalendar.SelectedDate = CWCalendar.SelectedDate.AddMonths(1);
                else if (CWCalendar.SelectedView == SchedulerViewType.MultiDayView || CWCalendar.SelectedView == SchedulerViewType.WeekView)
                    CWCalendar.SelectedDate = CWCalendar.SelectedDate.AddDays(7);
                else if (CWCalendar.SelectedView == SchedulerViewType.TimelineView)
                    CWCalendar.SelectedDate = CWCalendar.SelectedDate.AddDays(10);
            }
            else if (e.Item == btnWorkWeek_cwRight)
            {
                CWCalendar.SelectedView = SchedulerViewType.MultiDayView;
                CWCalendar.SelectedDate = CWCalendar.SelectedDate.AddDays((int)DayOfWeek.Monday - (int)CWCalendar.SelectedDate.DayOfWeek);
            }
            else if (e.Item == btnToday)
            {
                CWCalendar.SelectedDate = DateTime.Now;
            }
            else if (e.Item == btnDay_cwRight) CWCalendar.SelectedView = SchedulerViewType.DayView;
            else if (e.Item == btnMonth_cwRight) CWCalendar.SelectedView = SchedulerViewType.MonthView;
            else if (e.Item == btnWeek_cwRight) CWCalendar.SelectedView = SchedulerViewType.WeekView;
            else if (e.Item == btnTimeline_cwRight)
            {
                CWCalendar.SelectedView = SchedulerViewType.TimelineView;
                CWCalendar.TimelineView.SlotDuration = TimeSpan.Parse("1.00:00:00");
                CWCalendar.TimelineView.TimeLabelSpan = 1;
                CWCalendar.TimelineView.ColumnHeaderDateFormat = CWCalendar.WeekView.HeaderDateFormat;
                CWCalendar.TimelineView.NumberOfSlots = 10;
                btnTimeline_cwRight.Checked = true;
            }
            else if (e.Item == btnExportPdf_cwRight) CWCalendar.ExportToPdf();

            RadCalendar1.SelectedDate = CWCalendar.SelectedDate;
            RadCalendar1.FocusedDate = CWCalendar.SelectedDate;

            SetDateLabel();
        }

We needed a custom toolbar, so the default scheduler header is disabled.

[Dasha]

And here's the jing: http://screencast.com/t/I16E5l7eh9. The error on your demo is different from ours though, they may not be related.

[Plamen]

Hello Dasha,

 
The issue is quite unusual because we have made various tests but could not observe it at our side on any machine we tried. We will continue researching it and will let you know when we have more information about the issue.

Greetings,
Plamen
the Telerik team