首页 > 解决方案 > 我有一个选择列表,我需要在按钮组上重新制作它

问题描述

我需要在不丢失功能的情况下将选择表单重新制作为按钮组。我在网上冲浪,但找不到解决方案。我不能在不丢失功能的情况下做到这一点。

<form action="{% url 'set_language' %}" method="post">
    {% csrf_token %}
    <input type="hidden" name="next" value="{{ redirect_to }}">
<select name="language">
    {% get_available_languages as LANGUAGES %}
    {% get_language_info_list for LANGUAGES as languages %}
    {% for language in languages %}
        <option value="{{ language.code }}" {% if language.code == LANGUAGE_CODE %} selected {% endif %}>
            {{ language.name_local }} ({{ language.code }})
        </option>
    {% endfor %}
</select>
    <input type="submit" value="Go">
</form>

从: 在此处输入图像描述

至: 在此处输入图像描述

标签: pythonhtmlcssdjangobootstrap-4

解决方案


代替选择输入,创建单独的input标签并设置适当name的 and value

<form ... >

    ...

    <div class="btn-group" role="group" aria-label="Choose Language">
        {% for language in languages %}
            <input type="submit" name="language" value="{{ language.code }}"
                   class="btn btn-secondary {% if language.code == LANGUAGE_CODE %}active{% endif %}">

        {% endfor %}
    </div>
</form>

推荐阅读