PAGINACIÓN CON DJANGO-PURE-PAGINATION

imagen / quattrostagioni
  
8 de Agosto de 2015   2  

Hola pythoneros y djangueros! mi nombre es Jonatan  y el día de hoy les mostraré cómo utilizar un plugin que nos facilitará la paginación de registros con Django.  Sin duda alguna esta librería es muy buena para aquellos desarrolladores que aún tienen proyectos escritos con alguna versión antigua de Django como la 1.2, 1.4 ...

Acepto comentarios y sugerencias, Saludos.

Características

  1. Usa la misma api como django.core.pagination y por lo tanto es totalmente compatible con el código existente.
  2. Tiene creación de cadenas de consulta dinámico, la cual toma en consideración los parámeteros existentes en GET.
  3. Renderizado HTML de paginación "Out-of-the-box"
  4. Métodos adicionales que facilitan la renderización de la paginación avanzada en los templates.

Instación.

Ahora veamos cómo podemos instalar esta librería en nuestros equipos.

Instalación mediante PIP

  • pip install django-pure-pagination

Agregar la aplicacion de djangon-pure-pagination en las app del settings

  •  INSTALLED_APPS = (
        ...
        'pure_pagination',
    )

Ejemplo de uso:

  • Creamos una aplicacion llamada djangosearchpaginationplus para que pueda ser reutilizable .
  • Creamos la vista que nos paginára:
from django.core.exceptions import ImproperlyConfigured
from pure_pagination.mixins import PaginationMixin
class DinamicPaginationMixin(PaginationMixin):
    def get_paginate_by(self, queryset):
        self.paginate_by = self.request.GET.get('rpp', 10)
        if self.paginate_by:
            try:
                self.paginate_by = int(self.paginate_by)
            except ValueError:
                self.paginate_by = 10
        return self.paginate_by

    def get_context_data(self, **kwargs):
        context = super(DinamicPaginationMixin, self).get_context_data(**kwargs)
        context['rpp'] = self.get_paginate_by(self.queryset)
        return context
  • Creamos una segunda vista para que podamos hacer filtros:
class SearchMixin(object):
    def get_search(self):
        return self.request.GET.get('search', '')

    def get_filter(self, queryset):
        raise ImproperlyConfigured('Debe especificar implementar el filtro de búsqueda')

    def get_queryset(self):
        queryset = super(SearchMixin, self).get_queryset()
        queryset = self.get_filter(queryset)
        return queryset

    def get_context_data(self, **kwargs):
        context= super(SearchMixin, self).get_context_data(**kwargs)
        context['search'] = self.get_search()
        return context
  • Creamos los templates para la paginación y los filtros:
    • search.html
    • <div class="dgtic-panel-content">
          Mostrar:
          <select onchange="handleSubmitSearch();" name="rpp" id="id_rpp" style="width: inherit;">
              <option value="10" {% if rpp == 10 %}selected{% endif %}>10</option>
              <option value="25" {% if rpp == 25 %}selected{% endif %} >25</option>
              <option value="50" {% if rpp == 50 %}selected{% endif %} >50</option>
              <option value="100" {% if rpp == 100 %}selected{% endif %} >100</option>
          </select>
          registros
          <div class="pull-right">
              <input onkeypress="handleSearchInput(event);" type="text" name="search" id="id_search" placeholder="Buscar" value="{{ search }}"/>
              <button class="btn" onclick="handleSearchInput(event)">
                  <i class="icon-search"></i>
              </button>
          </div>
      </div>
      
    • pagination.html
{% load i18n %}
<div class="pagination pagination-centered">
    <ul>
        {% if page_obj.has_previous %}
            <li>
                <a href="?{{ page_obj.previous_page_number.querystring }}">&lsaquo;&lsaquo; Anterior</a>
            </li>
        {% else %}
            <li class="disabled">
                <a href="#">
                    <span>&lsaquo;&lsaquo; Anterior</span>
                </a>
            </li>
        {% endif %}

            {% if page %}
                {% ifequal page page_obj.number %}
                    <li class="active">
                        <a href="#">
                            <span>{{ page }}</span>
                        </a>
                    </li>
                {% else %}
                    <li>
                        <a href="?{{ page.querystring }}">{{ page }}</a>
                    </li>
                {% endifequal %}
            {% else %}
                <li class="disabled">
                    <a href="#">...</a>
                </li>
            {% endif %}

        {% if page_obj.has_next %}
            <li>
                <a href="?{{ page_obj.next_page_number.querystring }}">Siguiente &rsaquo;&rsaquo;</a>
            </li>
        {% else %}
            <li class="disabled">
                <a href="#">
                    <span>Siguiente &rsaquo;&rsaquo;</span>
                </a>
            </li>
        {% endif %}
    </ul>
</div>
  • Importamos  las clases creadas anteriormente DinamicPaginationMixin, SearchMixin y las agregamos a nuestras clases de listado de nuestros modelos:​
from apps.djangosearchpaginationplus.views import DinamicPaginationMixin, SearchMixin
class xxxxxxxxxx( DinamicPaginationMixin, SearchMixin, ListView):

pass

 

Para los filtros tenemos que agregar dentro del metodo get_filter lo siguiente:

search = self.request.GET.get('search')
if search:

pass

  • En nuestro html, donde se muestran los datos, agregamos:
    {% include "djangosearchpaginationplus/search.html" %}
    <table id="id_contenido_table" class="dgtic-table">
        <thead>
            <tr>
                <th>xxxxxx</th>                
            </tr>
        </thead>
        <tbody>
            <tr>
                <td colspan="12">xxxxxxxx</td>
            </tr>
        </tbody>
    </table>
    <div class="dgtic-panel-content">
        {% include "djangosearchpaginationplus/pagination.html" %}
    </div>

 

  • Por ultimo, en un archivo js agregamos lo siguiente:


 var handleSearchInput = function(event) {
     if (event.keyCode == 13 || event.type=="click"){
         return handleSubmitSearch();
     }
     return false;
 };

 var handleSubmitSearch = function() {
     var qs = $('#id_rpp, #id_search').serialize();
     $(location).attr('href', '?' + qs);
     return false;
 };

Y lo importamos en el html:

<script src="{% static "jquery.djangosearchpaginationplus.js" %}"></script>

Y de esta manera ya tendremos integrado esta librería a nuestros proyecto.  Si tienen alguna duda con gusto pueden dejar un comentario e iniciar una plática para resolver sus dudas. Gracias!



Jonatan Mendez

Temas relacionados