Options
All
  • Public
  • Public/Protected
  • All
Menu

Class Html

Html provides a set of static methods for generating commonly used HTML tags.

Nearly all of the methods in this class allow setting additional html attributes for the html tags they generate. You can specify, for example, class, style or id for an html element using the $options parameter. See the documentation of the tag method for more details.

For more details and usage information on Html, see the guide article on html helpers.

author

Mahesh S Warrier https://github.com/codespede

Hierarchy

Index

Constructors

  • new Html(config?: {}): Html

Properties

initialization: Promise<void>

A Promise which resolves when this Component has been successfully initialized.

attributeOrder: string[] = ...

The preferred order of attributes in a tag. This mainly affects the order of the attributes that are rendered by renderTagAttributes.

attributeRegex: RegExp = ...

Regular expression used for attribute name validation.

dataAttributes: string[] = ...

List of tag attributes that should be specially handled when their values are of array type. In particular, if the value of the data attribute is {name: 'xyz', age: 13}, two attributes will be generated instead of one: data-name="xyz" data-age="13".

voidElements: string[] = ...

List of void elements {elementname: 1}

see

http://www.w3.org/TR/html-markup/syntax.html#void-element

Methods

  • init(): Promise<void>
  • Initializes the object. This method is invoked at the end of the constructor after the object is initialized with the given configuration.

    Returns Promise<void>

  • a(text: any, url?: any, options?: any): string
  • Generates a hyperlink tag.

    Parameters

    • text: any

      link body. 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 consider encode it to prevent XSS attacks.

    • url: any = null

      the URL for the hyperlink tag. and will be used for the "href" attribute of the tag. If this parameter is null, the "href" attribute will not be generated.

    • options: any = {}

      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 encode. If a value is null, the corresponding attribute will not be rendered. See renderTagAttributes for details on how attributes are being rendered.

    Returns string

    the generated hyperlink

  • activeBooleanInput(type: any, model: any, attribute: any, options?: any): any
  • Generates a boolean input This method is mainly called by activeCheckbox and activeRadio.

    Parameters

    • type: any

      the input type. This can be either radio or checkbox.

    • model: any

      the model object

    • attribute: any

      the attribute name or expression. See getAttributeName for the format about attribute expression.

    • options: any = {}

      the tag options in terms of name-value pairs. See booleanInput for details about accepted attributes.

    Returns any

    the generated input element

  • activeCheckbox(model: any, attribute: any, options?: any): any
  • Generates a checkbox tag together with a label for the given model attribute. This method will generate the "checked" tag attribute according to the model attribute value.

    Parameters

    • model: any

      the model object

    • attribute: any

      the attribute name or expression. See getAttributeName for the format about attribute expression.

    • options: any = {}

      the tag options in terms of name-value pairs. See booleanInput for details about accepted attributes.

    Returns any

    the generated checkbox tag

  • activeCheckboxList(model: any, attribute: any, items: any, options?: any): any
  • Generates 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.

    Parameters

    • model: any

      the model object

    • attribute: any

      the attribute name or expression. See getAttributeName for the format about attribute expression.

    • items: any

      the data item used to generate the checkboxes. The array keys are the checkbox values, and the array values are the corresponding labels. Note that the labels will NOT be HTML-encoded, while the values will.

    • options: any = {}

      options {name: 'config'} for the checkbox list container tag. The following options are specially handled:

      • tag: string|false, the tag name of the container element. False to render checkbox without container. See also tag.

      • unselect: string, the value that should be submitted when none of the checkboxes is selected. You may set this option to be null to prevent default value submission. If this option is not set, an empty string will be submitted.

      • encode: boolean, whether to HTML-encode the checkbox labels. Defaults to true. This option is ignored if item option is set.

      • separator: string, the HTML code that separates items.

      • itemOptions: array, the options for generating the checkbox tag using checkbox.

      • item: callable, a callback that can be used to customize the generation of the HTML code corresponding to a single item in $items. The signature of this callback must be:

        function (index, label, name, checked, value)
        

        where index is the zero-based index of the checkbox in the whole list; label is the label for the checkbox; and name, value and checked represent the name, value and the checked status of the checkbox input.

      See renderTagAttributes for details on how attributes are being rendered.

    Returns any

    the generated checkbox list

  • activeDropDownList(model: any, attribute: any, items: any, options?: any): any
  • Generates a drop-down list for the given model attribute. The selection of the drop-down list is taken from the value of the model attribute.

    Parameters

    • model: any

      the model object

    • attribute: any

      the attribute name or expression. See getAttributeName for the format about attribute expression.

    • items: any

      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.

    • options: any = {}

      the tag options in terms of name-value pairs. The following options are specially handled:

      • prompt: string, a prompt text to be displayed as the first option. to override the value and to set other tag attributes:

         { text: 'Please select', options: { value: 'none', class: 'prompt', label: 'Select' }}
        
      • options: array, the attributes for the select option tags. The array keys must be valid option values, and the array values are the extra attributes for the corresponding option tags. For example,

        {
        value1: {disabled: true},
        value2: {label: 'value 2'},
        }
      • groups: array, the attributes for the optgroup tags. The structure of this is similar to that of 'options', except that the array keys represent the optgroup labels specified in $items.

      • encodeSpaces: bool, whether to encode spaces in option prompt and option value with &nbsp; character. Defaults to false.

      • encode: bool, whether to encode option prompt and option value characters. Defaults to true.

      The rest of the options will be rendered as the attributes of the resulting tag. The values will be HTML-encoded using encode. If a value is null, the corresponding attribute will not be rendered. See renderTagAttributes for details on how attributes are being rendered.

    Returns any

    the generated drop-down list tag

  • activeFileInput(model: any, attribute: any, options?: any): string
  • Generates a file input tag for the given model attribute. This method will generate the "name" and "value" tag attributes automatically for the model attribute unless they are explicitly specified in options. Additionally, if a separate set of HTML options array is defined inside options with a key named hiddenOptions, it will be passed to the activeHiddenInput field as its own options parameter.

    Parameters

    • model: any

      the model object

    • attribute: any

      the attribute name or expression. See getAttributeName for the format about attribute expression.

    • options: any = {}

      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 encode. See renderTagAttributes for details on how attributes are being rendered. If hiddenOptions parameter which is another set of HTML options array is defined, it will be extracted from options to be used for the hidden input.

    Returns string

    the generated input tag

  • activeHiddenInput(model: any, attribute: any, options?: any): string
  • Generates a hidden input tag for the given model attribute. This method will generate the "name" and "value" tag attributes automatically for the model attribute unless they are explicitly specified in options.

    Parameters

    • model: any

      the model object

    • attribute: any

      the attribute name or expression. See getAttributeName for the format about attribute expression.

    • options: any = {}

      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 encode. See renderTagAttributes for details on how attributes are being rendered.

    Returns string

    the generated input tag

  • activeHint(model: any, attribute: any, options?: any): string
  • Generates a hint tag for the given model attribute. The hint text is the hint associated with the attribute, obtained via Model.getAttributeHint. If no hint content can be obtained, method will return an empty string.

    Parameters

    • model: any

      the model object

    • attribute: any

      the attribute name or expression. See getAttributeName for the format about attribute expression.

    • options: any = {}

      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 encode. If a value is null, the corresponding attribute will not be rendered. The following options are specially handled:

      • hint: this specifies the hint to be displayed. Note that this will NOT be [[encode()|encoded]]. If this is not set, Model.getAttributeHint will be called to get the hint for display (without encoding).

      See renderTagAttributes for details on how attributes are being rendered.

    Returns string

    the generated hint tag

  • activeInput(type: any, model: any, attribute: any, options?: any): string
  • Generates an input tag for the given model attribute. This method will generate the "name" and "value" tag attributes automatically for the model attribute unless they are explicitly specified in options.

    Parameters

    • type: any

      the input type (e.g. 'text', 'password')

    • model: any

      the model object

    • attribute: any

      the attribute name or expression. See getAttributeName for the format about attribute expression.

    • options: any = {}

      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 encode. See renderTagAttributes for details on how attributes are being rendered.

    Returns string

    the generated input tag

  • activeLabel(model: any, attribute: any, options?: any): string
  • Generates a label tag for the given model attribute. The label text is the label associated with the attribute, obtained via Model.getAttributeLabel.

    Parameters

    • model: any

      the model object

    • attribute: any

      the attribute name or expression. See getAttributeName for the format about attribute expression.

    • options: any = {}

      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 encode. If a value is null, the corresponding attribute will not be rendered. The following options are specially handled:

      • label: this specifies the label to be displayed. Note that this will NOT be [[encode()|encoded]]. If this is not set, Model.getAttributeLabel will be called to get the label for display (after encoding).

      See renderTagAttributes for details on how attributes are being rendered.

    Returns string

    the generated label tag

  • activeListBox(model: any, attribute: any, items: any, options?: any): any
  • Generates a list box. The selection of the list box is taken from the value of the model attribute.

    Parameters

    • model: any

      the model object

    • attribute: any

      the attribute name or expression. See getAttributeName for the format about attribute expression.

    • items: any

      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.

    • options: any = {}

      the tag options in terms of name-value pairs. The following options are specially handled:

      • prompt: string, a prompt text to be displayed as the first option. to override the value and to set other tag attributes:

        { text: 'Please select', options: { value: 'none', class: 'prompt', label: 'Select' }}
        
      • options: array, the attributes for the select option tags. The array keys must be valid option values, and the array values are the extra attributes for the corresponding option tags. For example,

        {
        value1: {disabled: true},
        value2: {label: 'value 2'},
        }
      • groups: array, the attributes for the optgroup tags. The structure of this is similar to that of 'options', except that the array keys represent the optgroup labels specified in $items.

      • unselect: string, the value that will be submitted when no option is selected. When this attribute is set, a hidden field will be generated so that if no option is selected in multiple mode, we can still obtain the posted unselect value.

      • encodeSpaces: bool, whether to encode spaces in option prompt and option value with &nbsp; character. Defaults to false.

      • encode: bool, whether to encode option prompt and option value characters. Defaults to true.

      The rest of the options will be rendered as the attributes of the resulting tag. The values will be HTML-encoded using encode. If a value is null, the corresponding attribute will not be rendered. See renderTagAttributes for details on how attributes are being rendered.

    Returns any

    the generated list box tag

  • activeListInput(type: any, model: any, attribute: any, items: any, options?: any): any
  • Generates a list of input fields. This method is mainly called by activeListBox, activeRadioList and activeCheckboxList.

    Parameters

    • type: any

      the input type. This can be 'listBox', 'radioList', or 'checkBoxList'.

    • model: any

      the model object

    • attribute: any

      the attribute name or expression. See getAttributeName for the format about attribute expression.

    • items: any

      the data item used to generate the input fields. The array keys are the input values, and the array values are the corresponding labels. Note that the labels will NOT be HTML-encoded, while the values will.

    • options: any = {}

      options {name: 'config'} for the input list. The supported special options depend on the input type specified by type.

    Returns any

    the generated input list

  • activePasswordInput(model: any, attribute: any, options?: any): string
  • Generates a password input tag for the given model attribute. This method will generate the "name" and "value" tag attributes automatically for the model attribute unless they are explicitly specified in options.

    Parameters

    • model: any

      the model object

    • attribute: any

      the attribute name or expression. See getAttributeName for the format about attribute expression.

    • options: any = {}

      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 encode. See renderTagAttributes for details on how attributes are being rendered. The following special options are recognized:

      • maxlength: integer|boolean, when maxlength is set true and the model attribute is validated by a string validator, the maxlength option will take the max value of [[StringValidator.max]] and [[StringValidator.length]. Improved taking length into account.
      • placeholder: string|boolean, when placeholder equals true, the attribute label from the model will be used as a placeholder.

    Returns string

    the generated input tag

  • activeRadio(model: any, attribute: any, options?: any): any
  • Generates a radio button tag together with a label for the given model attribute. This method will generate the "checked" tag attribute according to the model attribute value.

    Parameters

    • model: any

      the model object

    • attribute: any

      the attribute name or expression. See getAttributeName for the format about attribute expression.

    • options: any = {}

      the tag options in terms of name-value pairs. See booleanInput for details about accepted attributes.

    Returns any

    the generated radio button tag

  • activeRadioList(model: any, attribute: any, items: any, options?: any): any
  • Generates 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.

    Parameters

    • model: any

      the model object

    • attribute: any

      the attribute name or expression. See getAttributeName for the format about attribute expression.

    • items: any

      the data item used to generate the radio buttons. The array keys are the radio values, and the array values are the corresponding labels. Note that the labels will NOT be HTML-encoded, while the values will.

    • options: any = {}

      options {name: 'config'} for the radio button list container tag. The following options are specially handled:

      • tag: string|false, the tag name of the container element. False to render radio button without container. See also tag.

      • unselect: string, the value that should be submitted when none of the radio buttons is selected. You may set this option to be null to prevent default value submission. If this option is not set, an empty string will be submitted.

      • encode: boolean, whether to HTML-encode the checkbox labels. Defaults to true. This option is ignored if item option is set.

      • separator: string, the HTML code that separates items.

      • itemOptions: array, the options for generating the radio button tag using radio.

      • item: callable, a callback that can be used to customize the generation of the HTML code corresponding to a single item in $items. The signature of this callback must be:

        function (index, label, name, checked, value)
        

        where index is the zero-based index of the radio button in the whole list; label is the label for the radio button; and name, value and checked represent the name, value and the checked status of the radio button input.

      See renderTagAttributes for details on how attributes are being rendered.

    Returns any

    the generated radio button list

  • activeTextInput(model: any, attribute: any, options?: {}): string
  • Generates a text input tag for the given model attribute. This method will generate the "name" and "value" tag attributes automatically for the model attribute unless they are explicitly specified in options.

    Parameters

    • model: any

      the model object

    • attribute: any

      the attribute name or expression. See getAttributeName for the format about attribute expression.

    • 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 encode. See renderTagAttributes for details on how attributes are being rendered. The following special options are recognized:

      • maxlength: integer|boolean, when maxlength is set true and the model attribute is validated by a string validator, the maxlength option will take the max value of [[StringValidator.max]] and [[StringValidator.length]. Improved taking length into account.
      • placeholder: string|boolean, when placeholder equals true, the attribute label from the model will be used as a placeholder.

      Returns string

      the generated input tag

    • activeTextarea(model: any, attribute: any, options?: any): string
    • Generates a textarea tag for the given model attribute. The model attribute value will be used as the content in the textarea.

      Parameters

      • model: any

        the model object

      • attribute: any

        the attribute name or expression. See getAttributeName for the format about attribute expression.

      • options: any = {}

        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 encode. See renderTagAttributes for details on how attributes are being rendered. The following special options are recognized:

        • maxlength: integer|boolean, when maxlength is set true and the model attribute is validated by a string validator, the maxlength option will take the max value of [[StringValidator.max]] and [[StringValidator.length]. Improved taking length into account.
        • placeholder: string|boolean, when placeholder equals true, the attribute label from the model will be used as a placeholder.

      Returns string

      the generated textarea tag

    • addCssClass(options: any, cssClass: any): void
    • Adds a CSS class (or several classes) to the specified options.

      If the CSS class is already in the options, it will not be added again. If class specification at given options is an array, and some class placed there with the named (string) key, overriding of such key will have no effect. For example:

      let options = {class: {persistent: 'initial'}};
      Html.addCssClass(options, {persistent: 'override'});
      see

      mergeCssClasses

      see

      [[removeCssClass]]

      Parameters

      • options: any

        the options to be modified.

      • cssClass: any

      Returns void

    • beginForm(action?: string, method?: string, options?: any): string
    • Generates a form start tag.

      see

      endForm

      Parameters

      • action: string = ''

        the form action URL.

      • method: string = 'post'

        the form submission method, such as "post", "get", "put", "delete" (case-insensitive). Since most browsers only support "post" and "get", if other methods are given, they will be simulated using "post", and a hidden input will be added which contains the actual method type. See [[Request.methodParam]] for more details.

      • options: any = {}

        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 encode. If a value is null, the corresponding attribute will not be rendered. See renderTagAttributes for details on how attributes are being rendered.

        Special options:

        • csrf: whether to generate the CSRF hidden input. Defaults to true.

      Returns string

      the generated form start tag.

    • beginTag(name: any, options?: any): string
    • Generates a start tag.

      see

      endTag

      see

      tag

      Parameters

      • name: any

        the tag name. If name is null or false, the corresponding content will be rendered without any tag.

      • options: any = {}

        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 encode. If a value is null, the corresponding attribute will not be rendered. See renderTagAttributes for details on how attributes are being rendered.

      Returns string

      the generated start tag

    • booleanInput(type: any, name: any, checked?: boolean, options?: any): string
    • Generates a boolean input.

      Parameters

      • type: any

        the input type. This can be either radio or checkbox.

      • name: any

        the name attribute.

      • checked: boolean = false

        whether the checkbox should be checked.

      • options: any = {}

        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 checkbox. When this attribute is present, a hidden input will be generated so that if the checkbox is not checked and is submitted, the value of this attribute will still be submitted to the server via the hidden input.
        • 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 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.
        • labelOptions: array, the HTML attributes for the label tag. Do not set this option unless you set the "label" option.

        The rest of the options will be rendered as the attributes of the resulting checkbox tag. The values will be HTML-encoded using encode. If a value is null, the corresponding attribute will not be rendered. See renderTagAttributes for details on how attributes are being rendered.

      Returns string

      the generated checkbox tag

    • checkbox(name: any, checked?: boolean, options?: any): string
    • Generates a checkbox input.

      Parameters

      • name: any

        the name attribute.

      • checked: boolean = false

        whether the checkbox should be checked.

      • options: any = {}

        the tag options in terms of name-value pairs. See booleanInput for details about accepted attributes.

      Returns string

      the generated checkbox tag

    • cssFile(url: any, options: any): string
    • Generates a link tag that refers to an external CSS file.

      Parameters

      • url: any
      • options: any

        the tag options in terms of name-value pairs. The following options are specially handled:

        • condition: specifies the conditional comments for IE, e.g., lt IE 9. When this is specified, the generated link tag will be enclosed within the conditional comments. This is mainly useful for supporting old versions of IE browsers.
        • noscript: if set to true, link tag will be wrapped into <noscript> tags.

        The rest of the options will be rendered as the attributes of the resulting link tag. The values will be HTML-encoded using encode. If a value is null, the corresponding attribute will not be rendered. See renderTagAttributes for details on how attributes are being rendered.

      Returns string

      the generated link tag

    • cssStyleFromObject(style: any): string
    • dropDownList(name: any, selection?: any, items?: any[], options?: {}): string
    • Generates a drop-down list.

      Parameters

      • name: any

        the input name

      • selection: any = null

        the selected value(s). String for single or array for multiple selection(s).

      • items: any[] = []

        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 Array.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.

      • options: {} = {}

        the tag options in terms of name-value pairs. The following options are specially handled:

        • prompt: string, a prompt text to be displayed as the first option. Since version 2.0.11 you can use an array to override the value and to set other tag attributes:

          { text: 'Please select', options: { value: 'none', class: 'prompt', label: 'Select' } },
          
        • options: array, the attributes for the select option tags. The array keys must be valid option values, and the array values are the extra attributes for the corresponding option tags. For example,

          { 
          value1: { disabled: true },
          value2: { label: 'value 2' },
          }
        • groups: array, the attributes for the optgroup tags. The structure of this is similar to that of 'options', except that the array keys represent the optgroup labels specified in $items.

        • encodeSpaces: bool, whether to encode spaces in option prompt and option value with &nbsp; character. Defaults to false.

        • encode: bool, whether to encode option prompt and option value characters. Defaults to true. This option is available since 2.0.3.

        • strict: boolean, if $selection is an array and this value is true a strict comparison will be performed on $items keys. Defaults to false.

        The rest of the options will be rendered as the attributes of the resulting tag. The values will be HTML-encoded using encode. If a value is null, the corresponding attribute will not be rendered. See renderTagAttributes for details on how attributes are being rendered.

        • [key: string]: any

      Returns string

      The generated drop-down list tag

    • encode(content: any): any
    • endForm(): string
    • endTag(name: any): string
    • Generates an end tag.

      see

      beginTag

      see

      tag

      Parameters

      • name: any

        the tag name. If name is null or false, the corresponding content will be rendered without any tag.

      Returns string

      the generated end tag

    • error(model: Model, attribute: any, options?: any): string
    • Generates a tag that contains the first validation error of the specified model attribute. Note that even if there is no validation error, this method will still return an empty error tag.

      Parameters

      • model: Model

        the model object

      • attribute: any

        the attribute name or expression. See getAttributeName for the format about attribute expression.

      • options: any = {}

        the tag options in terms of name-value pairs. The values will be HTML-encoded using encode. If a value is null, the corresponding attribute will not be rendered.

        The following options are specially handled:

        • tag: this specifies the tag name. If not set, "div" will be used. See also tag.
        • encode: boolean, if set to false then the error message won't be encoded.
        • errorSource: \Closure|callable, callback that will be called to obtain an error message. The signature of the callback must be: function (model, attribute) and return a string. When not set, the model.getFirstError method will be called.

        See renderTagAttributes for details on how attributes are being rendered.

      Returns string

      the generated label tag

    • errorSummary(model: any, options: any): void
    • Generates a summary of the validation errors. If there is no validation error, an empty error summary markup will still be generated, but it will be hidden.

      Parameters

      • model: any
      • options: any

        the tag options in terms of name-value pairs. The following options are specially handled:

        • header: string, the header HTML for the error summary. If not set, a default prompt string will be used.
        • footer: string, the footer HTML for the error summary. Defaults to empty string.
        • encode: boolean, if set to false then the error messages won't be encoded. Defaults to true.
        • showAllErrors: boolean, if set to true every error message for each attribute will be shown otherwise only the first error message for each attribute will be shown. Defaults to false.

        The rest of the options will be rendered as the attributes of the container tag.

      Returns void

      the generated error summary

    • escape(html: any): any
    • getAttributeName(attribute: any): any
    • Returns the real attribute name from the given attribute expression.

      An attribute expression is an attribute name prefixed and/or suffixed with array indexes. It is mainly used in tabular data input and/or input of array type. Below are some examples:

      • [0]content is used in tabular data input to represent the "content" attribute for the first model in tabular input;
      • dates[0] represents the first array element of the "dates" attribute;
      • [0]dates[0] represents the first array element of the "dates" attribute for the first model in tabular input.

      If attribute has neither prefix nor suffix, it will be returned back without change.

      throws

      InvalidArgumentException if the attribute name contains non-word characters.

      Parameters

      • attribute: any

        the attribute name or expression

      Returns any

      the attribute name without prefix and suffix.

    • getAttributeValue(model: any, attribute: any): any
    • Returns the value of the specified attribute name or expression.

      For an attribute expression like [0]dates[0], this method will return the value of model.dates[0]. See getAttributeName for more details about attribute expression.

      If an attribute value is an instance of [[ActiveRecordInterface]] or an array of such instances, the primary value(s) of the AR instance(s) will be returned instead.

      throws

      InvalidArgumentException if the attribute name contains non-word characters.

      Parameters

      • model: any

        the model object

      • attribute: any

        the attribute name or expression

      Returns any

      the corresponding attribute value

    • getInputId(model: any, attribute: any): any
    • Generates an appropriate input ID for the specified attribute name or expression.

      throws

      InvalidArgumentException if the attribute name contains non-word characters.

      Parameters

      • model: any

        the model object

      • attribute: any

        the attribute name or expression. See getAttributeName for explanation of attribute expression.

      Returns any

      the generated input ID.

    • getInputName(model: any, attribute: any): any
    • hiddenInput(name: any, value?: any, options?: any): string
    • Generates a hidden input field.

      Parameters

      • name: any

        the name attribute.

      • value: any = null

        the value attribute. If it is null, the value attribute will not be generated.

      • options: any = {}

        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 encode. If a value is null, the corresponding attribute will not be rendered. See renderTagAttributes for details on how attributes are being rendered.

      Returns string

      the generated hidden input tag

    • input(type: any, name?: any, value?: string, options?: any): string
    • Generates an input type of the given type.

      Parameters

      • type: any

        the type attribute.

      • name: any = null

        the name attribute. If it is null, the name attribute will not be generated.

      • value: string = ''

        the value attribute. If it is null, the value attribute will not be generated.

      • options: any = {}

        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 encode. If a value is null, the corresponding attribute will not be rendered. See renderTagAttributes for details on how attributes are being rendered.

      Returns string

      the generated input tag

    • jsFile(url: any, options: any): string
    • Generates a script tag that refers to an external JavaScript file.

      Parameters

      • url: any

        the URL of the external JavaScript file.

      • options: any

        the tag options in terms of name-value pairs. The following option is specially handled:

        • condition: specifies the conditional comments for IE, e.g., lt IE 9. When this is specified, the generated script tag will be enclosed within the conditional comments. This is mainly useful for supporting old versions of IE browsers.

        The rest of the options will be rendered as the attributes of the resulting script tag. The values will be HTML-encoded using encode. If a value is null, the corresponding attribute will not be rendered. See renderTagAttributes for details on how attributes are being rendered.

      Returns string

      the generated script tag

    • label(content: any, forValue?: any, options?: any): string
    • Generates a label tag.

      Parameters

      • content: any

        label text. It will NOT be HTML-encoded. Therefore you can pass in HTML code such as an image tag. If this is is coming from end users, you should encode it to prevent XSS attacks.

      • forValue: any = null
      • options: any = {}

        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 encode. If a value is null, the corresponding attribute will not be rendered. See renderTagAttributes for details on how attributes are being rendered.

      Returns string

      the generated label tag

    • listBox(name: string, selection?: any, items?: any[], options?: {}): string
    • Generates a list box.

      Parameters

      • name: string

        the input name

      • selection: any = null

        the selected value(s). String for single or array for multiple selection(s).

      • items: any[] = []

        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 Array.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.

      • options: {} = {}

        the tag options in terms of name-value pairs. The following options are specially handled:

        • prompt: string, a prompt text to be displayed as the first option. Since version 2.0.11 you can use an array to override the value and to set other tag attributes:

          { text: 'Please select', options: { value: 'none', class: 'prompt', label: 'Select' } },
          
        • options: array, the attributes for the select option tags. The array keys must be valid option values, and the array values are the extra attributes for the corresponding option tags. For example,

          { 
          value1: { disabled: true },
          value2: { label: 'value 2' },
          }
          
          
        • groups: array, the attributes for the optgroup tags. The structure of this is similar to that of 'options', except that the array keys represent the optgroup labels specified in $items.

        • unselect: string, the value that will be submitted when no option is selected. When this attribute is set, a hidden field will be generated so that if no option is selected in multiple mode, we can still obtain the posted unselect value.

        • encodeSpaces: bool, whether to encode spaces in option prompt and option value with &nbsp; character. Defaults to false.

        • encode: bool, whether to encode option prompt and option value characters. Defaults to true.

        • strict: boolean, if $selection is an array and this value is true a strict comparison will be performed on $items keys. Defaults to false.

        The rest of the options will be rendered as the attributes of the resulting tag. The values will be HTML-encoded using encode. If a value is null, the corresponding attribute will not be rendered. See renderTagAttributes for details on how attributes are being rendered.

        @return The generated list box tag

        • [key: string]: any

      Returns string

    • mergeCssClasses(existingClasses: string[], additionalClasses: string[]): string[]
    • Merges already existing CSS classes with new one. This method provides the priority for named existing classes over additional.

      see

      addCssClass

      Parameters

      • existingClasses: string[]

        already existing CSS classes.

      • additionalClasses: string[]

        CSS classes to be added.

      Returns string[]

      merge result.

    • radio(name: any, checked?: boolean, options?: any): string
    • Generates a radio button input.

      Parameters

      • name: any

        the name attribute.

      • checked: boolean = false

        whether the radio button should be checked.

      • options: any = {}

        the tag options in terms of name-value pairs. See booleanInput for details about accepted attributes.

      Returns string

      the generated radio button tag

    • renderSelectOptions(selection: any, items: any, tagOptions?: {}): any
    • Renders the option tags that can be used by dropDownList and listBox.

      Parameters

      • selection: any

        the selected value(s). String for single or array for multiple selection(s).

      • items: any

        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 Array.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.

      • tagOptions: {} = {}

        the $options parameter that is passed to the dropDownList or listBox call. This method will take out these elements, if any: "prompt", "options" and "groups". See more details in dropDownList for the explanation of these elements.

        • [key: string]: any

      Returns any

      String the generated list options

    • renderTagAttributes(attributes: any): string
    • Renders the HTML tag attributes.

      Attributes whose values are of boolean type will be treated as boolean attributes.

      Attributes whose values are null will not be rendered.

      The values of attributes will be HTML-encoded using encode.

      aria and data attributes get special handling when they are set to an array value. In these cases, the array will be "expanded" and a list of ARIA/data attributes will be rendered. For example, {aria: {role: 'checkbox', value: 'true'}} would be rendered as aria-role="checkbox" aria-value="true".

      If a nested data value is set to an array, it will be JSON-encoded. For example, {data: {params: {id: 1, name: 'yii'}}} would be rendered as data-params={id: 1, name: 'yii'}.

      see

      addCssClass

      Parameters

      • attributes: any

        attributes to be rendered. The attribute values will be HTML-encoded using encode.

      Returns string

      the rendering result. If the attributes are not empty, they will be rendered into a string with a leading white space (so that it can be directly appended to the tag name in a tag). If there is no attribute, an empty string will be returned.

    • script(content: any, options?: any): string
    • Generates a script tag.

      Parameters

      • content: any

        the script content

      • options: any = {}

        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 encode. If a value is null, the corresponding attribute will not be rendered. See renderTagAttributes for details on how attributes are being rendered.

      Returns string

      the generated script tag

    • setActivePlaceholder(model: any, attribute: any, options?: any): void
    • Generate placeholder from model attribute label.

      Parameters

      • model: any

        the model object

      • attribute: any

        the attribute name or expression. See getAttributeName for the format about attribute expression.

      • options: any = {}

        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 encode.

      Returns void

    • tag(name: any, content?: string, options?: any): string
    • Generates a complete HTML tag.

      see

      beginTag

      see

      endTag

      Parameters

      • name: any

        the tag name. If name is null or false, the corresponding content will be rendered without any tag.

      • content: string = ''

        the content to be enclosed between the start and end tags. It will not be HTML-encoded. If this is coming from end users, you should consider encode it to prevent XSS attacks.

      • options: any = []

        the HTML tag attributes (HTML 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 encode. If a value is null, the corresponding attribute will not be rendered.

        For example when using {class: 'my-class', target: '_blank', value: null} it will result in the html attributes rendered like this: class="my-class" target="_blank".

        See renderTagAttributes for details on how attributes are being rendered.

      Returns string

      the generated HTML tag

    • textarea(name: any, value?: string, options?: any): string
    • Generates a text area input.

      Parameters

      • name: any

        the input name

      • value: string = ''

        the input value. Note that it will be encoded using encode.

      • options: any = {}

        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 encode. If a value is null, the corresponding attribute will not be rendered. See renderTagAttributes for details on how attributes are being rendered. The following special options are recognized:

        • doubleEncode: whether to double encode HTML entities in value. If false, HTML entities in value will not be further encoded.

      Returns string

      the generated text area tag

    • ul(items: any, options?: any): string
    • Generates an unordered list.

      Parameters

      • items: any
      • options: any = {}

        for the radio button list. The following options are supported:

        • encode: boolean, whether to HTML-encode the items. Defaults to true. This option is ignored if the item option is specified.

        • separator: string, the HTML code that separates items. Defaults to a simple newline ("\n").

        • itemOptions: array, the HTML attributes for the li tags. This option is ignored if the item option is specified.

        • item: callable, a callback that is used to generate each individual list item. The signature of this callback must be:

          function (item, index)
          

          where index is the array key corresponding to item in items. The callback should return the whole list item tag.

        See renderTagAttributes for details on how attributes are being rendered.

      Returns string

      the generated unordered list. An empty list tag will be returned if items is empty.

    Generated using TypeDoc