Nov 25, 2010, 9:48 AM
[CLOSED] Layout issues
Hi,
i am having Layout issues (Mainly in ie6 - Using v2.0.50727 Coolite.Ext.Web) Using the code below. I have been able to see these controls on an individual basis working in ie6 from your example browser, however when plugged together as below the PanelSelection Floats higher than its bounding parent. Plus the Column Layouts do not fit in the available screen space. Nor does the ProposalNAvigationCollapsed function work (This should expand or contract the PanelSelection to fill available screen space. This code works fine in ie7 and above.
Having said that - Whilst trying various options ot see why it was not working in ie6 I changed the split="true" to false. This had the effect of incorrectly drawing the frame around the Available Templates Panel and occasionally displaying in the same offset manner as in ie6. Ive attached an image of the ie7 incorrect frame.
Please can you help me
a) understand if this will work in ie6 and how to make it work.
b)understand why changing the Split to false had such a visually impact. I dont want these to be split.
Many Thanks
Code:
i am having Layout issues (Mainly in ie6 - Using v2.0.50727 Coolite.Ext.Web) Using the code below. I have been able to see these controls on an individual basis working in ie6 from your example browser, however when plugged together as below the PanelSelection Floats higher than its bounding parent. Plus the Column Layouts do not fit in the available screen space. Nor does the ProposalNAvigationCollapsed function work (This should expand or contract the PanelSelection to fill available screen space. This code works fine in ie7 and above.
Having said that - Whilst trying various options ot see why it was not working in ie6 I changed the split="true" to false. This had the effect of incorrectly drawing the frame around the Available Templates Panel and occasionally displaying in the same offset manner as in ie6. Ive attached an image of the ie7 incorrect frame.
Please can you help me
a) understand if this will work in ie6 and how to make it work.
b)understand why changing the Split to false had such a visually impact. I dont want these to be split.
Many Thanks
Code:
<%@ Page Language="c#" ContentType="text/html" ResponseEncoding="iso-8859-1" CodeBehind="tracker_pssrTemplate.aspx.cs"
AutoEventWireup="True" Inherits="Com.Dss.Kms.Tracker.tracker_pssrTemplate" %>
<%@ Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" TagPrefix="ext" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head runat="server">
<title>PSSR Template</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<ext:TokenScript ID="TokenScript1" runat="server">
<script type="text/javascript">
function ProposalNavigationCollapsed() {
#{ViewPortPSSRTemplate}.doLayout();
}
</script>
</ext:TokenScript>
</head>
<body>
<form id="PSSRTemplate_Form" name="PSSRTemplate_Form" action="" method="post" runat="server">
<ext:ScriptManager runat="server"></ext:ScriptManager>
<ext:ViewPort ID="ViewPortPSSRTemplate" runat="server" >
<Body>
<ext:RowLayout ID="RowMain" runat="server" >
<ext:LayoutRow>
<ext:Panel ID="PanelHeader" runat="server">
<Body>
Header Module
</Body>
</ext:Panel>
</ext:LayoutRow>
<ext:LayoutRow >
<ext:Panel ID="PanelNavigation" runat="server" BaseCls="TransparentHolder">
<Body>
<ext:Panel ID="Panel6" Shadow="Drop" runat="server" Frame="true" Title="Available Templates"
BodyStyle="padding:20px" ButtonAlign="Right" Visible="true" Hidden="false" Collapsible="true">
<Body>
NavigationBar
</Body>
<Listeners>
<Collapse Handler="ProposalNavigationCollapsed();" />
<Expand Handler="ProposalNavigationCollapsed();" />
</Listeners>
</ext:Panel>
</Body>
</ext:Panel>
</ext:LayoutRow>
<ext:LayoutRow RowHeight="1.0">
<ext:Panel ID="PanelPageContent" runat="server" BaseCls="TransparentHolderBottom" Frame="true" >
<Body>
<ext:FitLayout runat="server">
<Items>
<ext:Panel ID="PanelPSSRTemplates" Shadow="Drop" runat="server" Frame="true" Title="Assign PSSR Templates"
ButtonAlign="Right" Visible="true" Hidden="false" Collapsible="false">
<Body>
<ext:RowLayout ID="RowContent" runat="server">
<ext:LayoutRow RowHeight="1.0">
<ext:Panel ID="PanelSelection" runat="server" BaseCls="TransparentHolder">
<Body>
<ext:ColumnLayout ID="ColumnLayout1" runat="server" Split="false" FitHeight="true" >
<Columns>
<ext:LayoutColumn >
<ext:Panel ID="Panel1" Shadow="Drop" runat="server" Frame="true" Title="Available Templates"
ButtonAlign="Right" Visible="true" Hidden="false" Collapsible="false">
<Body>
This is some content.
</Body>
</ext:Panel>
</ext:LayoutColumn>
<ext:LayoutColumn >
<ext:Panel ButtonAlign="Center" ID="Panel2" runat="server" Width="34" Border="false"
BaseCls="TransparentHolder" BodyStyle="text-align:center;padding-top:25px">
<Body>
<ext:Button Width="16" ID="Button1" runat="server" Icon="ResultsetNext" StyleSpec="margin-bottom:2px;">
<Listeners>
<Click Handler="" />
</Listeners>
<ToolTips>
<ext:ToolTip ID="ToolTip1" runat="server" Title="Add" Html="Add Selected Rows" />
</ToolTips>
</ext:Button>
<ext:Button Width="16" ID="Button2" runat="server" Icon="ResultsetLast" StyleSpec="margin-bottom:2px;">
<Listeners>
<Click Handler="" />
</Listeners>
<ToolTips>
<ext:ToolTip ID="ToolTip2" runat="server" Title="Add all" Html="Add All Rows" />
</ToolTips>
</ext:Button>
<ext:Button Width="16" ID="Button3" runat="server" Icon="ResultsetPrevious" StyleSpec="margin-bottom:2px;">
<Listeners>
<Click Handler="" />
</Listeners>
<ToolTips>
<ext:ToolTip ID="ToolTip3" runat="server" Title="Remove" Html="Remove Selected Rows" />
</ToolTips>
</ext:Button>
<ext:Button Width="16" ID="Button4" runat="server" Icon="ResultsetFirst" StyleSpec="margin-bottom:2px;">
<Listeners>
<Click Handler="" />
</Listeners>
<ToolTips>
<ext:ToolTip ID="ToolTip4" runat="server" Title="Remove all" Html="Remove All Rows" />
</ToolTips>
</ext:Button>
</Body>
</ext:Panel>
</ext:LayoutColumn>
<ext:LayoutColumn ColumnWidth="1.0" >
<ext:Panel ID="Panel3" Shadow="Drop" runat="server" Frame="true" Title="Selected Templates">
<Body>
<ext:Label runat="server" Text="This is some content."></ext:Label>
</Body>
</ext:Panel>
</ext:LayoutColumn>
<ext:LayoutColumn >
<ext:Panel ID="Panel4">
<Body>
</Body>
</ext:Panel>
</ext:LayoutColumn>
</Columns>
</ext:ColumnLayout>
</Body>
</ext:Panel>
</ext:LayoutRow>
<ext:LayoutRow >
<ext:Panel ID="Panel5" runat="server" BaseCls="TransparentHolder">
<Body>
Date Controls
</Body>
</ext:Panel>
</ext:LayoutRow>
</ext:RowLayout>
</Body>
<Buttons>
<ext:Button ID="Button7" runat="server" AutoPostBack="false" Text="Save">
<Listeners>
<Click Handler="getData('1');" />
</Listeners>
</ext:Button>
<ext:Button ID="Button8" runat="server" AutoPostBack="false" Text="Cancel">
<Listeners>
<Click Handler="getData('0');" />
</Listeners>
</ext:Button>
</Buttons>
</ext:Panel>
</Items>
</ext:FitLayout>
</Body>
</ext:Panel>
</ext:LayoutRow>
</ext:RowLayout>
</Body>
</ext:ViewPort>
</form>
</body>
</html>
Last edited by Daniil; Nov 29, 2010 at 7:55 AM.
Reason: Please use [CODE] tags, [CLOSED]