[CLOSED] "TextArea" inside a Panel, calling "setHeight" on the client side does not resize the control on IE

  1. #1

    [CLOSED] "TextArea" inside a Panel, calling "setHeight" on the client side does not resize the control on IE

    Hello, we have a feature that allows to "expand" a TextArea field by calling the "setHeight" at client side.

    The control is inside a Panel. We have seen that after setting a new Height, the Panel expands and the control re-aligns, hwoever its height does not change. This happens on IE9/10/11.

    Could you please help solving the issue?

    Thank you.
    Last edited by fabricio.murta; Feb 08, 2016 at 7:36 PM.
  2. #2
    Hello,

    I couldn't reproduce your issue here. Can you provide a test case? I've just added a TextArea inside a Panel, and both the Panel's and TextArea heights are changed when I change the TextArea's height.
    Fabrício Murta
    Developer & Support Expert
  3. #3
    Hi Fabricio, and sorry for the delay. We were too busy these last days.

    Browser: IE11
    Ext.net.Version: 3.2.1
    Ext.js 5.1.1.451

    This is an example:

    <!DOCTYPE html>
    <html>
    <head id="Head2" runat="server">
        <title>Debug</title>
    </head>
    <body>
        <form id="Form2" runat="server">
    
            <ext:ResourceManager
                ID="ResourceManager2"
                runat="server"
                Namespace="MyNamespace"
                CleanResourceUrl="true"
                SourceFormatting="true"
                InitScriptMode="Inline"
                ScriptMode="Debug" />
                                                    
            <ext:Viewport runat="server">
                <Items>
                    <ext:FormPanel runat="server" Width="800" MonitorResize="true" Title="FormPanel" Border="true">
                        <LayoutConfig>
                            <ext:FormLayoutConfig LabelWidth="100" />
                        </LayoutConfig>
                        <Items>
                            <ext:TextArea runat="server" ItemID="txtArea">
                            </ext:TextArea>
                        </Items>
                    </ext:FormPanel>
                </Items>
            </ext:Viewport>
        </form>
    </body>
    </html>
    If you run this code on the browser, then on the console you enter:

    var ctl = Ext.ComponentQuery.query('#txtArea')[0]
    ctl.setHeight(300)
    We see that the TextArea is properly centered BUT not resized (height).

    Thank you.
  4. #4
    Hello @adrianot!

    The problem is that the FormLayout is meant to auto-size and align the elements inside it. If you need something out of ordinary, unfortunately you have to fall back to the other layouts.

    By the way, there's not much point left using the FormLayout if you are specifying the field width. I believe in your case you'd better using AnchorLayout in this case. See this example: Anchor with Form.

    I hope this helps!
    Fabrício Murta
    Developer & Support Expert

Similar Threads

  1. Replies: 4
    Last Post: Sep 14, 2015, 7:06 AM
  2. Replies: 0
    Last Post: Mar 13, 2014, 5:34 AM
  3. Replies: 0
    Last Post: Nov 15, 2013, 10:32 AM
  4. Replies: 5
    Last Post: Jul 19, 2012, 1:09 PM
  5. Replies: 5
    Last Post: May 02, 2012, 6:37 PM

Posting Permissions