Imagen animada al llamar al servidor

[satjaen]

Explico un poco lo que quiero hacer:
Tengo un formulario con varios campos y un boton para hacer una busqueda por nº de telefono, localidad etc.., el cual tiene un boton y debajo de este formulario tengo un tabla que por medio de ajax recupero los resultados de la consulta php a la base de datos.

Este es parte del formulario:

Código HTML:

<div id="formulario">
    <form id="frm_filtro" method="post" action="" name="form1">
            <table width="685">
  <tr>
    <td width="9%" class="campo_apellidos2">Teléfonos</td>
    <td width="9%"><input name="telefono" type="text" size="9" /></td>
</tr>
     <tr>
    <td class="campo_apellidos2">Localidad</td>
    <td colspan="4"><input name="poblacion" type="text" size="30" />
      </tr>
 
 <th scope="col"><button type="button"  id="btnfiltrar" name="btnfiltrar" style="border:0; margin:0; padding:0;cursor:pointer">
  <img src="imagenes_menu/boton_buscar.png"/>
</button>
</th>
  </tr>
</table>                
          </form>
 

Aquí en esta la tabla donde recupero los resultados:

Código HTML:

<table width="100%" id="data" class="table-dg-grid" >
             <thead>
              <tr>
       <tr bgcolor=#DFEBFF id=t70 ondblclick='coloreaf(70,1)' onMouseOver='coloreamosin(70,1)' onMouseOut='coloreamosout(70,1)'>
                     <th><span title="selecc">Selecc.</span></th>
                    <th><span title="nu_usuario">Nº Usuario</span></th>
                    <th><span title="telefono">Teléfono</span></th>
                    <th><span title="nombre">Nombre</span></th>
                    <th><span title="poblacion">Población</span></th>  
                     </tr>
                </thead>
                <tbody>
                </tbody>
            </table>
 

y me falta el archivo js que es donde quiero que al darle al boton de busqueda me haga la tipica imagen animada de busqueda Loading............

Código Javascript:

function filtrar()
{   
       
        $.ajax({
        data: $("#frm_filtro").serialize()+ordenar,
        type: "POST",
        dataType: "json",
        url: "ajax.php?action=listar",
        success: function(data){ 
        var html_user ='' ;
        if(data.length > 0){ 
        $.each(data, function(i,item){ 
        
        
         
 html_user += '<tr ondblclick="pulsar(this, ' +  String.fromCharCode(39) + item.num_usuario + String.fromCharCode(39)  + ');" >';
 html_user += '<td ><input name="demo" type="radio" value="' + item.num_usuario + '"/></td>';
 html_user += '<td id="row0" >'+item.num_usuario+'</td>';
 html_user += '<td>'+item.telefono+'</td>';
 html_user += '<td>'+item.nombre+' '+item.apellidos+'</td>';
 html_user += '<td>'+item.poblacion+'</td>';
 html_user += '</tr>';
            
                                  
        });                     
    } 
    if(html_user == '') html_user = '<tr><td colspan="4" align="center">No se encontraron registros..</td></tr>';
    $("#data tbody").html(html_user);
}
 
            
      });
}
 

Por favor, si no me he explicado con claridad decirmelo.Gracias