Campo Html

Contenido HTML enriquecido dentro de un formulario

Propiedades

Las propiedades disponibles para un campo html, agrupadas por finalidad:

Atributo Comentarios
basic
name
string / obligatorio / único

Field name
Alfanumeric + underscore + dash

This attribute represents the name of the form field.
type
string / obligatorio

Field type

Other attributes might only be available for some field types.

Valor:
html
label
string

Field label
Free text

A friendly name/label for the field. Note: if not set, the field name is used as label, but not when type is html.

Since 6.0.3: Supports placeholders for dynamic labels (e.g., Label: $(fieldname)).
data
expression
string

A javascript expression.
Valid javascript

By default this javascript is evaluated on the server side and limited to predefined functions (for security). However in combination with runLocal, the evaluation is ran in the browsers sandbox and allows the full javascript power. An html field always evaluates its expression in the browser, as with runLocal: true: it never runs on the server. When used in an enum field, the expression must return a flat array or array of flat objects, to make it presentable in a dropdown box.
An expression supports placeholders: $(fieldname) is replaced by the value of that field before the expression runs.
On the server, the predefined functions are called as fn.<name>(...), for example fn.fnTime().

tip: use the alias local (type=’expression’,runLocal=true,hide=true,output=false)
tip: use the alias local_out (type=’expression’,runLocal=true,hide=true)
tip: use the alias credential (type=’expression’,runLocal=true,hide=true,asCredential=true)
interaction
dependencyFn
string
añadido en la versión 4.0.0

The dependency logical function

This attribute represents the logical function between multiple dependencies.

Opciones:
  • and (por defecto)
  • or
  • nand
  • nor
dependencies
list / elements=object

Show/hide this field based on the values or other fields
Reference to other formfields and their values

Each dependency element is either an object with the following 2 attributes:

  • name: holds the fieldname.
  • values: a list of valid values for the referenced field.

Or with the following 2 attributes:

  • name: holds the fieldname.
  • isValid: a boolean to check if the referenced is validated or not.

Use in combination with attribute dependencyFn.
output
output
boolean
añadido en la versión 6.2.0

Include field value as extravar

Form fields are by default sent as extravars.
Set to false to exclude a field from the extravar output.

Por defecto:
true
security
noLog
boolean
añadido en la versión 2.2.3

Disable backend logging

Disables logging in the backend, to hide passwords for example.

Por defecto:
false
validation
ignoreIncomplete
boolean

Allow form submit on non-evaluated placeholders

When an expression-based field has placeholders,
the default form behaviour is not to allow form submit until all placeholders are resolved. When this attribute is true, the form does not wait for placeholder completion for this field.

Por defecto:
false
visualization
group
string

The field group name
Free text

With this attribute you can group fields together.
When all fields in a group are hidden (due to dependencies), the group is also hidden.
line
string
añadido en la versión 4.0.3

The field line name
Free text

With this attribute you can group fields in a single line together.
Use together with the width parameter to set the width, if not, the width is auto.
width
string
añadido en la versión 4.0.3

The field width
A valid Bootstrap Column width

With this attribute you can set the width of a field.
Use together wit the line parameter to put fields on 1 line. see https://getbootstrap.com/

Opciones:
  • col-1
  • col-2
  • col-3
  • col-4
  • col-5
  • col-6
  • col-7
  • col-8
  • col-9
  • col-10
  • col-11
  • col-12

Ejemplos

Ejemplos de campos html, en YAML:

Alert

La definición del campo, en YAML:

- type: html
  name: alert
  expression: |
    '<div class="alert alert-danger" role="alert"> 
      danger mister robinson !
    </div>'
- type: html   
  name: image
  expression: |
    '<img src="https://dummyimage.com/16:9x1080" />' 
- name: header
  type: html
  expression: | 
    '<h3 class="title is-3">Your own title</h3>'

La definición del campo, en YAML:

- type: html
  name: documentation
  expression: |
    '<a href="https://ansibleforms.com/" target="_blank">Read the documentation</a>'