What's New?

FormLayout Resize

  1. #1
    Jan 28, 2009, 5:22 PM

    FormLayout Resize

    Sorry for all the posts and if this is again not an actual bug. I have a FormLayout within a panel in the west region (I've removed the BaseCls assignment) and the form controls don't automatically expand to fill if I expand the region. They only resize when I resize the browser window. Code snippet below:

    


<ext:Panel 


ID="Panel1" 


runat="server" 


Title="Properties" 


Frame="true" 


Collapsible="true" 


TitleCollapse="true"


AutoScroll="false"


AutoWidth="true"


>


<Body>


<ext:FormLayout runat="server" LabelAlign="Left" LabelWidth="140">


<ext:Anchor Horizontal="1">


<ext:DateField runat="server" FieldLabel="removed" LabelStyle="font-size:9pt;"></ext:DateField>


</ext:Anchor>


<ext:Anchor Horizontal="1">


<ext:DateField ID="DateField1" runat="server" FieldLabel="removed" LabelStyle="font-size:9pt;"></ext:DateField>


</ext:Anchor>


<ext:Anchor Horizontal="1" >


<ext:NumberField runat="server" FieldLabel="removed" Text="2080"></ext:NumberField>


</ext:Anchor>


<ext:Anchor Horizontal="1">


<ext:NumberField ID="NumberField1" runat="server" FieldLabel="removed " Text="2.44"></ext:NumberField>


</ext:Anchor>


<ext:Anchor Horizontal="1">


<ext:TextField ID="TextField1" runat="server" FieldLabel="removed " Text="12%"></ext:TextField>


</ext:Anchor>


<ext:Anchor Horizontal="1">


<ext:TextField runat="server" FieldLabel="removed Text="12%"></ext:TextField>


</ext:Anchor>


<ext:Anchor Horizontal="1">


<ext:TextField ID="TextField2" runat="server" FieldLabel="removed " Text="15%"></ext:TextField>


</ext:Anchor>


</ext:FormLayout>


</Body>


</ext:Panel>
  2. #2
    Jan 28, 2009, 5:48 PM

    RE: FormLayout Resize

    It is better to place all west panels to the ContainerLayout and call doLayout in Resize event
    <%@ Page Language="C#" EnableViewState="false" %>

<%@ 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 xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title></title>
    <style type="text/css">
        .task-panel
        {
            margin: 5px 0px !important;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <ext:ScriptManager ID="ScriptManager1" runat="server" StateProvider="Cookie" />
    <ext:ViewPort ID="ViewPort1" runat="server">
        <Body>
            <ext:BorderLayout ID="BorderLayout1" runat="server">
                <West Collapsible="true" Split="true" CollapseMode="Mini" MinWidth="150" Margins-Left="2">
                    <ext:Panel ID="WestPanel" runat="server" Width="300" Border="true" Frame="true">
                        <Listeners>
                            <Resize Handler="this.doLayout();" />
                        </Listeners>
                        <Body>
                            <ext:ContainerLayout runat="server">
                            <ext:Panel ID="InstructionsPanel" runat="server" Cls="task-panel" Title="Instructions" Frame="true"
                                Collapsible="true" TitleCollapse="true">
                                <Body>
                                </Body>
                            </ext:Panel>
                            <ext:Panel ID="Panel1" runat="server" Cls="task-panel" Title="Properties" Frame="true" Collapsible="true"
                                TitleCollapse="true">
                                <Body>
                                </Body>
                            </ext:Panel>
                            <ext:Panel ID="Panel2" runat="server" Cls="task-panel" Title="View" Frame="true" Collapsible="true"
                                TitleCollapse="true">
                                <Body>
                                </Body>
                            </ext:Panel>                            
                            <ext:Panel ID="Panel3" runat="server" Cls="task-panel" Title="Properties" Frame="true" Collapsible="true"
                                TitleCollapse="true" AutoScroll="false">                                
                                <Body>
                                    <ext:FormLayout ID="FormLayout1" runat="server" LabelAlign="Left" LabelWidth="140">
                                        <ext:Anchor Horizontal="1">
                                            <ext:DateField ID="DateField1" runat="server" FieldLabel="removed" LabelStyle="font-size:9pt;">
                                            </ext:DateField>
                                        </ext:Anchor>
                                        <ext:Anchor Horizontal="1">
                                            <ext:DateField ID="DateField2" runat="server" FieldLabel="removed" LabelStyle="font-size:9pt;">
                                            </ext:DateField>
                                        </ext:Anchor>
                                        <ext:Anchor Horizontal="1">
                                            <ext:NumberField ID="NumberField1" runat="server" FieldLabel="removed" Text="2080">
                                            </ext:NumberField>
                                        </ext:Anchor>
                                        <ext:Anchor Horizontal="1">
                                            <ext:NumberField ID="NumberField2" runat="server" FieldLabel="removed " Text="2.44">
                                            </ext:NumberField>
                                        </ext:Anchor>
                                        <ext:Anchor Horizontal="1">
                                            <ext:TextField ID="TextField11" runat="server" FieldLabel="removed " Text="12%">
                                            </ext:TextField>
                                        </ext:Anchor>
                                        <ext:Anchor Horizontal="1">
                                            <ext:TextField ID="TextField12" runat="server" FieldLabel="removed" Text="12%">
                                            </ext:TextField>
                                        </ext:Anchor>
                                        <ext:Anchor Horizontal="1">
                                            <ext:TextField ID="TextField13" runat="server" FieldLabel="removed " Text="15%">
                                            </ext:TextField>
                                        </ext:Anchor>
                                    </ext:FormLayout>
                                </Body>
                            </ext:Panel>
                            </ext:ContainerLayout>
                        </Body>
                    </ext:Panel>
                </West>
                <Center>
                    <ext:Panel ID="Panel7" runat="server" Title="" Border="true" Frame="false" Icon="Group">
                        <Body>
                        </Body>
                    </ext:Panel>
                </Center>
            </ext:BorderLayout>
        </Body>
    </ext:ViewPort>
    </form>
</body>
</html>

  3. #3
    Jan 28, 2009, 5:52 PM

    RE: FormLayout Resize

    ok i'll try that. thanks!

Similar Threads

  1. [CLOSED] width not set in FormLayout
    By idrissb in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Jan 25, 2010, 8:39 PM
  2. Problems with FormLayout
    By hbbazan in forum 1.x Help
    Replies: 1
    Last Post: Jan 12, 2010, 12:47 PM
  3. [CLOSED] HtmlEditor cut off in FormLayout
    By state in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Sep 12, 2009, 9:59 AM
  4. ext:Label in FormLayout
    By mrozik in forum 1.x Help
    Replies: 8
    Last Post: Jul 27, 2009, 5:50 PM
  5. [CLOSED] Portal Resize Ajax Event fires on page load... not just on the resize
    By iansriley in forum 1.x Legacy Premium Help
    Replies: 3
    Last Post: Feb 22, 2009, 2:58 PM

Posting Permissions