Активный тег для расширенных шаблонов - PullRequest
0 голосов
/ 27 октября 2019

Я новичок в Django и хочу помочь с наследованием шаблонов. Я хочу установить "class =" active "для текущей активной страницы, но как мне это сделать с наследованием шаблонов, так как оно обобщает его для всех страниц, но активное должно измениться при изменении текущей активной страницы. Я знаю, что этот вопрос может быть глупымно я до сих пор не знаю ответа.

Я понятия не имею, что делать в этом случае.

Расширенный HTML

  <ul class="navbar-nav mr-auto">
  <li class="nav-item mx-3">
    <a class="nav-link" {% if '/Homepage/' in request.path %} class ="active" {% endif %} href="{% url 'success' %}">Home <span class="sr-only">(current)</span></a>
  </li>
  <li class="nav-item mx-3">
    <a class="nav-link" {% if '/booking/' in request.path %} class ="active" {% endif %} href="{% url 'booking' %}">Make a Booking</a>
  </li>
  <li class="nav-item mx-3">
    <a class="nav-link" {% if '/Hsitory/' in request.path %} class ="active" {% endif %} href="{% url 'History' %}">History</a>
  </li>
  <li class="nav-item mx-3">
    <a class="nav-link" {% if '/pending/' in request.get_full_path %} class ="active" {% endif %} href="{% url 'pending' %}">Pending requests</a>
  </li>
</ul>

urls.py

urlpatterns = [
path('', views.loginpage, name="loginpage"),
path("failed/", views.failed, name="failed"),
path("Homepage/", views.success, name="success"),
path("loggedout/", views.loggedout, name="logout"),
path("booking/", views.booking, name="booking"),
path("pending/", views.pending, name="pending"),
path("History/", views.History, name="History"),
path("Register/", views.Register, name="Register"),
]

Я ожидаю, что активный класс может быть применен только к текущим активным страницам.

Ответы [ 2 ]

1 голос
/ 27 октября 2019

Вы можете попробовать вот так.

<a class="nav-link" {% if '/Homepage/' in request.path %} class ="active" {% endif %} href="/Homepage/">Home <span class="sr-only">(current)</span></a>

Также лучше использовать шаблон URL django тег

РЕДАКТИРОВАТЬ: Я думаю, что вы предоставляете неправильные шаблоны URL Вы можететакже сделайте это

{% url 'homepage' as url %}
<a {% if request.path == url %} class="active"{% endif %} href="{{ url }}" >Homepage</a>

У вас есть два атрибута класса в вашем теге привязки, поэтому вы можете изменить его на

 <a class="nav-link{% if request.path == url %} active{% endif %}">Home <span class="sr-only">(current)</span></a>
0 голосов
/ 27 октября 2019

Extended Html

<li class="nav-item mx-3">
      {% url 'success' as Homepage %}
      {% if request.path != Homepage %} <a class="nav-link" href="{% url 'success' %}">Home <span
          class="sr-only">(current)</span></a>
      {% else %}
      <a class="nav-link active" href="{{ Homepage }}">Home <span class="sr-only">(current)</span></a>
      {% endif %}
    </li>
    <li class="nav-item mx-3">
      {% url 'booking' as booking %}
      {% if request.path != booking %} <a class="nav-link" href="{{ booking }}">Make a Booking</a>
      {% else %}
      <a class="nav-link active" href="{{ booking }}">Make a Booking</a>
      {% endif %}
    </li>
    <li class="nav-item mx-3">
      {% url 'History' as History %}
      {% if request.path != History %} <a class="nav-link" href="{{ History }}">History</a>
      {% else %}
      <a class="nav-link active" href="{{ History }}">History</a>
      {% endif %}

    </li>
    <li class="nav-item mx-3">
      {% url 'pending' as pending %}
      {% if request.path != pending %} <a class="nav-link" href="{{ pending }}">Pending requests</a>
    </li>
    {% else %}
    <a class="nav-link active " href="{{ pending }}">Pending requests</a>
    {% endif %}

    </li>

Используется request.path для решения

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...