Как изменить стиль кнопок, созданный jinja l oop. С bootstrap

Question

У меня вопрос, на который я не могу найти ответа. У меня есть код, который через l oop генерирует мне список кнопок. Нажатая кнопка должна изменить свой стиль (цвет фона solid). Код Html состоит из bootstrap. Что можно сделать, чтобы изменить стиль нажатой кнопки, когда в структуре кода у меня всего одна ссылка? Ниже приведен фрагмент кода:

{% for list in lists %} 

<a href="{{ url_for('homepage', list_type=list) }}"  
class="btn btn-fill-skew btn-outline-primary">{{list|replace("_", " ")}}</a>

{% endfor %}

Answer 1

Вы должны передать значение выбранного списка из функции просмотра, назовем его active_list. Затем вы можете проверить в течение l oop, является ли текущий элемент выбранным:

{% for list in lists %} 

<a href="{{ url_for('homepage', list_type=list) }}"  
   class="btn btn-fill-skew {% if list == selected_list %}btn-primary{% else %}btn-outline-primary{% endif %}">
       {{list|replace("_", " ")}}</a>

{% endfor %}

Здесь мы добавляем класс btn-primary для выбранного списка вместо btn-outline-primary, поэтому он станет заполнен основным цветом.