www.aleph1.co.uk Git - yaffs-website/blob - web/themes/contrib/bootstrap/templates/input/form-element.html.twig

   1 {#
   2 /**
   3  * @file
   4  * Default theme implementation for a form element.
   5  *
   6  * Available variables:
   7  * - attributes: HTML attributes for the containing element.
   8  * - errors: (optional) Any inline error messages to display for this form
   9  *   element; may not be set.
  10  * - has_error: (optional) Flag indicating whether to add the "has_error"
  11  *   Bootstrap class for this form element.
  12  * - required: The required marker, or empty if the associated form element is
  13  *   not required.
  14  * - type: The type of the element.
  15  * - name: The name of the element.
  16  * - label: A rendered label element.
  17  * - label_display: Label display setting. It can have these values:
  18  *   - before: The label is output before the element. This is the default.
  19  *     The label includes the #title and the required marker, if #required.
  20  *   - after: The label is output after the element. For example, this is used
  21  *     for radio and checkbox #type elements. If the #title is empty but the
  22  *     field is #required, the label will contain only the required marker.
  23  *   - invisible: Labels are critical for screen readers to enable them to
  24  *     properly navigate through forms but can be visually distracting. This
  25  *     property hides the label for everyone except screen readers.
  26  *   - attribute: Set the title attribute on the element to create a tooltip but
  27  *     output no label element. This is supported only for checkboxes and radios
  28  *     in \Drupal\Core\Render\Element\CompositeFormElementTrait::preRenderCompositeFormElement().
  29  *     It is used where a visual label is not needed, such as a table of
  30  *     checkboxes where the row and column provide the context. The tooltip will
  31  *     include the title and required marker.
  32  * - description: (optional) A list of description properties containing:
  33  *    - content: A description of the form element, may not be set.
  34  *    - attributes: (optional) A list of HTML attributes to apply to the
  35  *      description content wrapper. Will only be set when description is set.
  36  * - description_display: Description display setting. It can have these values:
  37  *   - before: The description is output before the element.
  38  *   - after: The description is output after the element. This is the default
  39  *     value.
  40  *   - invisible: The description is output after the element, hidden visually
  41  *     but available to screen readers.
  42  * - disabled: True if the element is disabled.
  43  * - title_display: Title display setting.
  44  *
  45  * @ingroup templates
  46  *
  47  * @see template_preprocess_form_element()
  48  */
  49 #}
  50 {%
  51   set classes = [
  52     'form-item',
  53     'js-form-item',
  54     'form-type-' ~ type|clean_class,
  55     'js-form-type-' ~ type|clean_class,
  56     'form-item-' ~ name|clean_class,
  57     'js-form-item-' ~ name|clean_class,
  58     title_display not in ['after', 'before'] ? 'form-no-label',
  59     disabled == 'disabled' ? 'form-disabled',
  60     is_form_group ? 'form-group',
  61     is_radio ? 'radio',
  62     is_checkbox ? 'checkbox',
  63     is_autocomplete ? 'form-autocomplete',
  64     has_error ? 'error has-error'
  65   ]
  66 %}{%
  67   set description_classes = [
  68     'description',
  69     'help-block',
  70     description_display == 'invisible' ? 'visually-hidden',
  71   ]
  72 %}
  73 <div{{ attributes.addClass(classes) }}>
  74   {% if label_display in ['before', 'invisible'] %}
  75     {{ label }}
  76   {% endif %}
  77
  78   {% if description_display == 'before' and description.content %}
  79     <div{{ description.attributes }}>
  80       {{ description.content }}
  81     </div>
  82   {% endif %}
  83
  84   {{ children }}
  85
  86   {% if label_display == 'after' %}
  87     {{ label }}
  88   {% endif %}
  89
  90   {% if errors %}
  91     <div class="form-item--error-message alert alert-danger alert-sm">
  92       {{ errors }}
  93     </div>
  94   {% endif %}
  95
  96   {% if description_display in ['after', 'invisible'] and description.content %}
  97     <div{{ description.attributes.addClass(description_classes) }}>
  98       {{ description.content }}
  99     </div>
 100   {% endif %}
 101 </div>