View Full Version : forms with columns padding question

3 Sep 2010, 10:48 PM
Hey guys - I need a bit of help here! I am trying to create a similar effect as seen at /examples/form/check-radio.html example page. I am talking about the two first fieldsets in a column effect.

I need to make a multi-column form but in between the fieldsets I need a bit of spacing! I am not sure if one needs to apply a css or if it is something simpler like bodyStyle. But nothing worked for me, or perhaps I am applying the padding wrong...!

Can anyone just give me a clue?

Thank you guys...

6 Sep 2010, 11:39 AM
Hey Mihai,

Have you tried a hbox layout? You can apply "margins" to each item, or even set a "defaultMargins" to apply to all items within the layout. An hbox layout with two fieldsets will produce a column layout.

7 Sep 2010, 1:52 AM
Hey man...! Thank you very much! I will try that! I already touched on hbox, but never thought of checking the margins...! Thank you so much...!


7 Sep 2010, 6:29 AM
Hey man...!

So okay I am stuck...! I am not sure why it does not want to work..! I created a form tab panel. Added a container and set it's layout as hbox. Now I looked for the defaultMargin, but cannot find this property..! Then I found individual "margin" config which I set for each component. I added two fieldsets so that I can add my form fields in it. They work side by side as it should, but I simplhy cannot add a space between these fieldsets..!

I have entered a string as "top:5, right:5, bottom:5, left:5" for the margin config of the individual fieldset. I even tried it as "{ "top:5, right:5, bottom:5, left:5"}" It simple does not work...!

What could you suggest...?

Thank you in advance...

7 Sep 2010, 6:45 AM
I had the same problems (which is now fixed):

I did try to put the fieldsets directly before but it didn't work for me.

Here's what I did:
I used a simple Container with Layout=column.
Three Containers inside for three columns. Each with Layout=auto, columnwidth=.32, style="padding: 3px;"
In each of the columns, I have between one and three fieldsets with Layout=form and whatever inside them.

Works for me.

7 Sep 2010, 8:06 AM
Hi Mihai,

Indeed defaultMargins is missing. That will be added in our next release.

You can set margins with just a string, as such: 5 5 5 5 which means "5 top, 5 right, 5 bottom, 5 left". It is explained in the documentation: http://dev.sencha.com/deploy/dev/docs/?class=Ext.BoxComponent&member=margins

You could have also entered { top:5, right:5, bottom:5, left:5 } with no quotes anywhere, and it would have been interpreted as an object config and worked fine.

RollingFred's solution would work as well.