Как можно предотвратить исчезновение раскрывающихся списков в заголовке CSS в форме Django? - PullRequest
Новая
       25

Как можно предотвратить исчезновение раскрывающихся списков в заголовке CSS в форме Django?

0 голосов
/ 07 марта 2019

Здравствуйте, я использую модели форм.Одной из моих записей является ChoiceField, когда у меня есть CSS-заголовок в файле name.html (html-файл для страницы формы), на странице не отображаются раскрывающиеся списки.Когда я удаляю этот заголовок в name.html, раскрывающиеся списки отображаются.Кто-нибудь может объяснить, что происходит?

name.html 

{% extends 'fitness/header.html' %}

{% block content %}
    <form method="post">
        {% csrf_token %}
        {{form.as_p}}
        <input type="submit" value="Submit">
    </form>

{% endblock %}

header.html 

<head>
    {% load static %}
    <!-- Prism CSS -->
    <link href="{% static "tinymce/css/prism.css" %}" rel="stylesheet">
    <!-- Compiled and minified CSS -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css">
    <!-- Compiled and minified JavaScript -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>

</head>


<body>

  <nav>
    <div class="nav-wrapper">
      <a href="#" class="brand-logo">Gainz.com</a>    <!––    Need to adjust this logo           ––>
      <ul id="nav-mobile" class="right 

      hide-on-med-and-down">


        {% if user.is_authenticated %}

          <li><a href="/profile">profile</a></li>
          <li><a href="/logout">logout</a></li>
          <li><a href="/dashboard">dashboard</a></li>
          <li><a href="/feed">feed</a></li>
          <li><a href="/forum">forum</a></li>
          <li><a href="/manual">manual entry</a></li>


        {% else %}

          <li><a href="/">Home</a></li>
          <li><a href="/feed">feed</a></li>
          <li><a href="/login">login</a></li>
          <li><a href="/register">register</a></li>

        {% endif %}

      </ul>
    </div>
  </nav>


  {% block content %}

  {% endblock %}


</body>




<!-- Prism JS -->
<script src="{% static "tinymce/js/prism.js" %}"></script>

1 Ответ

0 голосов
/ 07 марта 2019

Обязательно добавьте это в начало страницы: 

<!DOCTYPE HTML> //always include this at the top of the page of your base file
<html>

Скрипты всегда идут внизу страницы до закрывающего тега </body>: 

<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>
<script src="{% static "tinymce/js/prism.js" %}"></script>
</body>
</html>

Обычно это делается с помощью шаблона footer.html с использованием {% include 'footer.html' %}

Я добавил сценарий <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script> jquery, потому что он выглядит так, как будто это требуется для сценария материализации облака (хотя я не уверен). В любом случае, вы должны использовать jQuery для всех ваших HTML-файлов! ;-)

Кроме того, я не уверен, решит ли это вашу проблему или нет, но, как правило, рекомендуется, чтобы у всех ваших элементов были закрывающие теги (если они их требуют). В вашем name.html (или в другом месте) может быть случайный тег <div>, который вызывает непредвиденные ошибки.

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

Похожие темы

...