[SOLUCIONADO] Paginación con python/django y html

[josepbidegain]

Hola como va, tengo el siguiente problema, tengo que paginar por ejemplo "socios" de un sitio, por ejemplo tengo que mostrar 10 por pagina, y debo mostrar el indice como maximo con 10 paginas, estoy haciendo todo esto correctamente con el codigo que voy a pegar ahora despues, el problema esta en cuando supero las 10 paginas como hago para mover el indice por ejemplo si estoy parado en la pagina 6, que me muestre como inicio la 2 y como final la 11, se entiende?
Pego el codigo que tengo:

en la views tengo la vista de socios:

Código Python:

def socios(request):
    copia = {}
    sociosAux = Socio.objects.all().order_by("nombre")[:10]    
    socios = []
    for s in sociosAux:
        soc = {'id':s.id, 'nombre':s.nombre, 'logo':str(s.logo).replace("\\","/"), 'rubro':str(s.rubro),\ 'direccion':s.direccion, 'telefono':s.telefono, 'web':s.web, 'mail':s.mail}        
        socios.append(soc)   
    
    socios_per_page = 10
    
    cant_socios = len ( Socio.objects.all() )        
    cant_pages = math.ceil( float(cant_socios)  /  float( socios_per_page ) )
 
    total_pages_mostrar = 10
    
    if cant_pages > total_pages_mostrar:
        copia['cant_pages_nums'] = range( 1, total_pages_mostrar + 1 )
    else:
        copia['cant_pages_nums'] = range( 1, int( cant_pages )+1 )
        
    copia['socios'] = socios
    copia['cant_pages'] = int( cant_pages )    
    copia['cantidad_socios'] = cant_socios
    return render_to_response("socios.html",copia)
 

en socios.html tengo esto:

Código HTML:

{% if cant_pages > 1 %}
            <div class="paginacion">
                <ul>
                {% for i in cant_pages_nums %}
                    {% if i == 1 %}           
                        <li><a class="num_page activo" data-id="{{i}}" href="#">{{i}}</a></li>
                    {% else %}
                        <li><a class="num_page" data-id="{{i}}" href="#">{{i}}</a></li>
                    {% endif %}
                {% endfor %}
                  <!--<li class="ultimo"><a href="#">Fin</a></li>-->
                </ul>   
            </div> <!--termina paginacion-->
        {% endif %}
 

en el document.ready de socios.html tengo esto:

Código Javascript:

//PAGINAR SOCIOS
    $(".num_page").on("click", function(e){     
        e.preventDefault();
                
        //ESTILO A PAGINACION       
        $(".num_page").each(function(){
             $(this).removeClass( "activo" );
        });     
        //$(this).addClass( "activo" );     
        var id = $(this).attr("data-id"); 
        $("a.num_page[data-id ="+ id+"]").addClass("activo");
        
        var toData = {          
            'page' : $(this).attr("data-id")
            };      
                
        $.ajax({ 
                type: "GET",
                url: "/iab/paginar-socios",
                data: toData,               
        }).done(function( msg ) {
                $("#contSocios").html(msg); 
            });             
    
    });//termina .num_page.click
 

Por ahora funciona bien la paginacion, pero quiero limitar la cantidad de paginas a mostrar en el indice, y a medida que se vaya moviendo, que vaya cambiando el indice...

Espero alguna sugerencia, gracias.

[razpeitia]

Este tema ha sido discutido bastante.

Por ejemplo algunos temas:
http://www.forosdelweb.com/f130/pagi...range-1019299/
http://www.forosdelweb.com/f130/pagi...odelo-1032719/

Un repo personal:
https://github.com/razpeitia/Django-Paginator-Example

Hay un repo con ejemplos simples entre ellos paginación:
https://github.com/fdw-contrib/django-ejemplos

[josepbidegain]

Gracias por el aporte, justo lo resolvi antes de leer tu ayuda, dejo mi solución. Lo hice mediante js simplemente cambiando el indice a medida que me iba moviendo, el resto de traer los datos con ajax ya lo tenia hecho. El valor de cant_pages lo cargo en un div oculto porque no sabia como acceder a un dato devuelto desde django desde javascript.

Código HTML:

<div id="cant_pages" data-num="{{cant_pages}}" style="display:none;"></div>
 

Código Javascript:

//PAGINAR SOCIOS
    $("body").on("click",".num_page", function(e){      
        e.preventDefault(); 
        
    var total = $("#cant_pages").attr("data-num");
    var current = parseInt( $(this).attr("data-id") );
    var adj = 2; //cantidad paginas a mostrar adjacentes del actual.
    var inicio ="";
    var fin = "";
    var html ="";
    
    if ( (current - adj) < 1 && total < 5 ){
         inicio = 1;
         fin = total;    
    }
    else if ( (current - adj) < 1 && total > 5 ){
         inicio = 1;
         fin = 5;        
    }
    else if ( (current + adj) > total ){
        fin = total;
        current = current - ( (current+adj) - total );
        inicio = current - adj;
    }
    else{
        inicio = current - adj;
        fin = current + adj;
    }   
 
    if (inicio != 1){
        html+='<li><a class="num_page" data-id="1" href="#"><|</a></li>';
    }
    
    for (var i= inicio; i <= fin; i++){ 
        
        if (i == current){
            html+='<li><a class="num_page activo" data-id="'+i+'" href="#">'+i+'</a></li>';
        }else{          
            html+='<li><a class="num_page" data-id="'+i+'" href="#">'+i+'</a></li>';
        }       
    }
    if (fin != total){
        html+='<li><a class="num_page" data-id="'+total+'" href="#">|></a></li>';
    }
    $(".pag").html(html);