Help with <table> formatting within a variable [Archive]

caclark

10-22-2003, 07:08 PM

I have a script that I am using to dynamically change the displayed text on a page. I have no problem with the script working correctly in IE, but NS4+ does not see the <table> formatting within the "var" (lines 21-23) . this causes my document.write (line 40) to be "undefined/empty".

Is there some trick to getting NS to see this formatting?

Any help would be appreciated.

========================== Code ==========================
<html>
<head>

<title>Timer</title>


<style type="text/css">
.countText, .countTextRed, .stopCountText {font-family:arial,helvetica}
.countText {font-size:20px; color:black; font-weight:bold}
.countTextRed {font-size:20px; color:red; font-weight:bold}
.stopCountText {font-size:30px; color:blue; font-weight:bolder}
</style>

<script language=javascript>

// Variables Used in Functions
var countdownStart=15; // Total Time (in seconds) for message to cycle thru the display
var textActionCount=1; // Should have the same number as the first "textAction" array below
var fileName="filename";

var countdownStartTxt1='<table width="100%"><tr><td width="70%" align="right"><span class="countText">Please Be Patient Creating The File: <span class="countTextRed">'; // Text Line1 To Display When Countdown Has Completed
var countdownStartTxt2='</tr></table>'; // Text line2 To Display When Countdown Has Completed
var countdownStop='<table width="100%"><tr><td align="middle"><span class="stopCountText">File Creation Has Completed !!!</span></td></tr></table>'; // Text To Display When Countdown Has Completed

// Array of text that will be dynamically changed in the document
var textAction=new Array()
textAction[1]='</span></td><td align="left"><span class="countText">.</span></td>'
textAction[2]='</span></td><td align="left"><span class="countText">..</span></td>'
textAction[3]='</span></td><td align="left"><span class="countText">...</span></td>'
textAction[4]='</span></td><td align="left"><span class="countText">....</span></td>'
textAction[5]='</span></td><td align="left"><span class="countText">.....</span></td>'

function getCountDown()
{
counttime=countdownStart--; // subtracting 1 from countdownStart timer number
textCount=textActionCount++; // adding 1 to testAction array number

// Countdown Text Will Be Displayed On A "Layer" In The Page
if (document.layers){
document.layers.countdown.document.write(countdownStartTxt1+fileName+textAction[textCount]+countdownStartTxt2);
document.layers.countdown.document.close();
}
else if (document.all){
countdown.innerHTML=countdownStartTxt1+fileName+textAction[textCount]+countdownStartTxt2;
}
else if (document.getElementById){
document.getElementById("countdown").innerHTML=countdownStartTxt1+fileName+textAction[textCount]+countdownStartTxt2;
}

// Reseting the text count after array has completed
// Please Note:
// If you add/remove entries in the array above you should also
// change this reset as well to the same total number
if (textCount>=5){
textActionCount=1
}

// Stop Countdown when it reaches 0
if (countdownStart>=0) window.setTimeout('getCountDown()',1000); // "1000"(in milliseconds) = speed at which text changes

// Display Below Text When Countdown is Complete
else {
if (document.layers){
document.layers.countdown.document.write(countdownStop);
document.layers.countdown.document.close();
}
else if (document.all)
countdown.innerHTML=countdownStop;
else if (document.getElementById)
document.getElementById("countdown").innerHTML=countdownStop;
}
}
</script>
</head>


<body onLoad='getCountDown()'>


<div id="countdown"></div>

</body>
</html>

=================================================

glenngv

10-23-2003, 03:11 AM

I don't think that's the problem. This forum just messed that up.

If you follow this line:

document.layers.countdown.document.write(countdownStartTxt1 + fileName + textAction[textC
ount] + countdownStartTxt2);

the output would be:

<table width="100%"><tr>
<td width="70%" align="right">
<span class="countText">Please Be Patient Creating The File:
<span class="countTextRed">
filename
</span>

</td><td align="left"><span class="countText">.</span></td>
</tr></table>

As you can notice there's no closing span tag for the first span.
So to fix that, you should add another closing span tag in textAction array:

textAction[1]='</span></span></td><td align="left"><span class="countText">.</span></td>'