display content of an array

[Claus Mygind]

I have an array of objects (a hash table). My section of code, the "for in" loop (lines 18 to 41) does not execute at full speed. But if I put in an alert box (line 13) to stop program execution the the code executes when I click the Ok.

I am writing an HTML table on the fly. First I delete the content of the table, then I repopulate the table with the new content. Below the following code I display how I create the arrays (which naturally comes before this code in the actual program):

I have experimented with both using the day of the week number and the actual name of the day of the week neither way seems to work.

Attached is also a visual of the array structure.

function drawRTable(tbody) {
    var tr, td;
    tbody = document.getElementById(tbody);
 
    // remove existing rows, if any
    while (tbody.rows.length > 0) {
        tbody.deleteRow(0);
    }
 
    var cHeaderFlag = true
 
//when this line is inserted the following for in loop executes
alert("stop1");
 
/*
aWeeklyTime array of object with the days of the week each day containing a variable number of entries (not important right now as I cannot get the for in loop to execute without stopping first
*/
    for ( var i in aWeeklyTime )
    {
        if (cHeaderFlag)
        {
                    cHeaderFlag = false
            tr = tbody.insertRow(tbody.rows.length);
            td = tr.insertCell(tr.cells.length);
            td.setAttribute("colspan", "6");
            td.setAttribute("class", "subHeading4");
            var cThisWeek = aWeeklyTime[i][0].weekEnd;
            td.innerHTML = 'Time entered for week ending ' + cThisWeek;
        }
        //display day of week name
        tr = tbody.insertRow(tbody.rows.length);
        td = tr.insertCell(tr.cells.length);
        td.setAttribute("class", "subHeading3");
        td.innerHTML = aWeeklyTime[i][0].dayName;
 
        //fill in content
//        for ( var n in aWeeklyTime[i] )
//        {
//        }
 
    }
 
}
 

Here is how I create the array:

The arrays in this segment are as follows

aReturn is an array created with .split to parse the ajax return string (not shown here)

aDetailTime is an array also created with .split to parse each element in the aReturn array into it's subElements (line 10 below)

aTempTime is a temporary object which has one property for each element in the aDetailTime array (lines 11 thru 27 below)

aWeeklyTime array is a public array created outside the functions. Each element of aWeeklyTime is an object representing one weekday with all its detail content. (line 44 below)

    }else if (aReturn[0] == "~getSummary~")
    {
            var wkDay = "";
            for (var i = 1; i < aReturn.length; i++ )
            {
                //create two arrays to store the information
                var aDetailTime = new Array();
                var aTempTime = new Array();
                //parse the string into the array using the tilde to separate each value
                aDetailTime = aReturn[i].split('~');
                aTempTime[i] = new Object();
                aTempTime[i].RECKEY         = aDetailTime[0];
                aTempTime[i].EMPNO         = aDetailTime[1];
                aTempTime[i].WORKDAY     = aDetailTime[2];
                aTempTime[i].JOBID         = aDetailTime[3];
                aTempTime[i].JDEPTID     = aDetailTime[4];
                aTempTime[i].PHASECODE     = aDetailTime[5];
                aTempTime[i].PRJCTNAME     = aDetailTime[6];
                aTempTime[i].HOURS         = aDetailTime[7];
                aTempTime[i].minutes     = aDetailTime[8].substring(1) ;
                aTempTime[i].MILES         = parseInt( aDetailTime[9], 10 );
                aTempTime[i].TOLLS         = parseFloat( aDetailTime[10] );
                aTempTime[i].STARTMILES     = parseFloat( aDetailTime[11] );
                aTempTime[i].ENDMILES     = parseFloat( aDetailTime[12] );
                aTempTime[i].APPROVED     = aDetailTime[13];
                aTempTime[i].weekEnd     = aDetailTime[14];
                aTempTime[i].isDept         = aDetailTime[15];
 
                var d = new Date(aTempTime[i].WORKDAY);
                chkDay = d.getDay()
 
                if (wkDay != chkDay)
                {
                    wkDay = chkDay;
                    var cDayName = formatDate( new Date(aTempTime[i].WORKDAY), "EE" );
//                    aWeeklyTime[chkDay] = new Object();
                    aWeeklyTime[cDayName] = new Object();
                    var cDetailCount = 0;
                }else{
                    cDetailCount +=1;
                }
                aTempTime[i].dayName     = cDayName;
//                aWeeklyTime[chkDay][cDetailCount] = aTempTime[i];
                aWeeklyTime[cDayName][cDetailCount] = aTempTime[i];
            }
 

[Claus Mygind]

the "for in" loop (lines 18 to 41) does not execute at full speed. But if I put in an alert box (line 13) to stop program execution the the code executes when I click the Ok.

It is all a matter of timing. 6 hours of working on this with no luck and instead it comes to me in a flash laying in bed. No matter how much you try to show the code you think is the problem, the problem always lies someplace else.

This is an ajax call to fill the hash tables (arrays). That is why it did not work at full speed, the data had not arrived.

for example (and I wish the guru's out there would have pointed this out):

In this example the browser races ahead in function A and calls C before B has returned the data (hence nothing to display, but works fine with a stop in the code like the alert box). So simply taking the call for C out of A and putting it as the last line of code in B resolves the problem

function A( )  //(main)
{
 B ( ); //(get data via Ajax
 C ( ); //display data 
}
 
function B( ) 
{
  Ajax call...;
}
 
function C( )
{
  Display data....
}

[acoder]

Yes, this is a common problem. You could've called C() in the callback function when the readyState is 4 (complete).