Как добавить класс `active` для моей текущей группы списков? - PullRequest
1 голос
/ 17 июня 2019

Это образец моей текущей группы списков:

enter image description here

Так как Python Flow Control ссылка на боковой панели активна, я хочу, чтобы онавыделите, добавив класс CSS active.

Я думаю, что могу сделать это, используя текущий URL страницы, находясь на странице Python Flow Control, текущий URL выглядит как http://localhost:8000/python/python-flow-control/, а в шаблоне, если я наберу {{ request.path }}, он вернет /python/python-flow-control/.

Использование URL-адреса Я попробовал этот подход, но он не сработал:

<div class="list-group">
{% for sub_cat in sub_cats %}
    <a href="{% url 'tutorials:tutorials' sub_cat.sub_cat_parent.cat_slug sub_cat.sub_cat_slug %}" class="list-group-item list-group-item-action {% if request.path == '/{{sub_cat.sub_cat_parent.cat_slug}}/{{sub_cat.sub_cat_slug}}/' %} active {% endif %}">
    {{ sub_cat.sub_cat_title }}</a>
{% endfor %}
</div>

Я добавил {% if request.path == '/{{sub_cat.sub_cat_parent.cat_slug}}/{{sub_cat.sub_cat_slug}}/' %} active {% endif %}, чтобы проверить, соответствует ли текущий URL-адрес URL текущей нажатой ссылки, и если онсовпадения добавить css active class.

Однако это не оказало никакого влияния.Это не выдало никакой ошибки и не сработало.

edit: я пробовал это, оно тоже не работало

{% url '{{request.path}}' category='python' sub_cat='python-introduction' as target %}

{% if target %}
    <div class="bg-secondary">active</div>
{% endif %}

1 Ответ

1 голос
/ 17 июня 2019

Я добавил {% if request.path == '/ enjумыsesub_cat.sub_cat_parent.cat_slug automotive‹/ndom enjsub_cat.sub_cat_slug уг URL текущей нажатой ссылки и, если она соответствует, добавить активный класс CSS. Однако это не имело никакого эффекта. Это не выдало никакой ошибки и не сработало.

Конечно, нет, см. Мой ответ на ваш (почти дублирующий) другой вопрос.

edit: Я попробовал это, оно тоже не сработало

{% url '{{request.path}}' category = 'python' sub_cat = 'python-введение' в качестве цели%}

{% if target%}

Конечно нет. Во-первых, потому что первый аргумент {% url %} - это имя URL, а не request.path - что вы должны знать, поскольку оно уже есть в вашем исходном фрагменте:

<a href="{% url 'tutorials:tutorials' sub_cat.sub_cat_parent.cat_slug sub_cat.sub_cat_slug %}" class="list-group-item list-group-item-action">

, а затем, потому что {% if target %} только проверяет логическое значение target.

Простой очевидный ответ:

<div class="list-group">
{% for sub_cat in sub_cats %}
    {% url 'tutorials:tutorials' sub_cat.sub_cat_parent.cat_slug sub_cat.sub_cat_slug as sub_cat_url %}
    <a href="{{ sub_cat_url }}" class="list-group-item list-group-item-action {% if request.path==sub_cat_url %} active {% endif %}">
    {{ sub_cat.sub_cat_title }}</a>
{% endfor %}
</div>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...