django - Paging

django - mega_shop(쇼핑몰) 만들기

views.py

def index(request):
    page = request.GET.get('page', '1')  # GET방식으로 호출 된 url에서 page값을 가져온다.(defult값은 1로 설정한다.)

    product_list = Product.objects.all()

    paginator = Paginator(product_list, 5)  # Paginator 클래스 사용, 한 페이지당 5개씩 보여주기
    page_obj = paginator.get_page(page)  # 요청된 page에 해당되는 객체를 page_obj에 담는다.

    context = {'product_list': page_obj} 
    return render(request, 'products/product_list.html', context)

product_list.html

<!--페이징 시작-->
<ul class="pagination justify-content-center">
<!--첫 페이지로 이동-->
    {% if product_list.has_previous %}
    <li class="page-item">
        <a class="page-link" href="?page=1">처음</a>
    </li>
    {% else %}
    <li class="page-item disabled">
        <a class="page-link" href="#" tabindex="-1" aria-disabled="true">처음</a>
    </li>
    {% endif %}
<!--이전 페이지로 이동-->
    {% if product_list.has_previous %}
    <li class="page-item">
        <a class="page-link" href="?page={{ question_list.previous_page_number }}">이전</a>
    </li>
    {% else %}
    <li class="page-item disabled">
        <a class="page-link" href="#" tabindex="-1" aria-disabled="true">이전</a>
    </li>
    {% endif %}
<!--페이지 리스트-->
    {% for page_number in product_list.paginator.page_range %}
    {% if page_number >= product_list.number|add:-3 and page_number <= product_list.number|add:3 %}
<!--|add:-3 는 템플릿 필터이다. add:-3은 3만큼 빼라는 의미-->
    {% if page_number == product_list.number %}
    <li class="page-item active" aria-current="page">
        <a class="page-link" href="?page={{ page_number }}">{{ page_number }}</a>
    </li>
    {% else %}
    <li class="page-item">
        <a class="page-link" href="?page={{ page_number }}">{{ page_number }}</a>
    </li>
    {% endif %}
    {% endif %}
    {% endfor %}
<!--다음 페이지로 이동-->
    {% if product_list.has_next %}
    <li class="page-item">
        <a class="page-link" href="?page={{ product_list.next_page_number }}">다음</a>
    </li>
    {% else %}
    <li class="page-item disabled">
        <a class="page-link" href="#" tabindex="-1" aria-disabled="true">다음</a>
    </li>
    {% endif %}
<!--마지막 페이지로 이동-->
    {% if product_list.has_next %}
    <li class="page-item">
        <a class="page-link" href="?page={{ product_list.paginator.num_pages }}">마지막</a>
    </li>
    {% else %}
    <li class="page-item disabled">
        <a class="page-link" href="#" tabindex="-1" aria-disabled="true">마지막</a>
    </li>
    {% endif %}
</ul>

후기

• pybo에서 구현하지 않고 넘어갔었던 처음 페이지와 마지막 페이지 이동 버튼을 만들었다. 각각 이전 페이지와 다음 페이지가 있는지 확인하고 없다면 disabled를 이용해 클릭을 못 하게 만들었다.
• 첫 페이지로 이동할때는 href=?page=1, 마지막 페이지로 이동할때는 href="?page={{product_list.paginator.num.pages}}" 이렇게 코드를 작성했다.
  • num.pages는 전체 페이지의 개수를 의미한다.