August 13, 2012

Jquery response when retrieving Data

Jquery is getting server side data using any of the methods ($.getJSON , $.ajax or $.get) when data is retrieving many sites show some GIf or animation even some show the exact % prgress bar (yahoo email uploading , downloading) how can we encorporate this using jquery how can we know the content lenth dat is coming so that i can put some progress bar or gif animation until the data is complete retrieved.

According to need,

function GetCurrentUser() { 

$.ajax({
type: "POST",
url: "TestService.asmx/GetCurrentUser",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: onSuccessGetCurrentUser,
error: onError,
beforeSend: startingAjax,
complete: ajaxCompleted,
cache: false
});
}
function onSuccessGetCurrentUser(data, status) {

if (data.d != "") {

alert('Employee id: ' + data.d);
}
}
function onError(request, status, error) {

var msg = 'Error occoured';
alert('Error: ' + msg);
}
function startingAjax() {

$('#imgLoading').show();
}
function ajaxCompleted() {

$('#imgLoading').hide();
}


Where beforeSend is the function to show gif image and complete is the function when your data return in json format.