Hi,
The way I stated my problem the first time was not quite exact. The splitters do work fine when used in conjonction with you CallBackPanel or even with the ASP.NET AJAX UpdatePanel.
I have the problem when I want to use dialog.
Here is an simple page. It is composed of a menu, and two splitters
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default" %>
<%@ Register Assembly="EO.Web" Namespace="EO.Web" TagPrefix="eo" %>
<!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>Untitled Page</title>
<script language="javascript" type="text/javascript">
function ResizeSplitter2()
{
//Get the size of the rightpage pane
var splitter1 = eo_GetObject("Splitter1");
var topPane = splitter1.getRightPane();
var w = topPane.getWidth();
var h = topPane.getHeight();
//Resize Splitter2 accordingly. Note
//the size we set here does not include
//borders. So the size needs to be
//(w - 2, h - 2) instead of (w, h)
var splitter2 = eo_GetObject("Splitter2");
splitter2.setSize(w-2, h-2);
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<eo:Menu ID="Menu1" runat="server" ControlSkinID="MSDN" Width="360px" RaisesServerEvent="True" SaveStateCrossPages="True" StateCookieName="testOE">
<TopGroup>
<Items>
<eo:MenuItem Text-Html="New Menu Item">
<SubMenu>
<Items>
<eo:MenuItem Text-Html="menu1" ItemID="menu1" Value="menu1">
</eo:MenuItem>
<eo:MenuItem Text-Html="New Menu Item">
</eo:MenuItem>
<eo:MenuItem Text-Html="New Menu Item">
</eo:MenuItem>
</Items>
</SubMenu>
</eo:MenuItem>
<eo:MenuItem Text-Html="New Menu Item">
<SubMenu>
<Items>
<eo:MenuItem Text-Html="New Menu Item">
</eo:MenuItem>
</Items>
</SubMenu>
</eo:MenuItem>
<eo:MenuItem Text-Html="New Menu Item">
</eo:MenuItem>
</Items>
</TopGroup>
</eo:Menu>
<eo:CallbackPanel ID="CallbackPanel1" runat="server" Height="450px" Width="100%" Triggers="{ControlID:Menu1;Parameter:}">
<eo:Splitter ID="Splitter1" ClientSideOnResized="ResizeSplitter2" runat="server" Height="100%" Width="100%" BorderColor="#3B619C" BorderStyle="Solid" BorderWidth="1px" ControlSkinID="None" DividerImage="00080201" DividerSize="6" AutoFillWindow="True">
<eo:SplitterPane ID="SplitterPane1" runat="server" Height="100%" Width="25%">
<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label></eo:SplitterPane>
<eo:SplitterPane ID="SplitterPane2" runat="server" Height="100%" Width="75%">
<eo:Splitter ID="Splitter2" runat="server" Height="100%" Width="100%" Orientation="Horizontal" BorderColor="#BED6E0" BorderStyle="Solid" BorderWidth="1px" ControlSkinID="None" DividerCenterImage="00080422" DividerImage="00080421" DividerSize="11">
<eo:SplitterPane ID="SplitterPane3" runat="server" Height="25%" Width="100%">
Top
<asp:Label ID="Label2" runat="server" Text="Label"></asp:Label>
</eo:SplitterPane>
<eo:SplitterPane ID="SplitterPane4" runat="server" Height="75%" Width="100%">
Bottom
<asp:Label ID="Label3" runat="server" Text="Label"></asp:Label>
</eo:SplitterPane>
</eo:Splitter>
</eo:SplitterPane>
</eo:Splitter>
</eo:CallbackPanel>
</div>
</form>
</body>
</html>
The page does not contain the dialog and it is working fine... I mean the splitter resize automatically everytime I resize my browser.
Me problem is when I try to incorporate a Dialog
Here is another example which includes the Dialog
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default" %>
<%@ Register Assembly="EO.Web" Namespace="EO.Web" TagPrefix="eo" %>
<!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>Untitled Page</title>
<script language="javascript" type="text/javascript">
function ResizeSplitter2()
{
//Get the size of the rightpage pane
var splitter1 = eo_GetObject("Splitter1");
var topPane = splitter1.getRightPane();
var w = topPane.getWidth();
var h = topPane.getHeight();
//Resize Splitter2 accordingly. Note
//the size we set here does not include
//borders. So the size needs to be
//(w - 2, h - 2) instead of (w, h)
var splitter2 = eo_GetObject("Splitter2");
splitter2.setSize(w-2, h-2);
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<eo:Menu ID="Menu1" runat="server" ControlSkinID="MSDN" Width="360px" RaisesServerEvent="True" SaveStateCrossPages="True" StateCookieName="testOE">
<TopGroup>
<Items>
<eo:MenuItem Text-Html="New Menu Item">
<SubMenu>
<Items>
<eo:MenuItem Text-Html="menu1" ItemID="menu1" Value="menu1">
</eo:MenuItem>
<eo:MenuItem Text-Html="New Menu Item">
</eo:MenuItem>
<eo:MenuItem Text-Html="New Menu Item">
</eo:MenuItem>
</Items>
</SubMenu>
</eo:MenuItem>
<eo:MenuItem Text-Html="New Menu Item">
<SubMenu>
<Items>
<eo:MenuItem Text-Html="New Menu Item">
</eo:MenuItem>
</Items>
</SubMenu>
</eo:MenuItem>
<eo:MenuItem Text-Html="New Menu Item">
</eo:MenuItem>
</Items>
</TopGroup>
</eo:Menu>
<eo:CallbackPanel ID="CallbackPanel1" runat="server" Height="450px" Width="100%" Triggers="{ControlID:Menu1;Parameter:}">
<eo:Splitter ID="Splitter1" ClientSideOnResized="ResizeSplitter2" runat="server" Height="100%" Width="100%" BorderColor="#3B619C" BorderStyle="Solid" BorderWidth="1px" ControlSkinID="None" DividerImage="00080201" DividerSize="6" AutoFillWindow="True">
<eo:SplitterPane ID="SplitterPane1" runat="server" Height="100%" Width="25%">
<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label></eo:SplitterPane>
<eo:SplitterPane ID="SplitterPane2" runat="server" Height="100%" Width="75%">
<eo:Splitter ID="Splitter2" runat="server" Height="100%" Width="100%" Orientation="Horizontal" BorderColor="#BED6E0" BorderStyle="Solid" BorderWidth="1px" ControlSkinID="None" DividerCenterImage="00080422" DividerImage="00080421" DividerSize="11">
<eo:SplitterPane ID="SplitterPane3" runat="server" Height="25%" Width="100%">
Top
<asp:Label ID="Label2" runat="server" Text="Label"></asp:Label>
</eo:SplitterPane>
<eo:SplitterPane ID="SplitterPane4" runat="server" Height="75%" Width="100%">
Bottom
<asp:Label ID="Label3" runat="server" Text="Label"></asp:Label>
</eo:SplitterPane>
</eo:Splitter>
</eo:SplitterPane>
</eo:Splitter>
<eo:Dialog ID="Dialog1" runat="server" Height="200px" Width="300px" AllowResize="True" BorderColor="#335C88" BorderStyle="Solid" BorderWidth="1px" CloseButtonUrl="00070101" ControlSkinID="None" HeaderHtml="Dialog Title" MinimizeButtonUrl="00070102" ResizeImageUrl="00020014" RestoreButtonUrl="00070103" ShadowColor="LightGray" ShadowDepth="3">
<HeaderStyleActive CssText="padding-right: 4px; padding-left: 4px; font-size: 11px; background-image: url(00070104); padding-bottom: 3px; padding-top: 3px; font-family: tahoma" />
<FooterStyleActive CssText="background-color: #e5f1fd; padding-bottom: 8px;" />
<ContentStyleActive CssText="border-top: #335c88 1px solid; background-color: #e5f1fd" />
</eo:Dialog>
</eo:CallbackPanel>
</div>
</form>
</body>
</html>
Here is the code behid which I use to show the dialog
Partial Class _Default
Inherits System.Web.UI.Page
Protected Sub TEST(ByVal sender As Object, ByVal e As EO.Web.NavigationItemEventArgs) Handles Menu1.ItemClick
'this the callback
Me.Label1.Text = "coucou"
Me.Label2.Text = "coucou"
Me.Label3.Text = "coucou"
Dialog1.InitialState = EO.Web.DialogState.Visible
End Sub
End Class
NOTE: If I put the dialog outside the CallBackPanel, the splitter work well and resize perfectly but the Dialog never show up.
If I put the Dialog inside the CallBackPanel (like in the example) the Dialog show up properly but the splitter don't work anymore.
I have that issue only with IE 7 and Google Chrome (maybe it does the same in EI 6 I don't know) Firefox is fine
Can you help me?