Field

Field

Members

config :object

Source:
Properties:
Name Type Description
disabled boolean

Whether this field is disabled.

emptyOptionText string

Text in <option> element where value is empty.

errorsTemplate string

Mustache.js template for rendering array of error messages for each field. Overrides errorsTemplate set by form if specified.

fieldAttributes object

Key-value pairs for attributes in <div> element containing the field. Use empty string if the attribute has no value, null to unset the attribute.

fieldClasses Array.<string>

List of CSS classes for <div> element containing the field.

fieldTemplate string

Mustache.js template for rendering HTML for field element. The errorsHtml template variable is rendered using errorsTemplate.

inputAttributes object

Key-value pairs for attributes in input element. Use empty string if the attribute has no value, null to unset the attribute.

inputClasses Array.<string>

List of CSS classes for input element.

inputTemplate string

Mustache.js template for rendering HTML for input element. For dropdowns/checkboxes/radio buttons, the following template variables are available: hasSelectedOption (indicates if an option is selected), emptyOptionText (the text for the option with empty value), selectedOptionText (the text for the selected option if any) and options (an array of objects, each having the keys optionValue, optionText and optionSelected).

inputType string

Type of input, e.g. text, select, textarea, radio, checkbox.

label string

Label for field.

labelAttributes object

Key-value pairs for attributes in

labelClasses Array.<string>

List of CSS classes for <label> element.

name string

Field name. Overrides name set by form if specified.

note string

Optional note displayed with input element.

noteClasses Array.<string>

List of CSS classes for <div> element for note.

options object

Key-value pairs used for <option> elements in <select> element used as such: <option value="${key}">${value}</option>.

readonly boolean

Whether this field is readonly.

required boolean

Whether this field is required. In-built validation if this is true and field is not disabled/readonly.

requiredText string

Text to return for error message if value is empty for required field. Overrides required text set by form if specified.

value string | number | array

Default value for input. Use an array if input has multiple values, e.g. multi-select checkbox group. Note that field values in web form submissions are always of string type, hence no catering for null/undefined/boolean types.

validateFunction function

Function for validating submitted input value. Does not override in-built validation. Takes in (name of field in form, submitted value, values for all fields in form) and returns an array of error messages.

Configuration defaults for field

Type:
  • object

errors :Array.<string>

Source:

List of error messages set when validate() is called

Type:
  • Array.<string>

value :string|number|array

Source:

Current value for field

Note that field values in web form submissions are always of string type, hence no catering for null/undefined/boolean types. An array is used when there are multiple values, such as for multi-select checkbox groups.

Type:
  • string | number | array

Methods

(static) new Field(config) → {Field}

Source:

Constructor.

Parameters:
Name Type Description
config object

Field config. See Field.prototype.config.

Returns:
Type
Field

render(templateVariablesopt) → {string}

Source:

Renders HTML for field

Parameters:
Name Type Attributes Default Description
templateVariables null | object <optional>
null

Optional key-value pairs that can be used to add on to or override template variables for the final rendering (not for intermediate renders such as input and errors).

Returns:
Type
string

validate(fieldName, fieldValue, formData, requiredText) → {Array.<string>}

Source:

Validate field

Parameters:
Name Type Description
fieldName mixed

Name of field as in formData. Note that a field may have different names when used in different forms.

fieldValue mixed

Submitted value for field.

formData object

Submitted values for form as key-value pairs where the key is the field name and the value is the submitted value. This is passed in as the field may depend on the values of other fields in the form.

requiredText string

Optional required text that is used as fallback if it is not set in field config.

Returns:

Empty array returned if field is valid, else array of error messages is returned. There may be more than 1 error message hence an array.

Type
Array.<string>