{# EXAMPLE USE: include "basic_elements/dropdown_select.html" with label="Numer of atoms:" min=1 max=200 form_field=form.num_atoms__range only #}
{# options should be a list of tuples: (value, display) #}
<div {% if options_hash %}id="{{ options_hash }}"{% endif %}>
    <div unicorn:ignore class="my-2">
        {% if label %}<label class="form-label">{{ label }}</label>{% endif %}
        <select id="{{ name }}{{ key }}"
                class="select2 form-control {% if allow_custom_input %}select2-dynamic{% endif %}"
                data-toggle="select2"
                data-placeholder="Choose one ..."
                onchange="Unicorn.call('{{ unicorn_view }}', 'set_{{ name }}', $('#{{ name }}{{ key }}').val());">
            {% if initial_value %}
                <option value="{{ initial_value }}">
                    {% if initial_display %}
                        {{ initial_display }}
                    {% else %}
                        {% for option in options %}
                            {% if initial_value == option.0 %}{{ option.1 }}{% endif %}
                        {% endfor %}
                    {% endif %}
                </option>
            {% else %}
                <option value="NONE">Choose one...</option>
            {% endif %}
            {% for option in options %}
                {% if option.0 != initial_value and option.0 != first_value %}
                    <option value="{{ option.0 }}">{{ option.1 }}</option>
                {% endif %}
            {% endfor %}
        </select>
    </div>
</div>
