Страница навигации Django - домашний список не виден

Question

Я супер новый для Dango;извините за вопрос новичка:)

Я изучаю Django, создав «Приложение для заметок». Так выглядит домашняя страница приложения.

Когда я нажимаю на любую заметку из списка заметок, она открывает подробности на правой стороне страницы. Но проблема в том, что он стирает список заметок слева. Чтобы перезагрузить список, мне нужно снова нажать на ссылку Домой. Ожидаемое поведение заключается в том, что он должен сохранять список заметок с левой стороны, а также показывать подробности в правом фрейме.

urls. py

from django.urls import path
from .views import NoteListView, NoteDetailView, NoteCreateView, NoteUpdateView, NoteDeleteView
from . import views

urlpatterns = [
    path('', NoteListView.as_view(), name='lekha-home'),
    path('note/<int:pk>/', NoteDetailView.as_view(), name='note-detail'),
    path('note/new/', NoteCreateView.as_view(), name='note-create'),
    path('note/<int:pk>/update', NoteUpdateView.as_view(), name='note-update'),
    path('note/<int:pk>/delete', NoteDeleteView.as_view(), name='note-delete'),
    path('about/', views.about, name='lekha-about'),
]

введите код здесь

views.py

class NoteListView(ListView):
    model = Note
    template_name = 'lekha/home.html'
    context_object_name = 'notes'
    ordering = ['-date_created']


class NoteDetailView(DetailView):
    model = Note
    # success_url = 'lekha/note_detail.html'

class NoteCreateView(LoginRequiredMixin, CreateView):
    model = Note
    fields = ['title', 'content']

    def form_valid(self, form):
        form.instance.author = self.request.user
        return super().form_valid(form)

home.html

{% extends "lekha/base.html" %}
{% block content %}
    {% for note in notes %}

<div class="list-group">
  <a href="{% url 'note-detail' note.id %}" class="list-group-item list-group-item-action">{{ note.title }}</a>
</div>

    {% endfor %}
{% endblock content %}

note_detail.html

{% extends "lekha/base.html" %}
{% block content2 %}
    <article class="media content-section">
      <div class="media-body">
        <div class="article-metadata">
          <a class="mr-8" href="#">{{ object.author }}</a>
          <small class="text-muted">{{ object.date_created|date:"F d, Y" }}</small>
            {% if object.author == user %}
                <a class="btn float-right btn-secondary ml-1 btn-sm" href="{% url 'note-update' object.id %} ">Update</a>
                <a class="btn float-right btn-danger ml-1 btn-sm" href="{% url 'note-delete' object.id %} ">Delete</a>
            {% endif %}
        </div>
        <h4 class="article-title">{{ object.title }}</h4>
          <hr>
        <p class="article-content">{{ object.content }}</p>
      </div>
    </article>
{% endblock content2 %}

И вот как я это называю в base.html

   <main role="main" class="container-fluid px-2">
      <div class="row">
        <div class="col-md-3">
          <div class="content-section">
            <h4>Notes</h4>
                {% block content %}{% endblock %}
         </div>
        </div>
        <div class="col-md-8">
            {% block content2 %}{% endblock %}
        </div>
      </div>
    </main>

Извините за подробный пост. Буду признателен за любые указатели. Спасибо!

Answer 1

Добро пожаловать в Django!

Ваш шаблон note_detail.html расширяет base.html, который не содержит HTML для списка заметок, а note_detail.html не добавляет список, поэтомуон не отображается - вы его не добавили!

Для этого вам понадобятся те же {% block content %} из home.html в note_detail.html, а также вам необходимо вручную передать контекст notesпеременная к шаблону. Вы получаете это бесплатно с классом ListView.

Во-первых, изменение шаблона:

note_detail.html

{% extends "lekha/base.html" %}

{% block content %}
  {% for note in notes %}

  <div class="list-group">
    <a href="{% url 'note-detail' note.id %}" class="list-group-item list-group-item-action">{{ note.title }}</a>
  </div>

  {% endfor %}
{% endblock content %}
{% block content2 %}
    <article class="media content-section">
      <div class="media-body">
        <div class="article-metadata">
          <a class="mr-8" href="#">{{ object.author }}</a>
          <small class="text-muted">{{ object.date_created|date:"F d, Y" }}</small>
            {% if object.author == user %}
                <a class="btn float-right btn-secondary ml-1 btn-sm" href="{% url 'note-update' object.id %} ">Update</a>
                <a class="btn float-right btn-danger ml-1 btn-sm" href="{% url 'note-delete' object.id %} ">Delete</a>
            {% endif %}
        </div>
        <h4 class="article-title">{{ object.title }}</h4>
          <hr>
        <p class="article-content">{{ object.content }}</p>
      </div>
    </article>
{% endblock content2 %}

И изменение представления:

views.py

class NoteListView(ListView):
    model = Note
    template_name = 'lekha/home.html'
    context_object_name = 'notes'
    ordering = ['-date_created']


class NoteDetailView(DetailView):
    model = Note

    def get_context_data(self):
        data = super().get_context_data
        data['notes'] = Note.objects.all().order_by('-date_created')

Последний совет: чтобы ваши HTML-шаблоны были «СУХИМ», вам действительно нужно извлечь список заметок в отдельный HTML-шаблон (часто называемый частичным). ) что вы можете подключить к нескольким другим шаблонам. Настройка вашего шаблона будет выглядеть следующим образом:

partials / all_notes.html {% для заметок в заметках%}

<div class="list-group">
  <a href="{% url 'note-detail' note.id %}" class="list-group-item list-group-item-action">{{ note.title }}</a>
</div>

{% endfor %}

home.html

{% extends "lekha/base.html" %}

{% block content %}
{% include 'lekha/partials/all_notes.html' %}
{% endblock content %}

note_detail. html

{% extends "lekha/base.html" %}

{% block content %}
{% include 'lekha/partials/all_notes.html' %}
{% endblock content %}

{% block content2 %}
    <article class="media content-section">
      <div class="media-body">
        <div class="article-metadata">
          <a class="mr-8" href="#">{{ object.author }}</a>
          <small class="text-muted">{{ object.date_created|date:"F d, Y" }}</small>
            {% if object.author == user %}
                <a class="btn float-right btn-secondary ml-1 btn-sm" href="{% url 'note-update' object.id %} ">Update</a>
                <a class="btn float-right btn-danger ml-1 btn-sm" href="{% url 'note-delete' object.id %} ">Delete</a>
            {% endif %}
        </div>
        <h4 class="article-title">{{ object.title }}</h4>
          <hr>
        <p class="article-content">{{ object.content }}</p>
      </div>
    </article>
{% endblock content2 %}

base.html

   <main role="main" class="container-fluid px-2">
      <div class="row">
        <div class="col-md-3">
          <div class="content-section">
            <h4>Notes</h4>
                {% block content %}{% endblock %}
         </div>
        </div>
        <div class="col-md-8">
            {% block content2 %}{% endblock %}
        </div>
      </div>
    </main>