[CLOSED] Reponsive Form

[RCN]

Hi folks, i would like to know whether it is possible to implement a responsive form.

On the following example i use HBox to make fields stay side by side, as shown below:

<ext:ResourceManager runat="server" SeparateUIStyles="false" Theme="Gray" />
<ext:Window ID="Window1" runat="server" Title="Window" Width="600" Height="250" Layout="FitLayout"
    AutoDataBind="true">
    <Items>
        <ext:FormPanel ID="FormPanel1" runat="server" Title="Form Panel" Layout="HBoxLayout">
            <LayoutConfig>
                <ext:HBoxLayoutConfig Align="StretchMax" />
            </LayoutConfig>
            <FieldDefaults LabelAlign="Top" MsgTarget="Side" />
            <Defaults>
                <ext:Parameter Name="Border" Value="false" />
                <ext:Parameter Name="Flex" Value="1" />
                <ext:Parameter Name="Layout" Value="anchor" />
            </Defaults>
            <Items>
                <ext:Panel ID="Panel1" runat="server">
                    <Items>
                        <ext:TextField ID="TextField1" MinWidth="100" runat="server" FieldLabel="First Name"
                            AnchorHorizontal="-5" Name="first" />
                        <ext:TextField ID="TextField2" MinWidth="100" runat="server" FieldLabel="Company"
                            AnchorHorizontal="-5" Name="company" />
                    </Items>
                </ext:Panel>
                <ext:Panel ID="Panel2" runat="server">
                    <Items>
                        <ext:TextField ID="TextField3" MinWidth="100" runat="server" FieldLabel="Last Name" AnchorHorizontal="100%"
                            Name="last" />
                        <ext:TextField ID="TextField4" MinWidth="100" runat="server" FieldLabel="Email" AnchorHorizontal="100%"
                            Name="email" Vtype="email" />
                    </Items>
                </ext:Panel>
            </Items>
        </ext:FormPanel>
    </Items>
</ext:Window>

But when it is resized to an specified size, i would like that it act like a VBox, as shown below:



I took a look on the following thread http://forums.ext.net/showthread.php...n-with-ext-net but i was not able to achieve it.

Thanks in advance.

[Daniil]

Hi Raphael,

Unfortunately, there is no such the functionality built-in in Ext.NET v2. It is coming with v3. Though, maybe not it beta, but further.

As for Ext.NET v2, I guess you might try to follow this suggestion:
http://www.sencha.com/forum/showthre...l=1#post535661

[RCN]

Thank you Daniil. Please keep me posted about any update :)

[Daniil]

This will be possible with Ext.NET v3.
http://dev.sencha.com/ext/5.0.1/exam...app/index.html

[RCN]

This functionality is awesome since it enables us to change application layout, specially when end-user is using a mobile. Having this functionality and Crisp Touch theme will let us to push forward :)

[RCN]

Daniil, take a look on the following example: http://dev.sencha.com/ext/5.0.1/exam...ard/index.html

The menu is set to "compact" mode when the window is resized. Fully responsive :)

[Daniil]

Yes, that is excellent functionality!

Before migrating from v2 to v3 do not forget to look at the breaking changes document:)

[RCN]

I will start to migrate the app at the moment that the v3 beta is available. I will keep you posted about any issue that i eventually find and don't worry, i will read the bc doc :)

[Daniil]

The ResponsiveConfig support has been added for v3 in SVN, the revision #6167.

The example's location is "Miscellaneous/Responsive/Basic/".

It will go to the next v3.0 release which should appear quite soon.

[RCN]

Awesome Daniil :)