CODEWITHSUNDEEP
jquery
Sandeep
Sandeep

Reputation: 1053

how to hide loading image when data loaded

I want to hide processing image when data loading process is completed

$(document).ready(function(){
    $("#searchBtn").click(function(){
	$('.loader').show();
        $.post("search.php",
	{
	    searchText : $('#search').val()
	},
	function( data ){
	    $("#responseText").html(data);
	});
				 
    });
});

Upvotes: 0

Views: 594

Answers (1)

Arun P Johny
Arun P Johny

Reputation: 388316

In the always handler of the ajax promise hide the loader image.

$(document).ready(function() {
  $("#searchBtn").click(function() {
    $('.loader').show();
    $.post("search.php", {
      searchText: $('#search').val()
    }, function(data) {
      $("#responseText").html(data);
    }).always(function() {
      $('.loader').hide();
    });

  });
});

Don't do it in the success handler, because you might want to hide it in the case of error also.

Upvotes: 1

Related Questions