Skip to content

Instantly share code, notes, and snippets.

@SneakyBrian
Created October 5, 2012 20:26
Show Gist options
  • Save SneakyBrian/3842173 to your computer and use it in GitHub Desktop.
Save SneakyBrian/3842173 to your computer and use it in GitHub Desktop.
Add an ajax request indicator to a page in a fixed position for debug purposes
$(function () {
//add a requesting indicator to the page
$(document.body).append(
$('<div id="requesting" />').css({
top: '0px',
right: '0px',
height: '5px',
width: '5px',
'background-color': 'gray',
position: 'fixed'
}));
//set it up to show/hide if requests are in progress
$("#requesting").bind("ajaxSend", function () {
$(this).show();
$(this).css('background-color', 'gray');
console.log("Sent Request");
}).bind("ajaxSuccess", function () {
$(this).css('background-color', 'green');
console.log("Response Received OK");
}).bind("ajaxError", function () {
$(this).css('background-color', 'red');
console.log("Error Receiving Response!");
}).bind("ajaxComplete", function () {
$(this).fadeOut('slow');
console.log("Request Complete");
});
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment