PDA

View Full Version : [CLOSED] HBoxLayout doesn't work inside of FieldContainer



Svr77
Apr 09, 2013, 5:20 PM
Hello All,

For some reason HBox layout doesn't work well inside of FieldContainer. I specially filled in area of Field Container by green color in order to be sure that it is correctly aligned inside of fieldset. However, the second dropdown box should occupy the rest space of container, but it doesn't work. Please see attached picture:

5988

When I try to use just container instead of field container all is working well. Here is my code:


<ext:Panel ItemID="MainSearchPanel" runat="server" Border="false" Region="East" Collapsible="true" Split="true" CollapseMode="Mini" Title="Company search" Width="200" BodyStyle="background-color : #F4F4F4 !important;" Layout="VBoxLayout">
<LayoutConfig>
<ext:VBoxLayoutConfig Align="Stretch" Pack="Start" />
</LayoutConfig>
<Items>
<ext:FieldSet runat="server" Title="Company" ItemID="fsSearchCompany" LabelAlign="Top" Margin="3" Flex="1" DefaultAnchor="100%">
<Items>
<ext:FieldContainer runat="server" Layout="HBoxLayout" LabelAlign="Top" FieldLabel="Rating" StyleSpec="background-color :green !important;">
<Defaults>
<ext:Parameter Name="editable" Value="false" Mode="Raw" />
<ext:Parameter Name="forceSelection" Value="true" Mode="Raw" />
<ext:Parameter Name="selectOnFocus" Value="true" Mode="Raw" />
</Defaults>
<Items>
<ext:ComboBox runat="server" TagString="CompanyRatingSelector" Width="40" Margins="0 3 0 0" HideLabel="true">
<Items>
<ext:ListItem Text="Less" Value="1" />
<ext:ListItem Text="More" Value="2" />
</Items>
</ext:ComboBox>
<ext:ComboBox runat="server" TagString="CompanyRating" Flex="1" HideLabel="true">
<Items>
<ext:ListItem Text="Rating 1" Value="1" />
<ext:ListItem Text="Rating 2" Value="2" />
<ext:ListItem Text="Rating 3" Value="3" />
<ext:ListItem Text="Rating 4" Value="4" />
<ext:ListItem Text="Rating 5" Value="5" />
</Items>
<SelectedItems>
<ext:ListItem Value="3" />
</SelectedItems>
</ext:ComboBox>
</Items>
</ext:FieldContainer>
</Items>
</ext:FieldSet>
</Items>
</ext:Panel>


Thanks,
Alexander

Vladimir
Apr 09, 2013, 6:15 PM
For me, it works correctly with latest code (second combo occupies all free space)
try to update from trunk and retest

Svr77
Apr 09, 2013, 6:32 PM
The problem is that I can't use the latest version of sources, due to big amount of changes that need to be done in my project. At the moment I am using Ext.Net 2.1.0.32223.

Alexander

geoffrey.mcgill
Apr 09, 2013, 6:39 PM
The problem is that I can't use the latest version of sources, due to big amount of changes that need to be done in my project. At the moment I am using Ext.Net 2.1.0.32223.

Alexander

Can you outline what changes would be required? Changes because of differences in Ext.NET versions?

Svr77
Apr 09, 2013, 9:16 PM
Hi Geoffrey,

I just downloaded the latest version of ext.net and tried to run my sample on a new project. I see that this problem no longer exists. However, I still can't use the latest version of ext.net due to differences in ExtJs versions which are comes together with 2.1.0 and 2.2.0. When I tried to run the application with the latest version I found that several grids are looking quite strange. I think there are some changes should be done in GetAdditionalData function which is used in rowbody feature. I didn't have enough time to investigate what other changes may be required to migrate on the latest version of ExtJS. Issue which I mentioned in this thread is not so critical and I will find some workaround until find enough time to change the version of ExtJS.

Thanks for your help and please close this thread :-).

Alexander

Daniil
Apr 10, 2013, 6:03 AM
Hi Alexander,

Thank you for clarifying.

I think LabelAlign="Top" causes the problem in v2.1.

I can suggest the following layout to fix the problem.

Example

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

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<!DOCTYPE html>
<html>
<head runat="server">
<title>Ext.NET v2 Example</title>

<style>
.my-fieldset .x-fieldset-body {
background-color: green;
}
</style>
</head>
<body>
<form runat="server">
<ext:ResourceManager runat="server" />
<ext:Panel runat="server" Title="Company search" Width="200">
<LayoutConfig>
<ext:VBoxLayoutConfig Align="Stretch" />
</LayoutConfig>
<Items>
<ext:FieldSet
runat="server"
Title="Company"
Margin="3"
Flex="1"
DefaultAnchor="100%"
Cls="my-fieldset">
<Items>
<ext:DisplayField runat="server" Text="Rating:" />

<ext:FieldContainer runat="server" Layout="HBoxLayout">
<Items>
<ext:ComboBox runat="server" Width="40" Margins="0 3 0 0" />
<ext:ComboBox runat="server" Flex="1" />
</Items>
</ext:FieldContainer>
</Items>
</ext:FieldSet>
</Items>
</ext:Panel>
</form>
</body>
</html>

Svr77
Apr 10, 2013, 8:57 PM
Thanks Daniil, this is working. Actually I did the same but just replaced fieldcontainer with container.

Regards,
Alexander