I've looked around on SO on this topic like this topic here. Also this one. But for one I'm not using a YouTube flash object and also I'm not using an image. Below is a simple AJAX request which retrieves data to populate a table.
$(document).ready(onDocumentReady);
function onDocumentReady(){
$('#Recorded').addClass('border').click(changeToRecorded);
$('#Pending').addClass('border').click(changeToPending);
$('#main').addClass('scroll');
$('#entries').addClass('main');
}
function changeToRecorded(){
$('#entries').hide();
$('#main').html("Loading");
$.get("getData.php",{ status: "R" },requestComplete);
}
function changeToPending(){
$('#entries').hide();
$('#main').html("Loading");
$.get("getData.php",{ status: "P" },requestComplete);
}
function requestComplete(data){
$('#main').html('<table id="entries"></table>');
$('#entries').addClass('main');
$('#entries').html(data);
$('#entries').show();
}
getData.php includes some embed flash objects which populates the table id "entries". The problem I have is that it shows "Loading" during the AJAX request however after there is still a delay to load the embed objects into the table. Using jQuery or any other javascript method is there a way to detect when all embed objects are done loading?