[jQuery] Scoping issue with load and call back function.
I am a relative newbie to Jquery and I am getting some scoping issues
I can't figure out.
I was hoping for some advice.
Basically I am trying to load multiple documents that have HTML tables
and then parse the tables and redisplay in a new format. Merging
elements from the different documents.
So basically I build the url path for a set of "devices" and load
them. I thought in the load function I could collect elements into
global variables and manipulate in the final document. But is not
working.
The variables TableCells, TableRowName and TableColName are what I
have issues with.
$(document).ready(function(){
$.ajaxSetup({cache: false}) ;
var TableCells =[,];
var TableRowName =[,];
var TableColName =[,];
for( var i =0; i < devList.length; i++)
{
// set the path
var path = prefix + yield_dir + devList[i] +'/' + smslot_yield;
//clear the display area
$('#display').html("");
var colName =[];
var rowName =[];
var cellValue = [];
//load the page but collect the table info
if (firstLoad == 1)
{
$('#display').load(path,
function(){
manipulate tables and put data in
Global Array
TableCells[i] = cellValue;
TableRowName[i] = rowName;
TableColName[i] = colName;
});
}
}
});
So the variables are defined in the document ready scope. (I even
tried outside that as well)
var TableCells =[,];
var TableRowName =[,];
var TableColName =[,];
I set these variables in the load function scope and they are
accessible there and work fine.
However when I try to access outside the load function the variables
are undefined.
Can you tell what I am missing?
Thanks,
Steve