writing a var value to the page from a function

SerialCoder · Feb 2, 2007

Hey all, after all these years of avoiding it, I have to learn some JavaScript. I'm getting frustrated because I can do any of this stuff with server side languages but I just cant seem to get the simplest of scripts to work... anyway, baby steps...

I have a test page that I want to write the length of the text input value to the page. It's just not doing it. any suggestions?

<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>New Page 2</title>
<script language="JavaScript">
var myvar
myvar = "This is a test";
function thisfunction(thevalue)
{
myvar = myform.myval.value;
return myvar.length;
}
</script>
</head>

<body>

<form name="myform" method="POST">
<p><SCRIPT LANGUAGE="JavaScript">document.write(myvar.length)</script><br>
<input type="text" name="myval" size="20" value="test" onkeyup="thisfunction(this.value);"></p>
</form>

</body>

</html>

David Tulk
IS Manager - Dillin Engineered Systems
Conveyor Systems - Accumulation - Robotics - Systems Integration

http://www.dillin.net

Kirsle · Feb 2, 2007

The problem is that document.write isn't doing what you think it's doing. What it does now is, when the page loads and gets to that block of script, it runs the script and then that's it--the end of the document.write part.

So then, even if "myvar" gets updated when you type, it's not going to re-write the new value. What you want is to try a <div> or a <span> and use innerHTML:

Code:

<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>New Page 2</title>
<script language="JavaScript">
var myvar
myvar = "This is a test";
function thisfunction(thevalue)
{
   myvar = myform.myval.value;

[COLOR=blue]   // update the div
   document.getElementById("showlen").innerHTML = myvar.length;[/color]
}
</script>
</head>

<body>


<form name="myform" method="POST">
    <p>[COLOR=blue]<div id="showlen"></div>[/color]<br>
    <input type="text" name="myval" size="20" value="test" onkeyup="thisfunction(this.value);"></p>
</form>


</body>

</html>

-------------
Cuvou.com | The NEW Kirsle.net

Kirsle · Feb 2, 2007

On a side note, onKeyUp only calls when a key is released. If you press and hold a key down and repeat it a hundred times, the script will never know how long the string is until you let go of the key.

onKeyDown on the other hand will be called every time a key is pushed down (or if you hold it, onKeyDown is called each time a new symbol is written)

-------------
Cuvou.com | The NEW Kirsle.net

SerialCoder · Feb 5, 2007

Beautiful. Thanks for the help, I'll keep plugging away at more meaningless trials... I appreciate the help.

David Tulk
IS Manager - Dillin Engineered Systems
Conveyor Systems - Accumulation - Robotics - Systems Integration

http://www.dillin.net

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

writing a var value to the page from a function

SerialCoder

Programmer

Kirsle

Programmer

Kirsle

Programmer

SerialCoder

Programmer

Similar threads

Part and Inventory Search

Sponsor