[CLOSED] How to set Height on application with dynamic content?

Threaded View

Previous Post Previous Post   Next Post Next Post
  1. #1

    [CLOSED] How to set Height on application with dynamic content?

    This is the problem:

    In my application, I have panels with fixed sizes, however I have a panel (BodyContent) which change the content according to user action and its content comes from a database.
    My doubt is, how can I manually to set the height of my main form according to the contents of this BodyContent, or how can I make it automatically adjusted. considering that in its internal content can be panels, as may have a DataView, and how this content is database size will be set according to the size and number of records returned in the query.

    This is an example:

    <%@ Page Language="vb"  %>
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
    
    <!DOCTYPE html>
    
    <script runat="server">
        Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
    
        End Sub
    </script>
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
        
        <style type="text/css">
        
        </style>
    
        <script type="text/javascript" >
    
            Ext.onReady(function () {
    
                Ext.create('Ext.panel.Panel', {
                    width: 500,
                    height: 500,
                    title: 'Border Layout',
                    layout: 'border',
                    autoScroll: true,
                    items: [{
                        title: 'Center Region',
                        flex: 1,
                        id: 'center',
                        region: 'center',
                        xtype: 'panel',
                        layout: 'border',
                        margins: '5 5 0 0',
                        items: [{
                            title: 'CenterEast Region',
                            region: 'east',
                            xtype: 'panel',
                            layout: 'border',
                            width: 100,
                            height: 200,
                            margins: '5 5 0 0'
                        }, {
                            title: 'BodyContent',
                            region: 'center',
                            id: 'bodypanel',
                            xtype: 'panel',
                            layout: 'border',
                            margins: '5 5 0 0'
                        }]
                    }, {
                        title: 'Footer',
                        region: 'south',
                        xtype: 'panel',
                        margins: '5 0 0 5',
                        flex: 0,
                        id: 'footer',
                        layout: {
                            type: 'vbox',
                            align: 'stretch',
                            pack: 'start',
                        },
                        items: [{
                            title: '1',
                            height: 50
                        }, {
                            title: '2',
                            height: 50
                        }]
                    }],
                    renderTo: Ext.getBody()
                });
    
                Ext.getCmp('footer').add({
                    title: '3',
                    height: 50
                });
    
                Ext.getCmp('bodypanel').add({
                    xtype: 'panel',
                    title: 'test bodyHeight: ' + Ext.getCmp('bodypanel').getHeight(),
                    region: 'north',
                    height: 100
                });
                Ext.getCmp('bodypanel').add({
                    xtype: 'panel',
                    title: 'test1 bodyHeight: ' + Ext.getCmp('bodypanel').getHeight(),
                    region: 'north',
                    height: 200
                });
                Ext.getCmp('bodypanel').add({
                    xtype: 'panel',
                    title: 'test2 bodyHeight: ' + Ext.getCmp('bodypanel').getHeight(),
                    region: 'north',
                    height: 300
                });
    
            });
    
        </script>
    
    </head>
    <body>
        <ext:ResourceManager ID="resManagerSGE" runat="server" Theme="Default" />
        <form id="form1" runat="server">
        <div>
        
        </div>
        </form>
    </body>
    </html>
    in this case the "dynamic" content is:

                Ext.getCmp('bodypanel').add({
                    xtype: 'panel',
                    title: 'test bodyHeight: ' + Ext.getCmp('bodypanel').getHeight(),
                    region: 'north',
                    height: 100
                });
                Ext.getCmp('bodypanel').add({
                    xtype: 'panel',
                    title: 'test1 bodyHeight: ' + Ext.getCmp('bodypanel').getHeight(),
                    region: 'north',
                    height: 200
                });
                Ext.getCmp('bodypanel').add({
                    xtype: 'panel',
                    title: 'test2 bodyHeight: ' + Ext.getCmp('bodypanel').getHeight(),
                    region: 'north',
                    height: 300
                });
    Thank you in advance
    Last edited by Daniil; Apr 04, 2014 at 9:05 PM. Reason: [CLOSED]

Similar Threads

  1. [CLOSED] FieldSet height depending on content
    By Daly_AF in forum 1.x Legacy Premium Help
    Replies: 10
    Last Post: Jul 18, 2012, 1:18 AM
  2. Height of TabPanel content
    By Chuck in forum 1.x Help
    Replies: 9
    Last Post: Mar 14, 2012, 10:31 PM
  3. [CLOSED] Dynamic Columns and Fields MVC application.
    By romeu in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Feb 27, 2012, 7:23 PM
  4. [CLOSED] Dynamic Columns and Fields MVC application
    By romeu in forum 2.x Legacy Premium Help
    Replies: 10
    Last Post: Feb 27, 2012, 7:08 PM
  5. [CLOSED] Automatic window height based on content
    By jmcantrell in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Jun 28, 2011, 4:49 PM

Posting Permissions