Django中同时实现分页与筛选功能的技术问询

问题：当前课程列表页面可单独实现按专业筛选（URL带q参数）或分页（URL带page参数），但无法同时携带两个参数，需要实现筛选后分页仍保留筛选条件、分页切换时保留当前筛选参数的效果。

解决方案 #

1. 优化视图层（views.py） #

在CourseListView的get_context_data方法中，将当前请求的查询参数传递到模板，用于后续构建带全参数的URL：

class CourseListView(ListView):
    model = Course
    context_object_name = "courses"
    template_name = "academics/course_list.html"
    paginate_by = 6

    def get_queryset(self, **kwargs):
        q = self.request.GET.get('q', '')  # 简化参数获取，默认空字符串
        return Course.objects.filter(major__major__icontains=q).order_by('course')

    def get_context_data(self, **kwargs):
        context = super().get_context_data(**kwargs)
        context['title'] = "Our Courses"
        context['majors'] = Major.objects.all()
        # 传递当前查询参数到模板，支持多参数拼接
        context['current_query'] = self.request.GET.copy()
        return context

2. 修改模板层（academics/course_list.html） #

处理筛选链接（保留分页参数）

修改专业筛选的链接逻辑，切换专业时自动保留当前分页参数：

<div class="col-12">
  <!-- courses by major -->
  <ul class="list-inline text-center filter-controls mb-5">
    <li class="list-inline-item m-3 text-uppercase active">
      {% with current_query=current_query %}
        {% current_query.pop 'q' %}  <!-- 清空筛选参数，回到全部课程 -->
        <a class="text-dark" href="{% url 'course-list' %}?{{ current_query.urlencode }}">All</a>
      {% endwith %}
    </li>
    {% with current_query=current_query %}
      {% for major in majors %}
        {% current_query.set 'q' major.major %}  <!-- 设置当前专业的筛选参数 -->
        <li class="list-inline-item m-3 text-uppercase">
          <a class="text-dark" href="{% url 'course-list' %}?{{ current_query.urlencode }}">{{major.major}}</a>
        </li>
      {% endfor %}
    {% endwith %}
  </ul>
</div>

处理分页链接（保留筛选参数）

修改分页按钮的链接逻辑，切换页码时自动保留当前筛选参数：

<div class="d-flex justify-content-center flex-nowrap">
  {% if is_paginated %}
    {% with current_query=current_query %}
      {% if page_obj.has_previous %}
        {% current_query.set 'page' 1 %}
        <a class="btn btn-outline-info mb-4" href="?{{ current_query.urlencode }}">First</a>
        {% current_query.set 'page' page_obj.previous_page_number %}
        <a class="btn btn-outline-info mb-4" href="?{{ current_query.urlencode }}">Previous</a>
      {% endif %}

      {% for num in page_obj.paginator.page_range %}
        {% if page_obj.number == num %}
          {% current_query.set 'page' num %}
          <a class="btn btn-info mb-4" href="?{{ current_query.urlencode }}">{{ num }}</a>
        {% elif num > page_obj.number|add:'-3' and num < page_obj.number|add:'3' %}
          {% current_query.set 'page' num %}
          <a class="btn btn-outline-info mb-4" href="?{{ current_query.urlencode }}">{{ num }}</a>
        {% endif %}
      {% endfor %}

      {% if page_obj.has_next %}
        {% current_query.set 'page' page_obj.next_page_number %}
        <a class="btn btn-outline-info mb-4" href="?{{ current_query.urlencode }}">Next</a>
        {% current_query.set 'page' page_obj.paginator.num_pages %}
        <a class="btn btn-outline-info mb-4" href="?{{ current_query.urlencode }}">Last</a>
      {% endif %}
    {% endwith %}
  {% endif %}
</div>

原理说明 #

• 通过request.GET.copy()获取当前请求的所有查询参数（如q、page），生成可修改的QueryDict对象；
• 在模板中使用set/pop方法调整参数后，通过urlencode将参数转换为URL编码字符串，拼接到链接中，实现多参数共存。

内容的提问来源于stack exchange，提问作者Dylan Bergmann