Form Directives for Fat-Free Framework

This is a collection of additional form-related HTML tag handlers for easy creating and working with input elements.

It offers server side data handling to form / input / select / textarea elements and handles the posted values of those elements and decides whether to check / select the element or not - all without the need to write additional inline conditions.

This is useful for quick and easy form integration, especially for bigger forms, so you don't have to bother with putting all values back into the form elements, when loading an existing or submitted form.

To enable all form tag handlers just call:

\Template\Tags\Form::initAll();

download form-directives from github

Inputs

Inputs are automatically filled with the submitted value upon post

simple input field markup:

<input type="text" name="input1" />

input arrays field markup:

<input type="text" name="input_ar[]" />

input field with value attribute overwrite markup:

<input type="text" name="input2" value="{{isset(@POST.input2)?@POST.input2:'abc123'}}" />

input field with dynamic passive attribute markup:

<input type="text" name="input3" class="form-control {{ @nice }}" />

input field with dynamic active attribute markup:

<input type="text" name="{{ @name }}" />

Textarea

Also Textarea is automatically filled with the submitted value.

simple textarea

Checkboxes

a simple checkbox

i am checkable

markup:

<input type="checkbox" name="check1" />

a list of checkboxes created by an array

red

green

blue

markup:

<F3:repeat group="{{ @colors }}" value="{{ @color }}">
    <label><input type="checkbox" name="days-{{ @color }}"/> {{ @color }}</label>
</F3:repeat>

a list of checkboxes with array name

monday

tuesday

wednesday

thursday

friday

saturday

sunday

markup:

<F3:repeat group="{{ @days }}" key="@key" value="{{ @day }}">
    <label><input type="checkbox" name="days[]" value="{{ @key }}"/> {{ @day }}</label>
</F3:repeat>

Radios

a list of radio buttons created by an array

monday

tuesday

wednesday

thursday

friday

saturday

sunday

markup:

<F3:repeat group="{{ @days }}" key="@key" value="{{ @day }}">
    <label><input type="radio" name="radiodays" value="{{ @key }}"/> {{ @day }}</label>
</F3:repeat>

a list of radio buttons with complex array key

monday

tuesday

wednesday

thursday

friday

saturday

sunday

markup:

<F3:repeat group="{{ @days }}" key="@key" value="{{ @day }}">
    <div class="radio">
        <label><input type="radio" name="radiodays4[key][]" value="{{ @key }}"/> {{ @day }}</label>
    </div>
</F3:repeat>

Selects

Select field and their options can be created and automatically checked using a single given array

Select field with simple options markup:

<select class="form-control" name="fruits1">
    <option value="banana">banana</option>
    <option value="cherry">cherry</option>
    <option value="peach">peach</option>
</select>

Select field dynamic name markup:

<select class="form-control" name="fruits2[{{ @fruits2 }}]">
    <option value="pineapple">pineapple</option>
    <option value="cherry">cherry</option>
    <option value="orange">orange</option>
</select>

Select field with simple repeat block markup:

<select class="form-control" name="days2">
    <F3:repeat group="{{ @days }}" key="{{@key}}" value="{{ @label }}">
        <option value="{{@key}}">{{ @label }}</option>
    </F3:repeat>
</select>

Select field build-by "group" attribute

$f3->set('fruits', array(
    'apple',
    'banana',
    'peach',
));

markup:

<select class="form-control" name="fruits" group="{{ @fruits }}"></select>

Select field with additional option elements

$f3->set('colors', array(
    '#f00'=>'red',
    '#0f0'=>'green',
    '#00f'=>'blue',
));

markup:

<select class="form-control" name="colors" group="{{ @colors }}" style="{{isset(@POST.colors)?'border:1px solid '.@POST.colors:'border:1px solid grey'}}">
    <option value="">please select your color</option>
</select>

Select field with dynamic passive attribute markup:

<select class="form-control {{ @green }}" name="select3" group="{{ @fruits }}"></select>

Select field with dynamic active attribute markup:

<select class="form-control" name="{{ @select4 }}" group="{{ @fruits }}"></select>

Select field with complex dynamic array key markup:

<select class="form-control" name="select5[{{ @select5 }}][]" group="{{ @fruits }}"></select>