German German English English

 Help users <<    ^ MPForm Help pages ^    >> Private Functions 

 

MPForm Documentation: Table or not?

Level of difficulty: B 

Since Version 1.3.0 the standard layout for a form is based on a <div>-layout. This has, for instance, the advantage that in a small browser window or on mobile devices no horizontal scroll bar is required. Instead, the answers slide from beside the questions to below the questions automagically. Most users feel this as designed more ergonomically. Sometimes however, a table based layout is requested, which is more strict in terms of alignment of the enclosed elements. Up to version 1.2.x this was the default setting in mpform.

A simple example for a layout without tables looks like this (this is the default setting now):

Header:
stays empty
Field Loop:
<div class="questionbox {CLASSES} mpform_title">{TITLE}{REQUIRED}:
<div class="mpform_help">{HELP}</div></div>
<div class="answerbox mpform_field">{FIELD}{ERRORTEXT}</div>
<div class="newline"></div>
Footer:
<div class="submitbox">
<input type="submit" name="submit" class="mpform_submit" value="Submit Form" />
</div>

the layout (as it was the standard settings in earlier version) based on tables on the other hand would look as follows:

Header:
<table cellpadding="2" cellspacing="0" border="0">
Field Loop:
<tr class="{CLASSES}"><td class="mpform_title">{TITLE}{REQUIRED}:</td>
<td class="mpform_help">{HELP}</td>
<td class="mpform_field">{FIELD}{ERRORTEXT}</td></tr>
Footer:
<tr><td></td><td></td> <td><input type="submit" name="submit" class="mpform_submit" value="Formular absenden" /></td></tr> </table>

The classes above are already part of the file frontend.css.

Note that in versions until 1.2.x the place holder {HELP} only worked in tables. If you used another layout, you either need an up-to-date version of mpform or you needed to use {HELPTXT} instead!