Display loading image while post with ajax
Let's say you have a tag someplace on the page which contains your loading message:
<div id='loadingmessage' style='display:none'> <img src='loadinggraphic.gif'/></div>You can add two lines to your ajax call:
function getData(p){ var page=p; $('#loadingmessage').show(); // show the loading message. $.ajax({ url: "loadData.php?id=<? echo $id; ?>", type: "POST", cache: false, data: "&page="+ page, success : function(html){ $(".content").html(html); $('#loadingmessage').hide(); // hide the loading message } });
$.ajax({ type: 'post', url: 'mail.php', data: form.serialize(), beforeSend: function() { $('.content').html('loading...'); }, success: function(data) { $('.content').html(data); }, error: function() { $('.content').html('error'); }});have fun playing arround!
if you should have quick loading times which prevent te loading showing, you can add a timeout of some sort.