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

Closing Dock Triggers 'Compatibility Mode', Refreshes Page

5 Answers 49 Views
Dock
This is a migrated thread and some comments may be shown as answers.
Richard Weeks
Top achievements
Rank 2
Richard Weeks asked on 03 Dec 2010, 01:11 AM
Hi, I created a simple Dock to pass messages back but when the close icon in the dock is clicked IE8 triggers compatibility mode and reloads the page. After that I can refresh the page and everything works. It is only on the first page load the issue presents itself.

Here is my code, first the Master Page:

<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Site.Master.cs" Inherits="Web.App_Templates.Site" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head runat="server">
    <title><Page Title</title>
    <telerik:RadStyleSheetManager id="TelerikStyleSheetManager" runat="server" />
    <asp:ContentPlaceHolder ID="HeadContentPlaceHolder" runat="server">
    </asp:ContentPlaceHolder>
</head>
<body>
    <form id="MainForm" runat="server">
  
        <telerik:RadScriptManager ID="TelerikScriptManager" runat="server">
            <Scripts>
                <%--Needed for JavaScript IntelliSense in VS2010--%>
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />
            </Scripts>
        </telerik:RadScriptManager>
  
        <asp:ContentPlaceHolder ID="ScriptContentPlaceHolder" runat="server">
        </asp:ContentPlaceHolder>
  
        <telerik:RadAjaxManager ID="TelerikAjaxManager" runat="server">
            <AjaxSettings>
                <telerik:AjaxSetting AjaxControlID="TelerikDock"></telerik:AjaxSetting>
            </AjaxSettings>
        </telerik:RadAjaxManager>
  
        <telerik:RadSkinManager ID="TelerikSkinManager" Runat="server" Skin="Telerik">
        </telerik:RadSkinManager>
  
        <telerik:RadWindowManager ID="TelerikWindowManager" runat="server">
            <Windows>
                <telerik:RadWindow ID="TelerikWindow" runat="server">
                </telerik:RadWindow>
            </Windows>
        </telerik:RadWindowManager>
  
        <telerik:RadFormDecorator ID="TelerikFormDecorator" Runat="server" Skin="Telerik" DecoratedControls="All" />
  
        <asp:UpdatePanel 
            ID="MainUpdatePanel" 
            runat="server">
            <ContentTemplate>
  
                <telerik:RadDockLayout 
                    runat="server" 
                    ID="TelerikDockLayout" 
                    Visible="false">
                    <telerik:RadDockZone ID="TelerikDockZone" runat="server" Orientation="Horizontal" MinHeight="20px" BorderWidth="0">
                    <telerik:RadDock ID="TelerikDock" runat="server" Title="Informational Message" Width="100%" EnableAnimation="true" EnableRoundedCorners="true" Resizable="true">
                        <ContentTemplate>
  
                            <asp:Literal 
                                ID="Feedback" 
                                runat="server" 
                                Text=" " />
  
                        </ContentTemplate>
                    </telerik:RadDock>
                    </telerik:RadDockZone>
                </telerik:RadDockLayout>
  
                <asp:ContentPlaceHolder 
                    ID="MainContentPlaceHolder" 
                    runat="server">
                </asp:ContentPlaceHolder>
  
            </ContentTemplate>
        </asp:UpdatePanel>
  
    </form>
</body>
</html>

Master page code behind (simplified):

namespace Web.App_Templates
{
    using System;
    using System.Web.UI;
  
    public partial class Site : MasterPage
    {
        public void ShowFeedback(string feedBackText, bool useAlert)
        {
            if (feedBackText == string.Empty)
            {
                this.Feedback.Text = feedBackText;
                this.TelerikDock.Title = feedBackText;
                this.TelerikDockLayout.Visible = false;
            }
            else
            {
                if (useAlert)
                {
                    var radAlertScript =
                        string.Format(
                            "function f(){{radalert('{0}', 330, 210);Sys.Application.remove_load(f);}};Sys.Application.add_load(f);",
                            feedBackText);
  
                    ScriptManager.RegisterStartupScript(
                        Page, 
                        Page.GetType(), 
                        "Feedback"
                        radAlertScript, 
                        true);
                }
                else
                {
                    this.Feedback.Text = feedBackText;
  
                    this.TelerikDockLayout.Visible = true;
                }
            }
        }
  
        public void ShowFeedback(string feedbackTitle, string feedBackText, bool useAlert)
        {
            if (feedBackText == string.Empty)
            {
                this.Feedback.Text = feedBackText;
                this.TelerikDock.Title = feedBackText;
                this.TelerikDockLayout.Visible = false;
            }
            else
            {
                if (useAlert)
                {
                    var radAlertScript =
                        string.Format(
                            "function f(){{radalert('{0}', 330, 210, '{1}');Sys.Application.remove_load(f);}};Sys.Application.add_load(f);",
                            feedBackText, 
                            feedbackTitle);
  
                    ScriptManager.RegisterStartupScript(
                        Page, 
                        Page.GetType(), 
                        "Feedback"
                        radAlertScript, 
                        true);
                }
                else
                {
                    this.Feedback.Text = feedBackText;
  
                    this.TelerikDock.Title = feedbackTitle;
  
                    this.TelerikDockLayout.Visible = true;
                }
            }
        }
    }
}

(bear with me :) Content Page:

<%@ Page Title="Home" Language="C#" MasterPageFile="~/App_Templates/Site.Master" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="Web.Default" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<%@ MasterType VirtualPath="~/App_Templates/Site.Master" %>
  
<asp:Content ID="HeadContent" ContentPlaceHolderID="HeadContentPlaceHolder" runat="server">
</asp:Content>
  
<asp:Content ID="ScriptContent" ContentPlaceHolderID="ScriptContentPlaceHolder" runat="server">
</asp:Content>
  
<asp:Content ID="MainContent" ContentPlaceHolderID="MainContentPlaceHolder" runat="server">
  
  
  
</asp:Content>

...and finally, the content page code behind (again simplified):

namespace Web
{
    using System;
  
    public partial class Default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            this.Master.ShowFeedback("Test Title", "Test normal feedback message.", false);
  
            // this.Master.ShowFeedback( "Test Title", "Test pop-up feedback message.",true);
       }
    }
}

Everything works fine, there are no errors (client or server) but when I click close, that is when the compatibility view triggers and the page reloads (displaying the messages again).

Can anyone tell me what the issue is? I'll admit my experience of using Dock is minimal, so hopefully it's something stupid simple :)

Thanks in advance,
Richard

5 Answers, 1 is accepted

Sort by
0
Pero
Telerik team
answered on 07 Dec 2010, 11:59 AM
Hello Richard,

This is a really strange issue and I can't tell what is causing it. It might be even not related to our controls. I managed to run the code locally, but was not able to reproduce the issue. Here is a video captured while running the application: http://www.screencast.com/users/metalmkd/folders/Jing/media/3e9cc357-8e64-494c-99c6-978db22d4108.
The test project that I tested is attached to the thread. Could you please test it and see if you can observe the problem? Please modify so the problem can be seen and sent it back.

Kind regards,
Pero
the Telerik team
Browse the vast support resources we have to jumpstart your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
0
Richard Weeks
Top achievements
Rank 2
answered on 08 Dec 2010, 01:57 AM
Oh my god but this turned into an epic case of detective work.

I use the Yahoo User Interface (YUI) library, specifically, the Reset, Fonts and Base stylesheets. They are great for providing a predicatable level playing ground.

I have discovered the following YUI stylesheets cause the page to refresh to compatibility mode on the first visit (and the first visit only!) only (so far) when using a dock and attempting to close it.

In css base: 

 

ul li{list-style:disc outside;}

 

And in css reset:

li {list-style:none;}

 

Removing those two styles fixes the problem (no issue for us).

Mad... But I got it. Hopefully of interest to you if you are bored one Friday afternoon ;)

Richard

0
Pero
Telerik team
answered on 08 Dec 2010, 02:24 PM
Hi Richard,

Thank you for useful information!

It will help us when resolving similar issues of other customers. We will research why is this happening.

Greetings,
Pero
the Telerik team
Browse the vast support resources we have to jumpstart your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
0
Richard Weeks
Top achievements
Rank 2
answered on 10 Mar 2011, 12:31 AM
Hi, I haven't forgotten about this but really busy with project deadlines, etc. I plan on returning to this at some future point.

Richard
0
Pero
Telerik team
answered on 15 Mar 2011, 12:44 PM
Hello Richard,

We researched the issue, but couldn't find the reason why is it happening. I have applied both global styles to a sample page with RadDock controls on it, but didn't reproduce the problem locally.
In general it is not a good idea to use global styles together with our RadControls, because the global selectors might break the control's functionality and appearance.

Regards,
Pero
the Telerik team
Registration for Q1 2011 What’s New Webinar Week is now open. Mark your calendar for the week starting March 21st and book your seat for a walk through all the exciting stuff we ship with the new release!
Tags
Dock
Asked by
Richard Weeks
Top achievements
Rank 2
Answers by
Pero
Telerik team
Richard Weeks
Top achievements
Rank 2
Share this question
or