Form field types
- Home
- Creating forms
- Form field types
Most of the field types belong to the Fb
class; although they should be called via the Form
class as well (using the same name and signature).
Each field type is provided as a method with a call signature as follows:
function fieldtype (string fieldname, array attributes, array options)
or
echo Form::inputType('inputName', [ 'inputAttributes' ], [' inputOptions' ]);
Example: Form::inputType('inputName', [ 'inputAttributes' ]);
<?php Form::nextFieldDetails('Email', true); echo Form::email('Email', ['placeholder' => 'Email Address', '-wrapper-class' => 'white']); ?>
The attributes are HTML attributes which apply on the input field (which may be an <input>, <select>, etc. as appropriate).
Some fields such as dropdown selectors and date selectors have additional options.
Example: Form::inputType('inputName', [ 'inputAttributes' ], [' inputOptions' ]);
<?php Form::nextFieldDetails('Fruits', false); echo Form::dropdown('fruits', ['-wrapper-class' => 'white'], ['Apple', 'Pear', 'Banana' ]); ?>
The options vary per field type. These are listed in the API documentation.
Complete list of inbuilt field types
Note: screenshots to come forthwith.
autocomplete
A text field which, when the user starts entering text, provides a dropdown list of matching options.
autofillList
Similar to an autocomplete field, but it stores multiple values, which can optionally be ordered.
*This only exists in the Form
class (which you should be using anyway, by the way)
checkboxBoolList
A list of boolean checkboxes (i.e. value '1'), each with a different name
checkboxSet
Checkboxes for a set of options (e.g. 'preferred colours' could have options 'red', 'green', blue', etc.)
chunkedUpload
A file upload field which shows progress as the file is being uploaded. Very handy!
colorpicker
To choose a HTML colour code (i.e. 24-bit hex colour code such as #123ABC)
datepicker
To choose a date and submit in YYYY-MM-DD format
daterangepicker
To choose a 'from' and 'to' date
datetimepicker
To choose a datetime (YYYY-MM-DD HH:mm:ss)
datetimerangepicker
To choose a 'from' and 'to' datetime
dropdown
A HTML <select> element with one or more selectable elements
dropdownTree
Formats a tree structure into a HTML <select> element
A HTML5 email field, which is the same as a text input, with the addition of email validation provided by modern browsers
googleMap
A pannable map for determining lat and long coordinates, and optionally a zoom level
input
A basic <input> tag. You probably shouldn't use this; it's mostly to support the other methods.
money
A number field which shows a currency symbol so you know it's really about money.
multiline
A field for entering multiple lines of text, i.e. a <textarea>
multiradio
A set of radio buttons in a fieldset
number
A HTML5 number field
password
A password field, where the data input is hidden from the user
phone
A HTML5 phone number field (which should show an appropriate software keyboard on a mobile device)
range
A slider which lets the user choose a point on a range between two endpoints
richtext
A rich text (i.e. HTML) field, implemented using TinyMCE.
N.B. This needs strict server-side validation to ensure the resulting HTML doesn't include JavaScript etc.
text
The most basic and common input field
timepicker
For choosing a time (HH:mm)
upload
An old-school file upload field. You really ought to use chunkedUpload instead.
Methods which only apply for admin forms
fileSelector
Supports both searching for files in the media repository and uploading new files
lnk
An interface to link to any type of data (a page, a file, an external URL, ...)
multipleFileSelect
Like the fileSelector, but submits multiple files instead of a single one
pageDropdown
Provides a dropdown list (i.e. a HTML <select>) which contains the entire page tree
Additional methods you might want to know about
heading
A heading in the form of a <h3> tag
output
Output content using a similar visual style to the form fields
tag
Generic method for arbitrary HTML tags
hiddenFields
A group of <input type="hidden"> fields