I made a form in HTML and am trying to calculate the entered data using JS. When I hit submit on the form VSC shows that my onclick function and the function it is calling are undefined. This was working earlier but now isn't.
<input name="calculate" type="submit" value="Calculate BMR" onclick="formdata()">
<script>
function formdata(){
var getSystem = document.getElementById("system");
var system = getSystem.option[getSystem.selectedIndex].value;
var getGender = document.getElementById("gender");
var gender = getGender.option[getGender.selectedIndex].value;
var age = document.getElementById("age").value;
var weight = document.getElementById("weight").value;
var height = document.getElementById("height").value;
var bmr;
if (system=="imperial") {
if (gender=="male") {
bmr = 66 + ( 6.2 * weight) + ( 12.7 * height) - ( 6.76 * age);
}
if (gender=="female") {
bmr = 655 + ( 4.35 * weight) + ( 4.7 * height) - ( 4.7 * age);
}
}
if (system=="metric") {
if (gender=="male") {
bmr = 66.5 + (13.75 * weight) + (5.003 * height) - (6.755 * age);
}
if (gender == female) {
bmr = 655.1 + (9.563 * weight) + (1.850 * height) - (4.676 * age);
}
}
document.writeln("<h1> BMR Calculated!<h1><br>");
document.writeln("<hr>");
document.writeln("Gender: " + gender +"<br>");
document.writeln("Age: " + age +"years<br>");
document.writeln("Height: " + height +"cms<br>");
document.writeln("Weight: " + weight +"kg<br>");
document.writeln("BMR: " + bmr.toFixed(2) +"kCal<br>");
}
</script>
All the other variables are sourced from the rest of the form. But the submit button just won't work in the first place