[CLOSED] Form panel control width issue

[speedstepmem4]

Hello,

We are using from panel in our application, also we would like to make particular control width as separate. So we provided the width for that particular control, but width is not set to that particular control. All controls getting 100% of width.

Another one issue is, in the same form we are using TextArea filed but is not displayed.

Please check our code and advise to us where we made the mistake. Attached the sample image what we exactly need.

<ext:Panel runat="server" ID="pnlForm" Region="Center" Layout="FitLayout" Border="false">
                        <Items>
                            <ext:FormPanel runat="server" ID="customerForm" Padding="5" AutoScroll="true" Border="false" Layout="ColumnLayout">
                                <FieldDefaults LabelWidth="150" LabelSeparator="" InputWidth="400">
                                </FieldDefaults>
                                <Items>
                                    <ext:Container runat="server" Layout="FormLayout" ColumnWidth="0.5">
                                        <Items>
                                            <ext:TextField Name="Name" runat="server" ID="txtName" FieldLabel="Name" AllowBlank="false" MaxLength="50" MsgTarget="Side" AutoFitErrors="false" Cls="mandatory" DisabledCls="edit-form-disable"></ext:TextField>
                                            <ext:TextField Name="AddressLine1" runat="server" ID="txtAddress1" FieldLabel="Address" MaxLength="200" MsgTarget="Side" AutoFitErrors="false" Cls="edit-form" DisabledCls="edit-form-disable"></ext:TextField>
                                            <ext:TextField Name="Street" runat="server" ID="txtStreet" FieldLabel="Street" MaxLength="50" MsgTarget="Side" AutoFitErrors="false" Cls="edit-form" DisabledCls="edit-form-disable"></ext:TextField>
                                            <ext:TextField Name="PostalCode" runat="server" ID="txtPostalCode" FieldLabel="Postal code" MaxLength="25" MsgTarget="Side" AutoFitErrors="false" Cls="edit-form" DisabledCls="edit-form-disable"></ext:TextField>
                                            <ext:ComboBox runat="server" FieldLabel="Country" ID="chkKind" Width="150"></ext:ComboBox>
                                        </Items>
                                    </ext:Container>
                                    <ext:Container runat="server" Layout="FormLayout" ColumnWidth="0.5">
                                        <Items>
                                            <ext:Checkbox Name="ActiveStatus" runat="server" ID="chkActive" FieldLabel="Active"></ext:Checkbox>
                                            <ext:ComboBox runat="server" FieldLabel="Type" ID="chkKind"> </ext:ComboBox>
                                            <ext:ComboBox runat="server" FieldLabel="Kind" ID="ckhCompanySize"></ext:ComboBox>
                                            <ext:ComboBox runat="server" FieldLabel="Company" ID="ckhCompanySize"></ext:ComboBox>
                                            <ext:TextField runat="server" FieldLabel="Search" ID="txtSearchText"></ext:TextField>
                                        </Items>
                                    </ext:Container>
                                </Items>
                            </ext:FormPanel>
                            <ext:Panel ID="FormPanel2" runat="server" Height="100">
                                <Content>
                                    <ext:TextArea Name="Comments" runat="server" ID="txtComment" FieldLabel="Comments" Height="100"></ext:TextArea>
                                </Content>
                            </ext:Panel>
                        </Items>
                    </ext:Panel>

[Z]

Change your container from formlayout to vboxlayout. The add a layoutconfig for vboxlayout with align as stretchmax and pack start

<ext:Container layout="vboxLayout">
  <LayoutConfig>
     ...

That should work but without the seeing the full code, I recommend you should look carefully to reduce your objects since you seem to have a bunch. For example...put the fitlayout in your viewport and go right into the formlayout.
/Z

[speedstepmem4]

As per your suggestion it will make all control as fixed width..

what we really expect is particular control only fixed width

[Daniil]

Hi @speedstepmem4,

Please use Layout="AnchorLayout" instead of Layout="FormLayout".