Why this code doesn't work? is "id" attribute required?
<html>
<head>
<script language="JavaScript">
function pprint(){
var a = tf.value;
document.write(a);
}
</script>
</head>
<body>
<input type="text" name="tf" value="Test">
<input type="button" onClick="pprint()" value="print" >
</body>
</html>
Thanks!
In a form, the name attribute is required to fill the $_POST or $_GET global variables with a (name, value) pair.
Javascript will not identify an element from only the name. So, you would be better off using the id attribute.
<input type="text" name="tf" id="tf" value="Test">
And in your Javascript, you can directly call document.getElementById('tf') to get the element.
Something like this.
document.write(document.getElementById('tf').value);
Two changes. 'tf' is an 'id' and get the element in the javascript. And also 'alert' as suggested above.
<html>
<head>
<script language="JavaScript">
function pprint(){
var tf = document.getElementById('tf');
var a = tf.value;
alert(a);
}
</script>
</head>
<body>
<input type="text" id="tf" value="Test">
<input type="button" onClick="pprint()" value="print" >
</body>
</html>
Why this code doesn't work?
Javascript doesn't give you a ready to use handle on the element like you're expecting. You'll have to get the element by its name, ID, tag name or through its parent form (if it had one).
is "id" attribute required?
No, the ID is not required to get a handle on the element. Example of getting the element by name:
function pprint(){
var a = document.getElementsByName("tf")[0].value;
console.log(a);
}
While using JavaScript, if you want to access any element, you can choose to use:
You can use following code:
<script language="JavaScript">
function pprint(){
// If you want to use element Id
var a = document.getElementById('tf').value;
document.write(a);
// If you want to access by element name
var b = document.getElementsByName('tf')[0].value;
document.write(b);
}
</script>
document.write()is not what you think it is.