CODEWITHSUNDEEP
javascripthtmltextbox
Rohit Deshmukh
Rohit Deshmukh

Reputation: 391

Getting value from a Input Box , Javascript, getElementById

SO i am trying to get the value or the contents of an HTML text box. I have tried various types of methods but none of them work. According to the debugger , the code stops at getelementbyid method. The commented lines are the methods that I have already tried. Some of them return null while some of them return NaN and most of them just return a blank page. help is much appreciated.

<html>
<head>
<script type="text/javascript" >
function calculateit(){
document.open();
var number = document.getElementsByName('xyz')[0].value

//var number = document.getElementsByName("xyz").value;
//var number = document.getElementsByName('xyz').value;
//var number = document.getElementsByName("xyz");
//var number = document.getElementsByName('xyz');

//var number = document.getElementsById("xyz").value;
//var number = document.getElementsById('xyz').value;
//var number = document.getElementsById("xyz");
//var number = document.getElementsById('xyz');

//var number = document.form1.xyz.value;  //form 1 was my form name and/or id 


document.writeln(number);

var newtemp = 0;

var newtemp = tempera *9/5+32;

document.write(newtemp);
}

</script>

</head>

<body>
<input type="text" id="xyz" name="xyz">
<button title="calculate" onclick="calculateit()">calculate </button>


</body>
</html>

Upvotes: 0

Views: 5315

Answers (2)

Ian
Ian

Reputation: 50905

You're using the wrong method. The two widely supported methods for javascript are "getElementsByTagName" and "getElementById". Note exactly how "getElementById" is spelled. It is meant to get one element with the exact id that you specify. "getElementsByTagName" gets all elements of a certain tag...such as "div". When using "getElementById", you don't to index it or anything - it either returns null (can't find) or the exact element reference. From there, since it is a textarea, you can use ".value" to get the current value, like you already are.

ALSO:

You probably shouldn't use "document.write" or any of its related write methods AFTER the page has been rendered. In your example, that's exactly what you're doing, so once you get the ".value" stuff working, I would change that. The point is that "document.write" is more for during page rendering...so if you had javascript inline with the HTML body or something. Something like:

<html>
<head>

</head>
<body>
    <script type="text/javascript">
        document.write("testing");
    </script>
</body>
</html>

would be fine, but still not preferred. The fact that you have it in a function, that is called on a button click, means it is not during page render, and shouldn't be used. A more practical approach is to have a <div> on the page and add text to it when necessary, using something like ".innerHTML". That way, things are dynamic and not overwritten in the actual document.

Upvotes: 2

JoshRagem
JoshRagem

Reputation: 595

It's getElementById, not getElementsById.

Upvotes: 2

Related Questions