How to make this work with onLOad

[dragon_sa]

I have a textarea character and line counter, it works fine for input being entered, but I cant get it to work when a page first loads, and text is retrieved from a file for display in the textarea
How can I make this work with onLoad aswell to up date the counts.

script


<script type="text/javascript">
<!--
function textCounter(theField,theCharCounter,theLineCounter,maxChars,maxLines,maxPerLine)
{
var strTemp = "";
var strLineCounter = 0;
var strCharCounter = 0;

for (var i = 0; i < theField.value.length; i++)
{
var strChar = theField.value.substring(i, i + 1);
if (strChar == '\n')
{
strTemp += strChar;
strCharCounter = 1;
strLineCounter += 1;
}
else if (strCharCounter == maxPerLine)
{
strTemp += '\n' + strChar;
strCharCounter = 1;
strLineCounter += 1;
}
else
{
strTemp += strChar;
strCharCounter ++;
}
}
theCharCounter.value = maxChars - strTemp.length;
theLineCounter.value = maxLines - strLineCounter;
}
//-->
</Script>


and the form that uses it generated in php



$editTicker = "../ticker/profile/$number.inc";
$data = file_get_contents($editTicker);
$data = trim($data);
$data = nl2br($data);
$view = "<form action=\"#\" onsubmit=\"\$.ajax({url:'tickerTEMP.php', data: \$(this).serialize(), cache: false, type: 'post', success: function(data){\$('#showTICK').html(data);}});return false;\" name=\"myForm\">\n";
$view .= "<div id=\"tickHEAD\">Edit Information for Ticker $visNum</div>\n";
$view .= "<textarea name=\"content\" cols=\"36\" rows=\"12\" wrap=\"virtual\" onKeyUp=\"textCounter(myForm.content,myForm.remChars,remLines,468,12,39);\" ";
$view .= "oninput=\"textCounter(myForm.content,myForm.remChars,remLines,468,12,39);\">$data</textarea><br/>\n";
$view .= "<div id=\"tickINPUT\">\n";
$view .= "<input name=\"remChars\" type=\"text\" value=\"468\" size=\"3\" maxlength=\"3\" readonly> <b>Characters left</b> \n";
$view .= "<input name=\"remLines\" type=\"text\" value=\"12\" size=\"3\" maxlength=\"3\" readonly> <b>Lines left</b><br/>\n";
$view .= "* The characters and lines are a guide ONLY *<br/>\n";
$view .= "If your text does not fit in visible area,<br/>\n";
$view .= "Your text will not fit in the website ticker box.<br/>\n";
$view .= "</div>\n";
$view .= "<input type=\"hidden\" name=\"tickerNumber\" value=\"$number\" />\n";
$view .= "<input type=\"submit\" name=\"tickEDITp\" value=\"Edit Profile Ticker $visNum\" />\n";
$view .= "</form>\n";


I have tried to add


onLoad="textCounter(myForm.content,myForm.remChars,remLines,468,12,39);"

to the textarea, to the form, to the div tag it gets printed in and to spacer image gif on the page, but none of them load the function, I tested onLoad in the page with an alert and fires from the spacer gif but the text and line doesnt fire unless I press a key in the textarea.

Apreciate help on this :)

[jscheuer1]

Where? That syntax could only be valid in the body tag, as an attribute of the body tag. Even there you might need a more complete reference to the field and/or the rem elements. And/or it might be in conflict with another script. Maybe this would work:


<script type="text/javascript">
;(function(){
function initialCheck(){
var formels = document.forms.myForm.elements;
textCounter(formels.content,formels.remChars,formels.remLines,468,12,39);
}

if (window.addEventListener){
window.addEventListener('load', initialCheck, false);
}
else if (window.attachEvent){
window.attachEvent('onload', initialCheck);
}
})();
</script>

If you want more help, please include a link to the page on your site that contains the problematic code so we can check it out.

[dragon_sa]

Thanks John I managed to get it to work with a bit of modification, I added it to the bottom of the original script like this


<script type="text/javascript">
<!--
function textCounter(theField,theCharCounter,theLineCounter,maxChars,maxLines,maxPerLine)
{
var strTemp = "";
var strLineCounter = 0;
var strCharCounter = 0;

for (var i = 0; i < theField.value.length; i++)
{
var strChar = theField.value.substring(i, i + 1);
if (strChar == '\n')
{
strTemp += strChar;
strCharCounter = 1;
strLineCounter += 1;
}
else if (strCharCounter == maxPerLine)
{
strTemp += '\n' + strChar;
strCharCounter = 1;
strLineCounter += 1;
}
else
{
strTemp += strChar;
strCharCounter ++;
}
}
theCharCounter.value = maxChars - strTemp.length;
theLineCounter.value = maxLines - strLineCounter;
}
//-->
function initialCheck(){
var formels = document.forms.myForm.elements;
textCounter(formels.content,formels.remChars,formels.remLines,468,12,39);
}

if (window.addEventListener){
window.addEventListener('load', initialCheck, false);
}
else if (window.attachEvent){
window.attachEvent('onload', initialCheck);
}
</Script>


and then I added an onLoad to a spacer.gif I have at the bottom of the page and it started to function :)


<img src="img/spacer.gif" height="15px" width="1px" onLoad="initialCheck();">