This property holds a custom input id if it was set using inputOptions or in one of the
options
parameters of the input*
methods.
If "for" field label attribute should be skipped.
Adds aria HTML attributes aria-required
and aria-invalid
for inputs
The model attribute that this field is associated with.
The params with which /assets/js/activeForm.js should perform the client validation.
Whether to enable AJAX-based data validation. If not set, it will take the value of ActiveForm.enableAjaxValidation.
Whether to enable client-side data validation. If not set, it will take the value of ActiveForm.enableClientValidation.
The form that this field is associated with.
The default options for the hint tags. The parameter passed to hint will be merged with this property when rendering the hint tag. The following special options are recognized:
tag
: the tag name of the container element. Defaults to div
. Setting it to false
will not render a container tag.
See also Html.tag.A Promise which resolves when this Component has been successfully initialized.
The default options for the input tags. The parameter passed to individual input methods (e.g. textInput) will be merged with this property when rendering the input tag.
If you set a custom id
for the input element, you may need to adjust the selectors accordingly.
The default options for the label tags. The parameter passed to label will be merged with this property when rendering the label tag.
The data model that this field is associated with.
The HTML attributes (name-value pairs) for the field container tag.
The values will be HTML-encoded using Html.encode.
If a value is null
, the corresponding attribute will not be rendered.
The following special options are recognized:
Different parts of the field (e.g. input, label). This will be used together with
template to generate the final field HTML code. The keys are the token names in template,
while the values are the corresponding HTML code. Valid tokens include {input}
, {label}
and {error}
.
Note that you normally don't need to access this property directly as
it is maintained by various methods of this class.
The jQuery selectors for selecting the container, input and error tags.
The array keys should be container
, input
, and/or error
, and the array values
are the corresponding selectors. For example, { input: '#my-input'}
.
The container selector is used under the context of the form, while the input and the error selectors are used under the context of the container.
You normally do not need to set this property as the default selectors should work well for most cases.
The template that is used to arrange the label, the input field, the error message and the hint text.
The following tokens will be replaced when [[render()]] is called: {label}
, {input}
, {error}
and {hint}
.
Whether to perform validation when the input field loses focus. If not set, it will take the value of ActiveForm.validateOnBlur.
Whether to perform validation when the value of the input field is changed. If not set, it will take the value of ActiveForm.validateOnChange.
Whether to perform validation while the user is typing in the input field. If not set, it will take the value of ActiveForm.validateOnType.
Number of milliseconds that the validation should be delayed when the user types in the field
and validateOnType is set true
.
If not set, it will take the value of ActiveForm.validationDelay.
Returns the string representation of this object.
string the string representation of this object.
Adds validation class to the input options if needed.
input options
Add role attributes to the input options
input options
Adjusts the for
attribute for the label based on the input options.
the input options.
Renders the opening tag of the field container.
the rendering result.
Renders a checkbox.
This method will generate the checked
tag attribute according to the model attribute value.
the tag options in terms of name-value pairs. The following options are specially handled:
uncheck
: string, the value associated with the uncheck state of the radio button. If not set,
it will take the default value 0
. This method will render a hidden input so that if the radio button
is not checked and is submitted, the value of this attribute will still be submitted to the server
via the hidden input. If you do not want any hidden input, you should explicitly set this option as null
.label
: string, a label displayed next to the checkbox. It will NOT be HTML-encoded. Therefore you can pass
in HTML code such as an image tag. If this is coming from end users, you should encode it to prevent XSS attacks.
When this option is specified, the checkbox will be enclosed by a label tag. If you do not want any label, you should
explicitly set this option as null
.labelOptions
: array, the HTML attributes for the label tag. This is only used when the label
option is specified.The rest of the options will be rendered as the attributes of the resulting tag. The values will
be HTML-encoded using Html.encode. If a value is null
, the corresponding attribute will not be rendered.
If you set a custom id
for the input element, you may need to adjust the selectors accordingly.
whether to enclose the checkbox within the label.
If true
, the method will still use template to layout the checkbox and the error message
except that the checkbox is enclosed by the label tag.
the field object itself.
Renders a list of checkboxes. A checkbox list allows multiple selection, like listBox. As a result, the corresponding submitted value is an array. The selection of the checkbox list is taken from the value of the model attribute.
the data item used to generate the checkboxes. The array values are the labels, while the array keys are the corresponding checkbox values.
options (name => config) for the checkbox list.
For the list of available options please refer to the $options
parameter of Html.activeCheckboxList.
the field object itself.
Returns the JavaScript needed for performing client-side validation.
Calls getClientOptions to generate options array for client-side validation.
You may override this method to return the JavaScript validation code if the validator can support client-side validation.
The following JavaScript variables are predefined and can be used in the validation code:
attribute
: an object describing the the attribute being validated.value
: the value being validated.messages
: an array used to hold the validation error messages for the attribute.deferred
: an array used to hold deferred objects for asynchronous validation$form
: a jQuery object containing the form elementThe attribute
object contains the following properties:
id
: a unique ID identifying the attribute (e.g. "loginform-username") in the formname
: attribute name or expression (e.g. "[0]content" for tabular input)container
: the jQuery selector of the container of the input fieldinput
: the jQuery selector of the input field under the context of the formerror
: the jQuery selector of the error tag under the context of the containerstatus
: status of the input field, 0: empty, not entered before, 1: validated, 2: pending validation, 3: validatingthe key of the client validator defined in clientValidators
the validation criteria as defined in clientValidators
the client-side validation script. Null if the validator does not support client-side validation.
Adds aria attributes to the input options.
input options
Renders a drop-down list. The selection of the drop-down list is taken from the value of the model attribute.
the option data items. The array keys are option values, and the array values are the corresponding option labels. The array can also be nested (i.e. some array values are arrays too). For each sub-array, an option group will be generated whose label is the key associated with the sub-array. If you have a list of data models, you may convert them into the format described above using [[ArrayHelper.map]].
Note, the values and labels will be automatically HTML-encoded by this method, and the blank spaces in the labels will also be HTML-encoded.
the tag options in terms of name-value pairs.
For the list of available options please refer to the $options
parameter of Html.activeDropDownList.
If you set a custom id
for the input element, you may need to adjust the selectors accordingly.
the field object itself.
Renders the closing tag of the field container.
the rendering result.
Generates a tag that contains the first validation error of attribute. Note that even if there is no validation error, this method will still return an empty error tag.
the tag options in terms of name-value pairs. It will be merged with errorOptions.
The options will be rendered as the attributes of the resulting tag. The values will be HTML-encoded
using Html.encode. If this parameter is false
, no error tag will be rendered.
The following options are specially handled:
tag
: this specifies the tag name. If not set, div
will be used.
See also Html.tag.If you set a custom id
for the error element, you may need to adjust the selectors accordingly.
the field object itself.
Renders a file input.
This method will generate the name
and value
tag attributes automatically for the model attribute
unless they are explicitly specified in options
.
the tag options in terms of name-value pairs. These will be rendered as the attributes of the resulting tag. The values will be HTML-encoded using Html.encode.
If you set a custom id
for the input element, you may need to adjust the selectors accordingly.
the field object itself.
Returns the JS options for the field.
the JS options.
Returns the HTML id
of the input element of this form field.
the input id.
Renders a hidden input.
Note that this method is provided for completeness. In most cases because you do not need to validate a hidden input, you should not need to use this method. Instead, you should use Html.activeHiddenInput.
This method will generate the name
and value
tag attributes automatically for the model attribute
unless they are explicitly specified in options
.
the field object itself.
Renders the hint tag.
the hint content.
If null
, the hint will be generated via Model.getAttributeHint.
If false
, the generated field will not contain the hint part.
Note that this will NOT be encoded.
the tag options in terms of name-value pairs. These will be rendered as the attributes of the hint tag. The values will be HTML-encoded using Html.encode.
The following options are specially handled:
tag
: this specifies the tag name. If not set, div
will be used.
See also Html.tag.the field object itself.
Initializes the object. This method is invoked at the end of the constructor after the object is initialized with the given configuration.
Renders an input tag.
the input type (e.g. text
, password
)
the tag options in terms of name-value pairs. These will be rendered as the attributes of the resulting tag. The values will be HTML-encoded using Html.encode.
If you set a custom id
for the input element, you may need to adjust the selectors accordingly.
the field object itself.
Checks if ajax validation enabled for the field.
bool
Checks if client validation enabled for the field.
bool
Generates a label tag for attribute.
the label to use. If null
, the label will be generated via Model.getAttributeLabel.
If false
, the generated field will not contain the label part.
Note that this will NOT be encoded.
the tag options in terms of name-value pairs. It will be merged with labelOptions.
The options will be rendered as the attributes of the resulting tag. The values will be HTML-encoded
using Html.encode. If a value is null
, the corresponding attribute will not be rendered.
the field object itself.
Renders a list box. The selection of the list box is taken from the value of the model attribute.
the option data items. The array keys are option values, and the array values are the corresponding option labels. The array can also be nested (i.e. some array values are arrays too). For each sub-array, an option group will be generated whose label is the key associated with the sub-array. If you have a list of data models, you may convert them into the format described above using [[ArrayHelper.map]].
Note, the values and labels will be automatically HTML-encoded by this method, and the blank spaces in the labels will also be HTML-encoded.
the tag options in terms of name-value pairs.
For the list of available options please refer to the $options
parameter of Html.activeListBox.
If you set a custom id
for the input element, you may need to adjust the selectors accordingly.
the field object itself.
Renders a password input.
This method will generate the name
and value
tag attributes automatically for the model attribute
unless they are explicitly specified in options
.
the tag options in terms of name-value pairs. These will be rendered as the attributes of the resulting tag. The values will be HTML-encoded using Html.encode.
If you set a custom id
for the input element, you may need to adjust the selectors accordingly.
the field object itself.
Renders a radio button.
This method will generate the checked
tag attribute according to the model attribute value.
the tag options in terms of name-value pairs. The following options are specially handled:
uncheck
: string, the value associated with the uncheck state of the radio button. If not set,
it will take the default value 0
. This method will render a hidden input so that if the radio button
is not checked and is submitted, the value of this attribute will still be submitted to the server
via the hidden input. If you do not want any hidden input, you should explicitly set this option as null
.label
: string, a label displayed next to the radio button. It will NOT be HTML-encoded. Therefore you can pass
in HTML code such as an image tag. If this is coming from end users, you should encode it to prevent XSS attacks.
When this option is specified, the radio button will be enclosed by a label tag. If you do not want any label, you should
explicitly set this option as null
.labelOptions
: array, the HTML attributes for the label tag. This is only used when the label
option is specified.The rest of the options will be rendered as the attributes of the resulting tag. The values will
be HTML-encoded using Html.encode. If a value is null
, the corresponding attribute will not be rendered.
If you set a custom id
for the input element, you may need to adjust the selectors accordingly.
whether to enclose the radio within the label.
If true
, the method will still use template to layout the radio button and the error message
except that the radio is enclosed by the label tag.
the field object itself.
Renders a list of radio buttons. A radio button list is like a checkbox list, except that it only allows single selection. The selection of the radio buttons is taken from the value of the model attribute.
the data item used to generate the radio buttons. The array values are the labels, while the array keys are the corresponding radio values.
options (name => config) for the radio button list.
For the list of available options please refer to the options
parameter of Html.activeRadioList.
the field object itself.
Renders the whole field. This method will generate the label, error tag, input tag and hint tag (if any), and assemble them into HTML according to template.
the content within the field container.
If null
(not set), the default methods will be called to generate the label, error tag and input tag,
and use them as the content.
If a callback, it will be called to generate the content. The signature of the callback should be:
function (field) {
return html;
}
the rendering result.
Renders a text input.
This method will generate the name
and value
tag attributes automatically for the model attribute
unless they are explicitly specified in options
.
the tag options in terms of name-value pairs. These will be rendered as the attributes of the resulting tag. The values will be HTML-encoded using Html.encode.
The following special options are recognized:
maxlength
: int|bool, when maxlength
is set true
and the model attribute is validated
by a string validator, the maxlength
option will take the value of [[StringValidator.max]].Note that if you set a custom id
for the input element, you may need to adjust the value of selectors accordingly.
the field object itself.
Renders a text area. The model attribute value will be used as the content in the textarea.
the tag options in terms of name-value pairs. These will be rendered as the attributes of the resulting tag. The values will be HTML-encoded using Html.encode.
If you set a custom id
for the textarea element, you may need to adjust the selectors accordingly.
the field object itself.
Generated using TypeDoc
ActiveField represents a form input field within an ActiveForm.
For more details and usage information on ActiveField, see the guide article on forms.
Mahesh S Warrier https://github.com/codespede