Templates for Forms

[Byrd]

I'm not very good at CSS at all. Is there an easy way (like the drag and drop WYSIWYG editor in Smart Form Gold) to move the elements around on the page of the form.

My end result would be a form that is not straight down the page in a row. I would like to be able to place elements beside each other on the same line.

Any help is greatly appreciated.

 

[sekar1959]

go to Group--> select your the form. go to layout. change the column number to 2 or 3 to place the rows side by side.

 

[Byrd]

Thank you. Now I have columns, but my tab order is making it so the form goes across the 3 colums, then down a row, then across, then down a row etc.

I would like my order to be so the the form goes down all of column one, then jump to the top of column 2 and down all of column 2, then all of column 3...

 

[troester]

Re-order you elements.
In the element list click the two small arrows beside "ID" than you can drag/drop your elements.

 

[Byrd]

I have set the order that I want on the back end:

1. ID
2. NAME
3. STATION
4. PAYMENT
5. CARD TYPE
6. ETC.

In groups, I set to 3 columns, and on the front end, the form lays out like:

1 ---> 2 ---> 3 --->
4 ---> 5 ---> 6 --->

I want the order on the front end to be like this

1 3 5
2 4 6


So the elements stack in columns, and people will finish all of column 1, then go to column 2, then go to column 3...

 

[Sophist]

As troester suggests, reorder your elements to:

1. ID
3. STATION
5. CARD TYPE
2. NAME
4. PAYMENT
6. ETC.

and this should display:

ID STATION CARD TYPE
NAME PAYMENT ETC.
as you want.

 

[Byrd]

I guess I'm not being clear. I'm sorry for the confusion. I get that. However, when people hit the tab key, to tab through the form fields, the tab goes to the right across the row...

1---->2---->3

instead of going down the column

1
2
3

The people who are filling this out want to Tab down and fill out all of Column 1 before going back up to the top of column 2.

They don't want it to go from Row 1 Column 1 to Row 1 Column 2 to Row 1 Column 3, then down to Row 2 Column 1... etc.

It Smart Former Gold, there is a tab priority you can set, to mark when people hit the Tab Key, they go in a specific order. Can this be set in Fabrik?

 

[Sophist]

No - not at present.

I guess there are two ways to achieve what you want:

1. Create a new template which does what you want i.e. in bootstrap:

<div class="row-fluid">
    <div class="span4">
        element 1
        <br />
        element 2
    </div>
</div>

2. Add functionality to fabrik to set a tab order.

Of the two, option 1 seems easiest. If you are using Fabrik 3.1b then take a copy of bootstrap or bootstrap_tabs and change one or two of the default_xxxxx.php files.

There is a wiki article on creating your own template which might help.

S