title: how can I use pagination with django_filter
body: <p>I got a problem with pagination after using django_filter in my TemplateView.
  Before use django_filter, my pagination was working normally but now it show all the items in every page, I've been looking on the internet but I didn't find a good solution for this.
  how can I fix it?
  thanks </p>
  
  <p>my filter.py </p>
  
  <pre><code>class SnippetFilter(django_filters.FilterSet):
      area = []
      tecnology = Technology.objects.values('parent_area').distinct().order_by('parent_area_id')
      for a in tecnology:                                                                         
          area.append(a['parent_area']) 
  
      parent_area = django_filters.ModelMultipleChoiceFilter(queryset=ApplicationArea.objects.filter(id__in=area), widget=forms.CheckboxSelectMultiple)
  
      class Meta:
          model = Technology
          fields = ['title', 'category', 'kind', 'patent', 'patent_type', 'parent_area']
  </code></pre>
  
  <p>my view.py</p>
  
  <pre><code>class TechnologyListView(LoginRequiredMixin, ListView):
      model = Technology
      template_name = "technology/technology.html"
      paginate_by = 9
  
      def get_queryset(self, *args, **kwargs):
          queryset = super(TechnologyListView, self).get_queryset()
          if self.request.user.is_authenticated and self.request.user.is_superuser or self.request.user.is_authenticated and self.request.user.is_staff:
              queryset = Technology.objects.all()
          elif self.request.user.is_authenticated and self.request.user.is_technology:
              queryset = Technology.objects.filter(user=self.request.user).order_by('-id')
          return queryset
  
      def get_context_data(self, **kwargs):
          selected_elements = []
          data = super(TechnologyListView, self).get_context_data(**kwargs)
          if self.request.user.is_authenticated and self.request.user.is_technology:
              data['finished'] = Technology.objects.filter(user=self.request.user, category=0).count()
              data['developed'] = Technology.objects.filter(user=self.request.user, category=1).count()
              data['product'] = Technology.objects.filter(user=self.request.user, kind=0).count()
              data['process'] = Technology.objects.filter(user=self.request.user, kind=1).count()
              data['software'] = Technology.objects.filter(user=self.request.user, kind=2).count()
              data['deposited'] = Technology.objects.filter(user=self.request.user, patent=0).count()
              data['licensed'] = Technology.objects.filter(user=self.request.user, patent=1).count()
              data['donthave'] = Technology.objects.filter(user=self.request.user, patent=2).count()
          elif self.request.user.is_authenticated and self.request.user.is_superuser or self.request.user.is_authenticated and self.request.user.is_staff :          
              data['finished'] = Technology.objects.filter(category=0).count()
              data['developed'] = Technology.objects.filter(category=1).count()
              data['product'] = Technology.objects.filter(kind=0).count()
              data['process'] = Technology.objects.filter(kind=1).count()
              data['software'] = Technology.objects.filter(kind=2).count()
              data['deposited'] = Technology.objects.filter(patent=0).count()
              data['licensed'] = Technology.objects.filter(patent=1).count()
              data['dontthave'] = Technology.objects.filter(patent=2).count()
  
          data['filter'] = SnippetFilter(self.request.GET, queryset=self.get_queryset())
  
          return data
  </code></pre>
  
  <p>template.html</p>
  
  <pre><code>     &lt;div class="container-fluid" &gt;
          &lt;div class="row"&gt;        
              &lt;div class="col-sm-2"&gt;
                  &lt;div style="margin-top:20%; margin-bottom:25% "&gt;
                      &lt;h1 class="title text-center"&gt;Filtro:&lt;/h1&gt;
                      &lt;form method="GET" action="{% url 'technology:tech_index' %}" novalidate&gt;
                          {{filter.form|bootstrap}}
  
                          &lt;a class="btn btn-rw btn-danger" href="{% url 'technology:tech_index' %}"&gt;Limpar Filtro&lt;/a&gt;
                          &lt;input type='submit' value='Procurar' class='btn btn-rw btn-primary'&gt;                    
                      &lt;/form&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
  
              &lt;div class="col-sm-8 col-sm-offset-1"&gt;
                  &lt;br&gt;                  
                  &lt;a class="btn btn-rw btn-primary" href="{% url 'technology:create_tech' %}"&gt;&lt;i class="fa fa-bolt"&gt;
                  &lt;/i&gt;Adicionar Tecnologia&lt;/a&gt;                            
  
  
                  &lt;h1 class="title text-center"&gt;Minhas Tecnologias&lt;/h1&gt;
  
  
                  {% if filter.qs.count &gt; 0 %}
  
  
                  &lt;div class="tab-content tab-shop mt15" style="align-items: center !important;"&gt;
                      &lt;div class="row" &gt;
                          &lt;div class="col-sm-4 col-md-4 col-lg-4"&gt;
                              &lt;canvas id="category"&gt;&lt;/canvas&gt;
                          &lt;/div&gt;  
                          &lt;div class="col-sm-4 col-md-4 col-lg-4"&gt;
                              &lt;canvas id="type" &gt;&lt;/canvas&gt;
                          &lt;/div&gt;    
                          &lt;div class="col-sm-4 col-md-4 col-lg-4"&gt;
                              &lt;canvas id="patent"&gt;&lt;/canvas&gt;
                          &lt;/div&gt; 
                          &lt;!-- &lt;div class="col-lg-3 col-md-3 col-sm-3"&gt;
                              &lt;canvas id="area_ap" width="80" height="80"&gt;&lt;/canvas&gt;
                          &lt;/div&gt;   --&gt;
                      &lt;/div&gt;
                      &lt;br&gt;
                  &lt;/div&gt;
                  &lt;br&gt;
                  &lt;div class="tab-content tab-shop mt15"&gt;
  
  
                      &lt;div id="home" class="tab-pane row fade in active"&gt;
  
                          {% for item in filter.qs %}        
                          &lt;div class="col-lg-4 col-md-4 col-sm-6 mb30"&gt;
                              &lt;div class="view  no-margin" style="background-color: #cfcfcf"&gt;
                                  &lt;!-- Blog Thumb --&gt;
                                  &lt;div class="product-container"&gt;
  
                                      {% if item.area_img %}                                                      
                                      &lt;img class="img-responsive full-width" style="width:100%; height:200px" src="{{item.area_img.image.url}}" alt="..."&gt; 
                                      {% else %}
                                      &lt;img class="img-responsive full-width" style="width:100%; height:200px" src="{% static 'images/notavailable.png' %}" alt="..."&gt;                                                
                                      {% endif %}                                                                                          
  
                                  &lt;/div&gt;
                                  &lt;div class="mask"&gt;
                                      &lt;div class="image-hover-content"&gt;
                                              &lt;!-- Zoom + Blog Link --&gt;
                                              &lt;a href="{% url 'technology:detail_tech' item.pk %}"  &gt;
                                                  &lt;div class="image-icon-holder"&gt;&lt;span data-toggle="tooltip" data-placement="top" title="Visualizar" class="ion-eye image-icons"style="color:#fff"&gt;&lt;/span&gt;&lt;/div&gt;
                                              &lt;/a&gt;
                                              {% if request.user.is_authenticated and request.user.is_technology %}                                                                                                      
                                                  &lt;a href="{% url 'technology:update_tech' item.pk %}"&gt;
                                                      &lt;div class="image-icon-holder"&gt;&lt;span  data-toggle="tooltip" data-placement="top" title="Editar" class="ion-edit image-icons" style="color:#fff"&gt;&lt;/span&gt;&lt;/div&gt;
                                                  &lt;/a&gt;
                                                  &lt;a data-toggle="modal" data-target="#delete-{{item.pk}}"&gt;
                                                      &lt;div class="image-icon-holder"&gt;&lt;span data-toggle="tooltip" data-placement="top" title="Deletar" class="ion-ios7-trash image-icons" style="color:red"&gt;&lt;/span&gt;&lt;/div&gt;
                                                  &lt;/a&gt;
                                                  {% endif %}
  
                                                  &lt;div class="modal fade" id="delete-{{item.pk}}" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"&gt;
                                                      &lt;div class="modal-dialog" role="document"&gt;
                                                          &lt;div class="modal-content text-center"&gt;
                                                              &lt;form action="{% url 'technology:delete_tech' pk=item.pk %}" method="post"&gt;
                                                                  {% csrf_token %}
                                                                  &lt;div class="modal-header"&gt;
                                                                      &lt;button type="button" class="close" data-dismiss="modal" aria-label="Close"&gt;&lt;span aria-hidden="true"&gt;&amp;times;&lt;/span&gt;&lt;/button&gt;
                                                                      &lt;h2&gt;Deletar&lt;/h2&gt;
                                                                  &lt;/div&gt;
                                                                  &lt;div class="modal-body"&gt;
                                                                      &lt;p&gt;Você deseja realmente deletar "{{ item }}"?&lt;/p&gt;
                                                          &lt;/div&gt;
                                                          &lt;div class="modal-footer"&gt;
                                                              &lt;button type="button" class="btn btn-success" data-dismiss="modal"&gt;Voltar&lt;/button&gt;
                                                              &lt;input class="btn btn-danger" type="submit" value="Confirmar" /&gt;
                                                          &lt;/div&gt;
                                                      &lt;/form&gt;
                                                      &lt;/div&gt;
                                                  &lt;/div&gt;
                                              &lt;/div&gt;
  
                                          &lt;/div&gt;&lt;!-- /image hover content --&gt;
                                      &lt;/div&gt;&lt;!-- /mask--&gt;
                                  &lt;/div&gt;
                                  &lt;div class="shop-product content-box-shadow"&gt;
                                      &lt;a href="{% url 'technology:update_tech' item.pk %}"&gt;&lt;h2&gt;{{item.title}}&lt;/h2&gt;&lt;/a&gt;
                                      {% if item.description %}                                          
                                          &lt;p&gt;{{item.description|truncatechars:40}}&lt;/p&gt;
                                      {% else %}
                                          &lt;p class="text-danger"&gt;Não há descrição&lt;/p&gt;
                                      {% endif %}
                                  &lt;/div&gt;
                              &lt;/div&gt;
                              {% if forloop.counter|divisibleby:4 %}
                          &lt;/li&gt;
                              &lt;li&gt;
                                  {% endif %}
                      {% endfor %}
                  &lt;/div&gt;
              &lt;/div&gt;
              {% include "includes/paginator.html" %}
              {% else %}
              &lt;div class="tab-content tab-shop mt15 text-center " style="padding-top: 25%; padding-bottom: 25%"&gt;
                  &lt;div class="row"&gt;
                      &lt;h1 class="text-info"&gt;Nenhuma tecnologia cadastrada&lt;/h1&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
              {% endif %}
          &lt;/div&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>paginator.html</p>
  
  <pre><code>{% if is_paginated %}
      &lt;ul class="pagination"&gt;
          {% if page_obj.has_previous %}
              &lt;li class="page-item"&gt;
                  &lt;a href="?page={{ page_obj.previous_page_number }}"&gt;&amp;laquo;&lt;/a&gt;
              &lt;/li&gt;
          {% else %}
              &lt;li class="disabled"&gt;&lt;span class="page-link"&gt;&amp;laquo; 
              &lt;/span&gt;&lt;/li&gt;
          {% endif %}
  
           {% for page_num in paginator.page_range %}
               {% if page_obj.number == page_num %}
                   &lt;li class="page-item active"&gt;
                      &lt;span class="page-link"&gt;
                         {{ page_num }}
                         &lt;span class="sr-only"&gt;(current)&lt;/span&gt;
                      &lt;/span&gt;
                   &lt;/li&gt;
               {% elif page_num &gt; page_obj.number|add:'-2' and page_num &lt; page_obj.number|add:4 %}
                   &lt;li class="page-item"&gt;
                       &lt;a class="page-link" href="?page={{ page_num }}"&gt;{{page_num}}&lt;/a&gt;
                   &lt;/li&gt;
               {% endif %}
            {% endfor %}
  
  
            {% if page_obj.has_next %}
               &lt;li class="page-item"&gt;
                  &lt;a class="page-link" href="?page={{ page_obj.next_page_number }}"&gt;&amp;raquo;&lt;/a&gt;&lt;/li&gt;
            {% else %}
                &lt;li class="page-item disabled"&gt;
                    &lt;span class="page-link"&gt;
              &amp;raquo;
                    &lt;/span&gt;
                &lt;/li&gt;
            {% endif %}
  
  
      &lt;/ul&gt;
   {% endif %}
  </code></pre>