Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Form field docs update (fixes #7521)
- Loading branch information
Showing
9 changed files
with
73 additions
and
76 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,83 +1,75 @@ | ||
# Form Field Types | ||
|
||
This is a highlevel overview of available `[apiFormField]` subclasses. An automatically generated list is available through our [API](api:FormField) | ||
This is a highlevel overview of available `[api:apiFormField]` subclasses. An automatically generated list is available through our [API] | ||
|
||
## Formatted Input | ||
## Basic | ||
|
||
* `[AjaxUniqueTextField](api:AjaxUniqueTextField)`: Text field that automatically checks that the value entered is unique for | ||
the given set of fields in a given set of tables | ||
* `[AutocompleteTextField](api:AutocompleteTextField)` | ||
* `[ConfirmedPasswordField](api:ConfirmedPasswordField)`: Shows two password-fields, and checks for matching passwords. | ||
* `[CreditCardField](api:CreditCardField)` | ||
* `[CurrencyField](api:CurrencyField)` | ||
* `[EmailField](api:EmailField)` | ||
* `[HTMLEditorField](api:HTMLEditorField)`: A WYSIWYG editor field, powered by tinymce. | ||
* `[NumericField](api:NumericField)`: A Single Numeric field extending a typical TextField but with validation. | ||
* `[PasswordField](api:PasswordField)` | ||
* `[UniqueRestrictedTextField](api:UniqueRestrictedTextField)`: Text field that automatically checks that the value entered | ||
is unique for the given set of fields in a given set of tables | ||
* `[UniqueTextField](api:UniqueTextField)`: Text field that automatically checks that the value entered is unique for the | ||
given set of fields in a given set of tables | ||
|
||
## Date/Time | ||
|
||
* `[DateField](api:DateField)`: Represents a date in a textfield (New Zealand) | ||
* `[DatetimeField](api:DatetimeField)`: Combined date- and time field | ||
* `[TimeField](api:TimeField)`: Represents time in a textfield (New Zealand) | ||
* `[api:CheckboxField]`: Single checkbox field. | ||
* `[api:DropdownField]`: A `<select>` tag. Can optionally save into has-one relationships. | ||
* `[api:ReadonlyField]`: Read-only field to display a non-editable value with a label. | ||
* `[api:TextareaField]`: Multi-line text field. | ||
* `[api:TextField]`: Multi-line text field. | ||
* `[api:PasswordField]`: Masked input field | ||
|
||
## Structure | ||
## Actions | ||
|
||
* `[CompositeField](api:CompositeField)`: Base class for all fields that contain other fields. Uses `<div>` in template, but | ||
doesn't necessarily have any visible styling. | ||
* `[FieldGroup](api:FieldGroup)`: Same as CompositeField, but has default styling (indentation) attached in CMS-context. | ||
* `[api:FieldList]`: Basic container for sequential fields, or nested fields through CompositeField. Does NOT render a | ||
`<fieldgroup>`. | ||
* `[TabSet](api:TabSet)` | ||
* `[Tab](api:Tab)` | ||
* `[api:FormAction]`: Button element for forms, both for `<input type="submit">` and `<button>`. | ||
* `[api:ResetFormAction]`: Action that clears all fields on a form. | ||
|
||
## Formatted Input | ||
|
||
* `[api:AjaxUniqueTextField]`: Text field that automatically checks that the value entered is unique for the given set of fields in a given set of tables | ||
|
||
* `[api:ConfirmedPasswordField]`: Two masked input fields, checks for matching passwords. | ||
* `[api:CountryDropdownField]`: A simple extension to dropdown field, pre-configured to list countries. | ||
* `[api:CreditCardField]`: Allows input of credit card numbers via four separate form fields, including generic validation of its numeric values. | ||
* `[api:CurrencyField]`: Text field, validating its input as a currency. Limited to US-centric formats, including a hardcoded currency symbol and decimal separators. | ||
See `[api:MoneyField]` for a more flexible implementation. | ||
* `[api:DateField]`: Represents a date in a single input field, or separated into day, month, and year. Can optionally use a calendar popup. | ||
* `[api:DatetimeField]`: Combined date- and time field | ||
* `[api:EmailField]`: Text input field with validation for correct email format according to RFC 2822. | ||
* `[api:GroupedDropdownField]`: Grouped dropdown, using <optgroup> tags. | ||
* `[api:HTMLEditorField]. | ||
* `[api:MoneyField]`: A form field that can save into a `[api:Money]` database field. | ||
* `[api:NumericField]`: Text input field with validation for numeric values. | ||
* `[api:OptionsetField]`: Set of radio buttons designed to emulate a dropdown. | ||
* `[api:PhoneNumberField]`: Field for displaying phone numbers. It separates the number, the area code and optionally the country code and extension. | ||
* `[api:UniqueRestrictedTextField]`: Text field that automatically checks that the value entered is unique for the given set of fields in a given set of tables | ||
|
||
* `[api:SelectionGroup]`: SelectionGroup represents a number of fields which are selectable by a radio button that appears at the beginning of each item. | ||
* `[api:TimeField]`: Input field with time-specific, localized validation. | ||
|
||
## Actions | ||
## Structure | ||
|
||
* `[api:Form]` for more info | ||
* `[InlineFormAction](api:InlineFormAction)`: Render a button that will act as If you want to add custom behaviour, please | ||
set {inlcudeDefaultJS} to false and work with behaviour.js. | ||
* `[api:Image]`: Action that uses an image instead of a button | ||
* `[InlineFormAction](api:InlineFormAction)`: Prevents placement of a button in the CMS-button-bar. | ||
* `[api:CompositeField]`: Base class for all fields that contain other fields. Uses `<div>` in template, but | ||
doesn't necessarily have any visible styling. | ||
* `[api:FieldGroup] attached in CMS-context. | ||
* `[api:FieldList]`: Basic container for sequential fields, or nested fields through CompositeField. | ||
* `[api:TabSet]`: Collection of fields which is rendered as separate tabs. Can be nested. | ||
* `[api:Tab]`: A single tab inside a `TabSet` | ||
* `[api:ToggleCompositeField]`: Allows visibility of a group of fields to be toggled. | ||
* `[api:ToggleField]`: ReadonlyField with added toggle-capabilities - will preview the first sentence of the contained text-value, and show the full content by a javascript-switch. | ||
|
||
## Files | ||
|
||
* `[FileField](api:FileField)`: Simple file upload dialog. | ||
* `[UploadField](api:FileIFrameField)`: File uploads through HTML5 features, including upload progress, preview and relationship management. | ||
* `[api:FileField]`: Simple file upload dialog. | ||
* `[api:UploadField]`: File uploads through HTML5 features, including upload progress, preview and relationship management. | ||
|
||
## Relations | ||
|
||
* `[ComplexTableField](api:ComplexTableField)`: Provides a tabuar list in your form with view/edit/add/delete links to modify | ||
records with a "has-one"-relationship (in a lightbox-popup). | ||
* `[HasManyComplexTableField](api:HasManyComplexTableField)` | ||
* `[HasOneComplexTableField](api:HasOneComplexTableField)` | ||
* `[LanguageDropdownField](api:LanguageDropdownField)`: An extension to dropdown field, pre-configured to list languages. | ||
Tied into i18n. | ||
* `[ManyManyComplexTableField](api:ManyManyComplexTableField)` | ||
* `[TableField](api:TableField)` | ||
* `[api:TableListField]` | ||
* `[TreeDropdownField](api:TreeDropdownField)` | ||
* `[TreeMultiselectField](api:TreeMultiselectField)`: represents many-many joins using a tree selector shown in a | ||
dropdown-like element | ||
* `[api:WidgetArea]` | ||
* `[GridField](/topics/grid-field)` | ||
|
||
* `[api:CheckboxSetField]`: Displays a set of checkboxes as a logical group. | ||
* `[api:TableField]`: In-place editing of tabular data. | ||
* `[api:TreeDropdownField]`: Dropdown-like field that allows you to select an item from a hierarchical AJAX-expandable tree. | ||
* `[api:TreeMultiselectField]`: Represents many-many joins using a tree selector shown in a dropdown-like element | ||
* `[api:GridField](/topics/grid-field)`: Displays a `[api:SS_List]` in a tabular format. Versatile base class which can be configured to allow editing, sorting, etc. | ||
* `[api:ListboxField]`: Multi-line listbox field, through `<select multiple>`. | ||
|
||
|
||
## Dataless/Utility | ||
## Utility | ||
|
||
* `[DatalessField](api:DatalessField)` - Base class for fields which add some HTML to the form but don't submit any data or | ||
* `[api:DatalessField]` - Base class for fields which add some HTML to the form but don't submit any data or | ||
save it to the database | ||
* `[HeaderField](api:HeaderField)`: Renders a simple `<h1>`-`<h6>` header | ||
* `[HiddenField](api:HiddenField)` | ||
* `[LabelField](api:LabelField)` | ||
* `[LiteralField](api:LiteralField)`: Renders arbitrary HTML into a form. | ||
|
||
## CMS Field Editor | ||
|
||
Please see `[api:HTMLEditorField]` for in-depth documentation about custom forms created through a GUI in the CMS, | ||
as well as the topic documentation about [Rich Text Editing](/topics/rich-text-editing) | ||
* `[api:HeaderField]`: Renders a simple HTML header element. | ||
* `[api:HiddenField]` | ||
* `[api:LabelField]`: Simple label tag. This can be used to add extra text in your forms. | ||
* `[api:LiteralField]`: Renders arbitrary HTML into a form. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters