Member Avatar for idlackage

I'm just trying to output a value, but whenever it gets to "var max = tb1.value;" it stops working. I can't find out what's wrong with my code.

<html>
<head>
<script language="javascript" type="text/javascript">

var tb1 = document.getElementById('textbox1');
	
function output() {
    var max = tb1.value;
    document.write( max );
}

</script>
<title>asd</title>
</head>

<body>

<form>
<input name="max" type="text" id="textbox1"><br>
<input name="submit" type="button" value="Enter" onClick="output()">
</form>

</body>
</html>
  • 4 Contributors
  • 6 Replies
  • 297 Views
  • 4 Days Discussion Span
  • Latest Post Latest Post by six_sic6
Member Avatar for saravind84

Hi,

Please move the line of code "var tb1 = document.getElementById('textbox1');" inside the function output(). Please find the modified code below.

Thanks
Aravind

<html>
<head>
<script language="javascript" type="text/javascript">


	
function output() 
{
	var tb1 = document.getElementById('textbox1');
    var max = tb1.value;
    document.write( max );
}

</script>
<title>asd</title>
</head>

<body>

<form>
<input name="max" type="text" id="textbox1"><br>
<input name="submit" type="button" value="Enter" onClick="output()">
</form>

</body>
</html>
Member Avatar for idlackage

Hi,

Please move the line of code "var tb1 = document.getElementById('textbox1');" inside the function output(). Please find the modified code below.

Thank you, that works. Is there any way to use it as a global variable though? I want to use it in more than just that one function.

Member Avatar for Taywin

You can make it better by passing in an element ID instead of using global variable.

<html>
<head>
<script type="text/javascript">
// do not need langauge="" in the script tag because it is outdated
function output(elementID) {
  var tb1 = document.getElementById(elementID);
  if (tb1) {  // ensure that the element exists or javascript will stop working
    var max = tb1.value;
    document.write( max );
  }
}

</script>
<title>asd</title>
</head>

<body>

<form>
<input name="max" type="text" id="textbox1"><br>
<input name="submit" type="button" value="Enter" onClick="output('textbox1')">
</form>

</body>
</html>
Member Avatar for six_sic6

Dont use the var tb1. Just use document.getElementById('textbox1').value anywhere in your javascript block

Member Avatar for Taywin

Using only document.getElementById('textbox1').value without checking whether or not the element exists could cause your JavaScript to stop working right where the error occurs (when the element 'textbox1' does not exist). You could, however, use document.getElementById('textbox1') to test, but it will make your code to be longer and more difficult later on when you want to manipulate the same element again and again. Declaring a local variable to point to the element would not cost much and is easier to manipulate & more intuitive.

Edited by Taywin because: n/a
Member Avatar for six_sic6

Using only document.getElementById('textbox1').value without checking whether or not the element exists could cause your JavaScript to stop working right where the error occurs (when the element 'textbox1' does not exist). You could, however, use document.getElementById('textbox1') to test, but it will make your code to be longer and more difficult later on when you want to manipulate the same element again and again. Declaring a local variable to point to the element would not cost much and is easier to manipulate & more intuitive.

thanks for the advice. It will help me in future.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.