What's New?

[CLOSED] FitHeight for panel

  1. #1
    Apr 22, 2011, 8:45 PM

    [CLOSED] FitHeight for panel

    Is that possible to set FitHeight on Panels e.g. Panel1, Panel2...Panel5 ?

    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" 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>Ext.Net Example</title>
    <style type="text/css">
        .height_100
        {
           height: 100%;
        }
    </style>
</head>
<body>
    
    <form id="Form1" runat="server">
    <ext:ResourceManager ID="ResourceManager1" runat="server" />
    
     <ext:Viewport ID="ViewPort1" runat="server">
        <Items>
            <ext:ColumnLayout ID="ColumnLayout2" runat="server" Split="false" FitHeight="true">
                <Columns>
                    <ext:LayoutColumn>
                        <ext:Panel ID="pnlProduct" runat="server"   Title="Products" Width="300"/>
                    </ext:LayoutColumn>
                    <ext:LayoutColumn ColumnWidth="1">
                        <ext:Panel ID="pnlSets" runat="server"  Header="false" Layout="table"  AutoScroll="true" >
                        <Items>
                            <ext:Panel ID="Panel1" runat="server"  Width="300" Title="Set 1" /> 
                            <ext:Panel ID="Panel2" runat="server"  Width="300" Title="Set 2"/>
                            <ext:Panel ID="Panel3" runat="server"  Width="300" Title="Set 3"/>
                            <ext:Panel ID="Panel4" runat="server"  Width="300" Title="Set 4"/>
                        </Items>
                        </ext:Panel>
                    </ext:LayoutColumn>
                  
                </Columns>
            </ext:ColumnLayout>
        </Items>
    </ext:Viewport>
    </form>
</body>
</html>
    Last edited by Daniil; Apr 28, 2011 at 4:26 PM. Reason: [CLOSED]
  2. #2
    Apr 23, 2011, 12:34 PM
    Hi,

    TableLayout doesn't support "fit height" behavior.

    Please use HBoxLayout or ColumnLayout.

    Example
    <%@ Page Language="C#" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" 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 runat="server">
    <title>Ext.Net Example</title>
</head>
<body>
    <form runat="server">
    <ext:ResourceManager runat="server" />
    <ext:Viewport runat="server" Layout="column">
        <Items>
            <ext:Panel runat="server" Title="Products" Width="300" />
            <ext:Panel runat="server" ColumnWidth="1" Layout="hbox" AutoScroll="true">
                <LayoutConfig>
                    <ext:HBoxLayoutConfig Align="Stretch" />
                </LayoutConfig>
                <Items>
                    <ext:Panel runat="server" Width="300" Title="Set 1" />
                    <ext:Panel runat="server" Width="300" Title="Set 2" />
                    <ext:Panel runat="server" Width="300" Title="Set 3" />
                    <ext:Panel runat="server" Width="300" Title="Set 4" />
                </Items>
            </ext:Panel>
        </Items>
    </ext:Viewport>
    </form>
</body>
</html>
  3. #3
    Apr 28, 2011, 9:41 AM
    Hi Daniil,

    Actually I want vertical scroll on viewport and horizontal scroll on second panel items in viewport e.g
    <ext:Panel runat="server" ColumnWidth="1" Layout="hbox" AutoScroll="true">... just horizontal scroll on that panel
    Quote Originally Posted by Daniil View Post
    Hi,

    TableLayout doesn't support "fit height" behavior.

    Please use HBoxLayout or ColumnLayout.

    Example
    <%@ Page Language="C#" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" 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 runat="server">
    <title>Ext.Net Example</title>
</head>
<body>
    <form runat="server">
    <ext:ResourceManager runat="server" />
    <ext:Viewport runat="server" Layout="column">
        <Items>
            <ext:Panel runat="server" Title="Products" Width="300" />
            <ext:Panel runat="server" ColumnWidth="1" Layout="hbox" AutoScroll="true">
                <LayoutConfig>
                    <ext:HBoxLayoutConfig Align="Stretch" />
                </LayoutConfig>
                <Items>
                    <ext:Panel runat="server" Width="300" Title="Set 1" />
                    <ext:Panel runat="server" Width="300" Title="Set 2" />
                    <ext:Panel runat="server" Width="300" Title="Set 3" />
                    <ext:Panel runat="server" Width="300" Title="Set 4" />
                </Items>
            </ext:Panel>
        </Items>
    </ext:Viewport>
    </form>
</body>
</html>
  4. #4
    Apr 28, 2011, 11:56 AM
    What about the following layout?

    Example
    <%@ Page Language="C#" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" 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 runat="server">
    <title>Ext.Net Example</title>
</head>
<body>
    <form runat="server">
    <ext:ResourceManager runat="server" />
    <ext:Viewport runat="server" Layout="BorderLayout" AutoScroll="true">
        <Items>
            <ext:Panel runat="server" Title="Products" Width="300" Region="West" AutoScroll="true">
                <Items>
                    <ext:Container runat="server" Height="2000" />
                </Items>
            </ext:Panel>
            <ext:Panel runat="server" Region="Center" AutoScroll="true">
                <Items>
                    <ext:Container runat="server" Width="1200" Height="2000" Layout="ColumnLayout">
                        <Items>
                            <ext:Panel runat="server" Width="300" Title="Set 1" />
                            <ext:Panel runat="server" Width="300" Title="Set 2" />
                            <ext:Panel runat="server" Width="300" Title="Set 3" />
                            <ext:Panel runat="server" Width="300" Title="Set 4" />
                        </Items>
                    </ext:Container>
                </Items>
            </ext:Panel>
        </Items>
    </ext:Viewport>
    </form>
</body>
</html>
  5. #5
    Apr 28, 2011, 4:26 PM
    Thanks Daniil,

    NOTE : Solved

Similar Threads

  1. When selecting datefield contain in a pop up panel, problem that popup panel get closed
    By deep in forum 1.x Help
    Replies: 0
    Last Post: Mar 02, 2011, 8:06 AM
  2. [CLOSED] How to change the height property of a panel after it is rendered and also wich url was loaded using that panel?
    By flormariafr in forum 1.x Legacy Premium Help
    Replies: 8
    Last Post: Apr 01, 2010, 6:25 PM
  3. [CLOSED] [1.0] Split and FitHeight?
    By state in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Oct 20, 2009, 6:44 AM
  4. [CLOSED] Auto Resize of North Panel in ViewPort on Panel.AutoLoad
    By randy85253 in forum 1.x Legacy Premium Help
    Replies: 4
    Last Post: Nov 19, 2008, 12:13 AM
  5. [CLOSED] sample for Nav Panel href to update center panel
    By idrissb in forum 1.x Help
    Replies: 3
    Last Post: Sep 13, 2008, 10:09 AM

Tags for this Thread

Posting Permissions