How to display loading image on ajax call in JQuery?

Today now in this post i would like to share you how to Display loading image on ajax call in JQuery. Sometimes, we have need to display a loading image or any animation or text when we fire every ajax request. It is not for only one ajax request, but if sometimes we want to load image on our every ajax request then we can do that by using bellow example.

Here I will use ajaxStart() and ajaxComplete() function for show the image until All POST or GET Ajax request. This both function will be execute one each $.ajax request.

Example:

<script type="text/javascript">
    $(document).ready(function()
    {
        $(document).ajaxStart(function(){
	    	$('#process_img').css("display", "block");
	});
	$(document).ajaxComplete(function(){
		$('#process_img').css("display", "none");
	});
    });
</script>

Read Also : How to convert Object into Array in PHP?

Thanks for read. I hope it help you. For more you can follow us on facebook.