본문 바로가기

Python_WEB/Project-Noticeboard

[Django]Board > Templates > HTML > Board List

{% extends "base.html" %} {% block contents %}
<div class="row mt-5">
  <div class="col-12">
    <table class="table table-light">
      <thead class="thead-light">
        <tr>
          <th>
            #
          </th>
          <th>
            제목
          </th>
          <th>
            아이디
          </th>
          <th>
            일시
          </th>
        </tr>
      </thead>
      <tbody class="text-dark">
        {% for board in boards %}
        <tr onclick="location.href='/board/detail/{{ board.id }}'">
          <th>
            {{ board.id }}
          </th>
          <td>
            {{ board.title }}
          </td>
          <td>
            {{ board.writer }}
          </td>
          <td>
            {{ board.registered_dttm }}
          </td>
        </tr>
        {% endfor %}
      </tbody>
    </table>
  </div>
</div>
<div class="row mt-2">
  <div class="col-12">
    <nav>
      <ul class="pagination justify-content-center">
        {% if boards.has_previous %}
        <li class="page-item">
          <a class="page-link" href="?p={{ boards.previous_page_number }}"
            >이전으로</a
          >
        </li>
        {% else %}
        <li class="page-item disabled">
          <a class="page-link" href="#">이전으로</a>
        </li>
        {% endif %}
        <li class="page-item active">
          <a class="page-link" href="#"
            >{{ boards.number }} / {{ boards.paginator.num_pages }}</a
          >
        </li>
        {% if boards.has_next %}
        <li class="page-item">
          <a class="page-link" href="?p={{ boards.next_page_number }}"
            >다음으로</a
          >
        </li>
        {% else %}
        <li class="page-item disabled">
          <a class="page-link" href="#">다음으로</a>
        </li>
        {% endif %}
      </ul>
    </nav>
  </div>
</div>
<div class="row">
  <div class="col-12">
    <button class="btn btn-primary" onclick="location.href='/board/write/'">
      글쓰기
    </button>
  </div>
</div>
{% endblock %}