КОНТРОЛЫ/select_with_subtext.md

Twig код

{# На случай, если выбранного значения нет в списке #}
{% if selected %}
  {% set selected_temp = selected %}
  {% set selected = false %}
  {% set selected_isset = false %}

  {% for v in items %}
    {% set value = v.id %}
    {% if v.id is not defined %}
      {% set value = v.option %}
    {% endif %}

    {% if value == selected_temp %}
      {% set selected = selected_temp %}
      {% set selected_isset = true %}
    {% endif %}
  {% endfor %}
{% endif %}
{# выбранного значения нет #}

{% if not control_class_name %}
  {% set control_class_name = 'control--select control--select-with-subtext' %}
{% endif %}

<div class="{{ control_class_name }} {{class_name}}">
  <ul class="custom-scroll control--select--list">
    {% set selected_value = selected %}
    {% set selected_option = '' %}
    {% set selected_small_text = '' %}

    {% for v in items %}
      {% set option = v.option %}
      {% set is_selected = false %}

      {% set value = v.id %}
      {% if v.id is not defined %}
        {% set value = option %}
      {% endif %}

      {% if (selected_value != false and (value == selected)) or (selected_value == false and loop.first) %}
        {% set selected_value = value %}
        {% set selected_option = option %}
        {% set is_selected = true %}
        {% set selected_small_text = v.small_text %}
      {% endif %}
      <li data-value="{{ value }}" {% if v.disabled %}data-disabled="disabled"{% endif %} class="control--select--list--item {% if is_selected %}control--select--list--item-selected{% endif %} {% if default is defined and v.id == default %}control--select--list--item-default{% endif %} control--select--list--item-small-text {{v.class_name}}" data-small-text="{{v.small_text}}" style="{% if v.bg_color %}background-color:{{v.bg_color}};{% endif %}{% if v.text_color %}color:{{v.text_color}};{% endif %}">
        <span class="control--select--list--item-inner" {% if not no_titles %}title="{{ option|striptags }}"{% endif %}>
          {{ option }}
        </span>
        <span class="control--select--list--item-inner-small">
          {{ v.small_text }}
        </span>
      </li>
    {% endfor %}
  </ul>

  <button class="control--select--button {{button_class_name}} control--select--button-small-text" tabindex="{{tab_index}}" type="button" data-value="{{selected_value}}" {% if disabled %}disabled="Y"{% endif %} {% if selected_before %}data-before="{{selected_before}}"{% endif %} {% if selected_after %}data-after="{{selected_after}}"{% endif %}>
    <span class="control--select--button-inner">
      {{ selected_option }}
    </span>
    <span class="control--select--button-inner-small">
      {{ selected_small_text }}
    </span>
  </button>
  <input type="hidden" class="control--select--input {{ input_special_class }}" {% if id %}id="{{id}}"{% endif %} name="{{name}}" value="{{selected_value}}" data-prev-value="{{selected_value}}">
</div>