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

Problem wit RadDockZone and rendering with IE

4 Answers 70 Views

Dock

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

Neil asked on 08 Aug 2010, 07:10 PM

Dear Support Team,

I am having problem with the vertical scroll when adding Raddockzone inside a rad panel. When I add docks dynamically the raddock zone keep expaning outstide the rad dock instead of expaning inside the rad dock.

I have attached copy of my page, your help is much appreciated:

<%@ Page Language="vb" AutoEventWireup="true" CodeBehind="WebForm5.aspx.vb" Inherits="UserMosiacWeb.WebForm5" %>

<!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></title>

</head>
<body>
     <form id="Form1" method="post" runat="server">
       <telerik:RadScriptManager ID="ScriptManager" runat="server" />
        <asp:Button runat="server" CssClass="button" ID="ButtonAddDock" Text="Add Dock" OnClick="ButtonAddDock_Click" />
        <asp:Button runat="server" ID="ButtonPostback" CssClass="button" Text="Make Postback" />
        <br />
        <br />


          <telerik:RadSplitter ID="NestedSplitter" runat="server" Skin="WebBlue" LiveResize="true" Orientation="Horizontal" Height="100%" Width="100%" >
          <telerik:RadPane ID="RightPane" runat="server" Height="400px" Width="100%">

        <asp:UpdatePanel runat="server" ID="UpdatePanel1">
            <ContentTemplate>

                <telerik:RadDockLayout runat="server" ID="RadDockLayout1" OnSaveDockLayout="RadDockLayout1_SaveDockLayout"
                    OnLoadDockLayout="RadDockLayout1_LoadDockLayout" Skin="WebBlue">

                    <telerik:RadDockZone runat="server" ID="RadDockZone1" Width="300" MinHeight="200"
                        Style="float: left; margin-right: 20px;" FitDocks="true">
                    </telerik:RadDockZone>

                    <telerik:RadDockZone Width="300" MinHeight="200" runat="server" ID="RadDockZone2"
                        Style="float: left;">
                    </telerik:RadDockZone>
                </telerik:RadDockLayout>
            </ContentTemplate>
            <Triggers>
                <asp:AsyncPostBackTrigger ControlID="ButtonAddDock" EventName="Click" />
            </Triggers>
        </asp:UpdatePanel>

            </telerik:RadPane>
        </telerik:RadSplitter>
    </form>
</body>
</html>

4 Answers, 1 is accepted

answered on 10 Aug 2010, 04:40 PM

Hi Osama Khattab,

I already answered your other ticket on the same matter. For your convenience I have pasted below my answer.

This is a known issue with IE6/7 which is out of our control. You should set a position:relative to all parent divs. I have repaired the code you sent and everything seems to be fine:

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>

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

<head id="Head1" runat="server">

<title></title>

<style type="text/css">

.NewStyle

{

position:relative;

}

</style>

</head>

<body>

<form id="Form1" method="post" runat="server">

<telerik:RadScriptManager ID="ScriptManager" runat="server" />

<asp:Button runat="server" CssClass="button" ID="ButtonAddDock" Text="Add Dock" />

<asp:Button runat="server" ID="ButtonPostback" CssClass="button" Text="Make Postback" />

<br />

<telerik:RadSplitter ID="NestedSplitter" runat="server" Skin="WebBlue" LiveResize="true" Orientation="Horizontal" Height="100%" Width="100%" >

<telerik:RadPane ID="RightPane" runat="server" Height="400px" Width="100%" CssClass="NewStyle">

<asp:UpdatePanel runat="server" ID="UpdatePanel1" style="position:relative;">

<ContentTemplate>

<telerik:RadDockLayout runat="server" ID="RadDockLayout1" Skin="WebBlue">

<telerik:RadDockZone runat="server" ID="RadDockZone1" Width="300" MinHeight="200"

Style="float: left;position:relative; margin-right: 20px;" FitDocks="true">

</telerik:RadDockZone>

<telerik:RadDockZone Width="300" MinHeight="200" runat="server" ID="RadDockZone2"

Style="float: left;position:relative">

</telerik:RadDockZone>

</telerik:RadDockLayout>

</ContentTemplate>

<Triggers>

<asp:AsyncPostBackTrigger ControlID="ButtonAddDock" EventName="Click" />

</Triggers>

</asp:UpdatePanel>

</telerik:RadPane>

</telerik:RadSplitter>

</form>

</body>

</html>

All the best,
Petio Petkov
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

Product Bundles

DevCraft

Web

Mobile

Document Management

Desktop

Reporting & Mocking

Automated Testing

CMS

UI/UX Tools

Debugging

Free Tools

Support and Learning

Productivity and Design Tools

Problem wit RadDockZone and rendering with IE

4 Answers, 1 is accepted