//ejecutando la consulta $("filtrar").click(function(){ }); $(document).ready(function(){ $.ajax({ dataType:'json', url: 'http://api.flickr.com/services/feeds/photos_public.gne?&jsoncallback=?',data:{ tags: "mount rainier", tagmode: "any", format: "json" }, success: function(data){ var customData = []; if(data.items){ $.each(data.items, function(i,e){ customData[i] = {titulo : e.title, desc: e.description, fecha: e.published}; }); } $("#rowTemplate").tmpl(customData).appendTo("#resultados"); } }); });
<!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title>Formulario de filtros</title> <script src="https://raw.github.com/jquery/jquery-tmpl/master/jquery.tmpl.min.js"></script> </head> <body> <form> <table> <tr> <td>Fecha inicial:</td> <td><input type="text" name="fchIni" id="fchIni"/></td></tr> <tr> <td>Fecha final</td> <td><input type="text" name="fchFin" id="fchFin"/></td> </tr> <tr> <td colspan="2"> <input id="filtrar" type="submit" value="filtrar"/> </td> </tr> </table> </form> <table id="resultados"> <tr> <th>Titulo</th> <th>Descripcion</th> <th>Fecha</th> </tr> </table> <script id="rowTemplate" type="text/x-jquery-tmpl"> <tr> <td>${titulo}</td> <td>${desc}</td> <td>${fecha}</td> </tr> </script> </body> </html>