Ir ao conteúdo
  • Cadastre-se
Makun

JQuery Mostrar Loading enquanto AJAX carrega.

Recommended Posts

Ola gostaria de saber meu código esta errado, fiz uma requisição com o banco e esta voltando correto os resultado, porém gostaria de mostrar um gif de loading enquanto faz a requisição, porém não esta aparecendo, e pelo que eu vi atualmente com a versão do jquery usa-se always() pra fazer isso ou nao ?

 

$(".style_cliente input").blur(function(){
	var client = $(this).val();
	$.ajax({
		url: 'dados.php',
		method: 'POST',
		data:{nClient:client,client:"pesquisar"}
	}).always(function(){
		$(".teste_gif").css({display:'block'});
	}).done(function(result){
		dados = result.split("/");
		$(".teste_gif").css({display:'none'});
		$(".teste").text(result);
		$(".style_end input").val(dados[0]);
		$(".style_reg input").val(dados[1]);				        
					        
	}).fail(function(result){
		$(".style_moto").html(result);
	});

				
});

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

@Makun Na verdade não.   o always é usado para outros retornos

 

Você pode usar o beforesend.

Tente desta forma:

 

 

$(".style_cliente input").blur(function(){
    
      var client = $(this).val();
      $.ajax({
         url: 'dados.php',
         method: 'POST',
	 data:{nClient:client,client:"pesquisar"},
         beforeSend: function() {
              $(".teste_gif").css({display:'block'});
         }
      }).done(function(result){
                dados = result.split("/");
		$(".teste_gif").css({display:'none'});
		$(".teste").text(result);
		$(".style_end input").val(dados[0]);
		$(".style_reg input").val(dados[1]);	
      }).fail(function(){
               $(".style_moto").html(result);   
      });
});

 

 

 

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

@DiF Eu tinha visto o beforesend até tentei usar provavelmente não consegui por erro de sintaxe, estava usando como se fosse uma função por exemplo "beforeSend()", funcionou sim o código , único problema é que não sei se é por ter poucos registros no banco ou por usar o display para ver e esconder, mas esta indo muito rápido não da nem pra ver o resultado.

teria como retardar esse result pelo menos por 1 segundo ?

 

Up: 

Na verdade consegui fazer um delay da seguinte forma, coloca um função no resultado e dando setTimeout(função,500); no caso o código ficou assim.

.done(function(result){
					       function delay(){
					       	 dados = result.split("/");
					        $(".teste_gif").css({display:'none'});
					        $(".teste").text(result);
					        $(".style_moto input").val(dados[0]);
					        $(".style_CPF input").val(dados[1]);
					        $(".style_RG input").val(dados[2]);
					      }
					      setTimeout(delay,500);
					        
					  }).fail(function(result){
					          $(".style_moto").html(result);
					  });

 

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

@Makun pelo fato de ser local, a chamada é instantânea. o que eu geralmente faço é  criar a div/img que fará o loading manualmente com css para ver como vai ficar ao ser feito a chamada ajax. Depois sim no beforeSend eu dou um prepend dessa classe no body e no complete eu removo essa div criada para o loading.

  • Curtir 1

Compartilhar este post


Link para o post
Compartilhar em outros sites

Crie uma conta ou entre para comentar

Você precisar ser um membro para fazer um comentário

Criar uma conta

Crie uma nova conta em nossa comunidade. É fácil!

Crie uma nova conta

Entrar

Já tem uma conta? Faça o login.

Entrar agora





Sobre o Clube do Hardware

No ar desde 1996, o Clube do Hardware é uma das maiores, mais antigas e mais respeitadas publicações sobre tecnologia do Brasil. Leia mais

Direitos autorais

Não permitimos a cópia ou reprodução do conteúdo do nosso site, fórum, newsletters e redes sociais, mesmo citando-se a fonte. Leia mais

×