I am trying to make a BMI Calculator using HTML. The inputs come from text fields. I am making some calculation with them in a Javascript function. I want to get the calculated values in a span like this:
<span id="" class="">Your Calculation Results is = </span>
<span id="" class=""> "" I want the result here "" </span>
==================================================================== Edit : The part that i am asking about
<script language="javascript">
var bmi = document.getElementById("ID_bmiResult2").innerHTML;
bmi.value = weight / (heightInMeter * heightInMeter);
</script>
<body>
<span id="ID_bmiResult2"> </span>
</body>
i don't know how to make it ...
I am trying to make a BMI Calculator using HTML. The inputs come from text fields. I am making some calculation with them in a Javascript function. I want to get the calculated values in a span like this:
<span id="" class="">Your Calculation Results is = </span>
<span id="" class=""> "" I want the result here "" </span>
==================================================================== Edit : The part that i am asking about
<script language="javascript">
var bmi = document.getElementById("ID_bmiResult2").innerHTML;
bmi.value = weight / (heightInMeter * heightInMeter);
</script>
<body>
<span id="ID_bmiResult2"> </span>
</body>
i don't know how to make it ...
Share Improve this question edited Jun 29, 2012 at 21:37 Mahmoud asked Jun 29, 2012 at 18:21 MahmoudMahmoud 1971 gold badge5 silver badges17 bronze badges 06 Answers
Reset to default 10Edit: As it was pointed out, FF doesn't like innerText, so I'm replacing to innerHTML which in this particular case doesn't not change the overall functionality of the script.
You can get the 2nd span and pass the value directly to innerHTML like this:
document.getElementsByTagName('span')[1].innerHTML= 'the result';
Note: Consider using and id or class so you can find the exact element you need to change instead of retrieving several elements of that type (in this case span).
If you had an id, it would be like this:
document.getElementById('the id goes here').innerHTML= 'the result';
Edit2: This edit was made after the OP changed his question It got really confusing now that I'm seeing your code. I've written this fiddle so you can see it working
If you have a variable like calcResult, you can do:
document.getElementById('spanId').innerHTML += calcResult;
Of course, that only works once. If you do it again, you'll have two results in the span. If you want to be able to change the result if the form fields change, I'd try:
<span id="calc">Your calculation result = <span></span></span>
var result = 12;
document.getElementById('calc').getElementsByTagName('span')[0].innerHTML = result;
Have you tried Jquery ?
$("span").next().text("Your Result");
OR
$("span").eq(1).text("Your Result");
To do a better code, put a ID in your component.
You can use document.writeln to get your result. check out the fiddle on http://jsfiddle.net/CmVww/ to play with it. Below are the results.
<div id="start">
<span id="one" class="sText">Your Calculation Results is = </span>
<span id="two" class="result">
<script type="text/javascript">
var tst = 'I want the result here';
document.writeln(tst);
</script>
</span>
var bmi = weight / (heightInMeter * heightInMeter);
document.getElementById('ID_bmiResult2').innerHTML= bmi;
For calculate the bmi in javascript
<script language="javascript">
var Height = 0;
var Weight = 0;
var BMI = 0;
function getTotalBMIScore() {
Height = document.getElementById('MainContent_txtPDHeight').value;
//alert(Height + 'Height');
Weight = document.getElementById('MainContent_txtPDWeight').value;
//alert(Weight + 'Weight')
BMI = Weight / (Height * Height);
BMI = BMI.toFixed(2);
//alert(BMI + 'BMI');
document.getElementById('BMIScore').innerText = BMI;
}
</script>
// end function
// if you are taking from textbox you should use this Height(In meter):
<asp:TextBox ID="txtPDHeight" onchange ="getTotalBMIScore()" onKeyUp ="getTotalBMIScore()" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;" runat="server"></asp:TextBox>
<span>
Weight(In kg):
<asp:TextBox ID="txtPDWeight" onchange = "getTotalBMIScore()" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;" onKeyUp ="getTotalBMIScore()" runat="server"></asp:TextBox>
//if you want to display in span use this BMI:
<span id="BMIScore"></span></span><br />