close ad
Install the LAtest Updates to Work with CC 2017 and CC 2018
open ad
View Menu

Technical Support Forums

Free, outstanding support from WebAssist and your colleagues

rating

2 column form

Thread began 9/16/2011 2:55 pm by mick106153 | Last modified 9/21/2011 1:51 pm by Jason Byrnes | 1530 views | 10 replies |

mick106153

2 column form

How would I create a 2 column form similar to the example contained.
If I use the "place on same line as field above" checkbox I can get my checkbox group into the right column but it spaces all the elements in the left column that are "below" it to move down leaving a gap equal in size to the checkbox group in the left column.
If I move my checkbox group to be the last, than "place on same line etc." it moves over as desired leaving a large white space above it.

Any clues?

Mick

PS Should also mention that the checkbox group needs to follow tab order logically after all other items save "submit".

Sign in to reply to this post

Jason ByrnesWebAssist

For a 2 column from you need to make sure the CSS Design you have selected is set to create a 2 column layout.

In the Form builder wizard click the customize CSS button, set the width of the form, and set the columns to 2, set the width of the columns to be half the width of the form.


now when adding elements to the form, you will first add the group, go into the edit group screen, each group will be made up of Lines. each line will have Set 1 and Set 2, items in Set one, will be in one column, items in set 2 will be in another.

For an example, you should examine the brassy design, this is a 2 column design.


for the tab order, you will need to set the tab index for each element after the form is created.

Sign in to reply to this post

mick106153

Using Brassy and adding a checkbox group gives the following.

I know how to use CSS Form Builder. I just need to know how to make it not do this.

Mick

Sign in to reply to this post

Jason ByrnesWebAssist

Use 1 element group. When you edit the element group, use 1 line.

add all of the text boxes to Line 1 -> Set 1. add the Checkbox group to Line 1 -> Set 2

Sign in to reply to this post

mick106153

See attachments

Sign in to reply to this post

Jason ByrnesWebAssist

This looks like a blank layout, make sure you have set the form to use 2 columns by editing the css layout, on a blank layout, the form will default to 1 column.

Sign in to reply to this post

mick106153

More examples

Sign in to reply to this post

mick106153

And than it flaked out on me.
It's done this before
Mac Intel 2.4 Core 2 Duo
2 GB 667 MHz DDR2 SDRAM

OS X 10.6.8

DW CS4

Latest versions of your apps

Mick

Sign in to reply to this post

Jason ByrnesWebAssist

I dont think the wizard is going to give you exactly the layout you are after without a little customization after the form is created. the wizard cannot create the type of box modal layout from your initial screen shot. your screen shot is basicly trying to place a container for the checkboxes inside the right column

+-----------+------------+
| --------- | +--------+ |
| --------- | | x | |
| --------- | | X | |
| --------- | | x | |
| --------- | | x | |
| --------- | +--------+ |
| --------- | ---------- |
| --------- | ---------- |
+-----------+------------+



the box modal that the wizard can create though, does not offer adding a container, it can only do standard single lines for each column:

+-----------+------------+
| --------- | ---------- |
| --------- | ---------- |
| --------- | ---------- |
| --------- | ---------- |
| --------- | ---------- |
| --------- | ---------- |
| --------- | ---------- |
| --------- | ---------- |
+-----------+------------+



hopefully my ascii illustrations help clarify this.

I think the closest you will get using the wizard is to create a text box on each line, then rename them after the wizard creates the form to create the checkbox group.

So in the wizard, for each line, create set 1 as the text box, and set 2 as the checkbox. it will end up putting 1 checkbox next to each text box.

after the wizard creates the form, rename each checkbox to have the same name, and add "[]" at the end of the name, for example:
interestedIn[]

Sign in to reply to this post

mick106153

OK Jason
Getting back to any earlier question.
Can 2 forms reside side by side with the first handing off to the second?

And regarding my last post, any thoughts on the errors?

Mick

Sign in to reply to this post
loading

Build websites with a little help from your friends

Your friends over here at WebAssist! These Dreamweaver extensions will assist you in building unlimited, custom websites.

Build websites from already-built web applications

These out-of-the-box solutions provide you proven, tested applications that can be up and running now.  Build a store, a gallery, or a web-based email solution.

Want your website pre-built and hosted?

Close Windowclose

Rate your experience or provide feedback on this page

Account or customer service questions?
Please user our contact form.

Need technical support?
Please visit support to ask a question

Content

rating

Layout

rating

Ease of use

rating

security code refresh image

We do not respond to comments submitted from this page directly, but we do read and analyze any feedback and will use it to help make your experience better in the future.

Close Windowclose

We were unable to retrieve the attached file

Close Windowclose

Attach and remove files

add attachmentAdd attachment
Close Windowclose

Enter the URL you would like to link to in your post

Close Windowclose

This is how you use right click RTF editing

Enable right click RTF editing option allows you to add html markup into your tutorial such as images, bulleted lists, files and more...

-- click to close --

Uploading file...