How to put output in textarea? (JAVASCRIPT)

So this is my coding, I really hope you guys can help me. I'm trying to put the result of the calculation in the textarea but I just don't know how and what should I use.

I have been trying to use span ID and getElementById. I think the language that I used is the most basic language.

<html>
<head>

<script type="text/javascript">

function bmicalc ()
{
	var fheight = document.form1.fheight.value;
	var fweight = document.form1.fweight.value;
	var result;
	
	result = fweight / ( fheight * fheight);

	return result;
}

</script>

</head>

<body>

<p align="center"><b><font size="4">BMI CALCULATOR</font><b></p>

<form name="form1" method="post" action="">
<table border="0" align="center">

<tr>
<td>Height:</td>
<td><input name="fheight" type="text" size="15"> meters
</tr>

<tr>
<td>Weight:</td>
<td><input name="fweight" type="text" size="15"> kilograms
</tr>

<tr>
<td colspan="2" align="center">
<input type="submit" name="submit" value="Get result" onclick="bmicalc()">
<input type="reset" name="reset" value="Reset">
</td>
</tr>

<tr>
<td colspan="2" align="center">
<textarea name="result" cols="30" rows="5" >
Your BMI is <result>
</textarea>
</tr>

</body>
</html>

So this is my coding, I really hope you guys can help me. I'm trying to put the result of the calculation in the textarea but I just don't know how and what should I use.

I have been trying to use span ID and getElementById. I think the language that I used is the most basic language.

<html>
<head>

<script type="text/javascript">

function bmicalc ()
{
	var fheight = document.form1.fheight.value;
	var fweight = document.form1.fweight.value;
	var result;
	
	result = fweight / ( fheight * fheight);

	return result;
}

</script>

</head>

<body>

<p align="center"><b><font size="4">BMI CALCULATOR</font><b></p>

<form name="form1" method="post" action="">
<table border="0" align="center">

<tr>
<td>Height:</td>
<td><input name="fheight" type="text" size="15"> meters
</tr>

<tr>
<td>Weight:</td>
<td><input name="fweight" type="text" size="15"> kilograms
</tr>

<tr>
<td colspan="2" align="center">
<input type="submit" name="submit" value="Get result" onclick="bmicalc()">
<input type="reset" name="reset" value="Reset">
</td>
</tr>

<tr>
<td colspan="2" align="center">
<textarea name="result" cols="30" rows="5" >
Your BMI is <result>
</textarea>
</tr>

</body>
</html>

Share Improve this question edited Jul 21, 2016 at 17:25 Adam Katz 16k5 gold badges76 silver badges93 bronze badges asked Jul 21, 2016 at 17:04 Nur Haziqah 351 silver badge5 bronze badges

Add a ment |

4 Answers 4

Sorted by: Reset to default 3

function bmicalc ()
{
    var fheight = document.form1.fheight.value;
    var fweight = document.form1.fweight.value;
    var result;

    result = fweight / ( fheight * fheight);

    document.getElementById('result').innerHTML = result;
}

You need to change the value of the textarea to the result

You can do this by adding this code just before returning your result value

 document.getElementById('result-textarea').value = 'Your BMI result' + result;

And also changing the text area to

<textarea id="result-textarea" name="result" cols="30" rows="5" >

</textarea>

Additionally I would like to point out that unless you're using some type of framework or library <result> is not a valid html element.

Try this:

function bmicalc()
{
	var fheight = document.form1.fheight.value;
	var fweight = document.form1.fweight.value;
	var result;
	
	result = fweight / ( fheight * fheight);

    document.getElementById('result').value = "Your BMI is " + result;
    
	return result;
}

<p align="center"><b><font size="4">BMI CALCULATOR</font><b></p>

<form name="form1" method="post" action="">
<table border="0" align="center">

<tr>
<td>Height:</td>
<td><input name="fheight" type="text" size="15"> meters
</tr>

<tr>
<td>Weight:</td>
<td><input name="fweight" type="text" size="15"> kilograms
</tr>

<tr>
<td colspan="2" align="center">
<input type="submit" name="submit" value="Get your result!" onclick="bmicalc()">
<input type="reset" name="reset" value="Reset">
</td>
</tr>

<tr>
<td colspan="2" align="center">
<textarea name="result" cols="30" rows="5" id="result"></textarea>
</tr>

Modifi you bmicalc

function bmicalc ()
{
    var fheight = document.form1.fheight.value;
    var fweight = document.form1.fweight.value;
    var result;

    result = fweight / ( fheight * fheight);
    document.form1.result.value = "Your BMI is " + result;
    return result;
}

科技改变生活-雨落星辰 - 所有的伟大,都源于一个勇敢的开始

How to put output in textarea? (JAVASCRIPT) - Stack Overflow

4 Answers 4

与本文相关的文章

评论列表(0)