how can i make ajax-waiting until i fetch some information from database?

how can i make ajax-waiting until i fetch some information form database?

for example

 function cat()
      {
        my_info = "<?php ..fetching database information .. ?>";
        table = document.getElementById('table_2');
          table.innerHTML=my_info;
      }

what should i do to view ajax-loading gif until i complete get the info to display to t开发者_高级运维he end-user?

---

you can place code to view loading image just after you make the ajax request(send() method if you are using plain javasacript).

 request.open("GET", url, true);
 request.onreadystatechange = updatePage;
 request.send(null);
 // write code to show your image here 

Then hide that image in the callback function updatePage()

---

Somebody has to give you a jQuery alternative, so here I am: set up the ajax calls to show an image before sending the ajax call:

$.ajaxSetup({
  beforeSend: function() {
     $('#loadingImage').show()
  },
  complete: function(){
     $('#loadingImage').hide()
  }
});

and then set the ajax call as

$.get(url, function (response) {$("#myTable").html(response);});