Carga de Datos con Scroll

[mixzplit]

Hola anacona16, fijate lo que hice, modifique toda la estructura

Agregue 2 funciones que las meto dentro de la condicion del window scroll

Código Javascript:

$(document).ready(function(){
var processing = false
       $(window).scroll(function(){
        
           if ($(window).scrollTop() == $(document).height() - $(window).height()){
             if(processing) return;      
            mas_zonas(processing);      
            mas_vendedores(processing); 
          } 
      });       
});
 

Aqui las 2 funciones que estoy usando

Código Javascript:

function mas_zonas(process){
          //alert(process);
          var zonMas = 'fil_zona_mas'
            if($('#ZonCuotas').val()!='null' && $('#vendedorCuotas').val()=='null'){
                //if(process) return;
               $.ajax({ 
                  type: "POST",
                    url: "controlador/controladorReportes.php", 
                    data: 'op=' + zonMas+'&zona='+$('#ZonCuotas').val(),
                    beforeSend: function() {
                                   //$('#_mensajesCarga').html('<div align="center"><img src="images/loading.gif"></div>'); 
                                  process = true;
                                }, 
                    success: function(data) {   
                           $('#_tabla_contenedor').append(data);
                           //$('#_mensajesCarga').html('');
                    },
                    complete: function() { process = false; }
               });                      
                }   
}
 
function mas_vendedores(process){
    var venMas = 'fil_vendedor_mas'
                if($('#vendedorCuotas').val()!='null' && $('#ZonCuotas').val()!='null'){
                    alert(process)
               if(process) return;
               $.ajax({ 
                  type: "POST",
                    url: "controlador/controladorReportes.php", 
                    data: 'op=' + venMas+'&codven='+$('#vendedorCuotas').val(),
                    beforeSend: function() {
                                   process = true; 
                                   //$('#_mensajesCarga').html('<div align="center"><img src="images/loading.gif"></div>'); 
                                  
                                }, 
                    success: function(data) {   
                           $('#_tabla_contenedor').append(data);
                               $('#_mensajesCarga').html('');
        
                    },
                    complete: function() { process = false; }
 
               });                      
 
                      
                }       
    
}
 

Como vera cambie todo a $AJAX, me esta funcionado bien, pero no es por que lo pase a AJAX y manejo mejor los eventos. Resulta que la el <DIV> donde me esta mostrando la imagen de carga cuando el scroll llega al final, me esta cambiando el tamaño de a pagina y si el usuario sigue bajando, se hacen 2 consultas, la segunda se ejecuta antes de que termine la primera y por eso se pierden los datos de la primera consulta y solo muestra el resultado de la segunda.
Le quite el DIV donde carga la imagen y funciona perfecto.

Esto se puede solucionar? quisiera colocar la imagen de carga por si la conexion es lenta

Saludos