JavaScript to input data and produce results bases on input [on hold]

I need help pls....i would like to create a script that creates different results when clicking on a button bases on if statements. For example....i need to have choices bases on radio buttons so if the first button is male or female then outcome is 'a customized statement. Then I would to continue the output statement based on their age whether under or over 21 so then the statement would be changed. And also if body mass index is greater or less than a particular number then a new statement would be produced when the button is clicked. So if the choices are male, over 21 and a bmi of 120 the the outcome is 'loose weight'. Can some somebody assist with a JavaScript for this please?

Please edit the question to limit it to a specific problem with enough detail to identify an adequate answer. Avoid asking multiple distinct questions at once. See the How to Ask page for help clarifying this question. If this question can be reworded to fit the rules in the help center, please edit the question.

1 Answer
1

You can check the value of the radio button or select that was chosen to show a message. You should give the radio buttons and select options values that are easily to interpret and use in your code.

<form>
Gender:<br/>
<input type="radio" name="Gender" value="Male"/>Male
<input type="radio" name="Gender" value="Female"/>Female
<br/>
<span id="genderresult"></span>
<br/>
Body Mass Index:<br/>
<select id="bmi" onchange="showChange()">
<option value="under 18.5">&lt;18.5</option>
<option value="18.5 to 24.9">18.5-24.9</option>
<option value="25 to 29">25-29</option>
<option value="over 30">30+</option>
</select>
<br/>
<span id="bmiresult"></span>
</form>
<script>
var radioButtons = document.querySelectorAll('input[type=radio]');
var genderresult = document.getElementById("genderresult");
var bmiresult = document.getElementById("bmiresult");
radioButtons.forEach(r=>{
r.onclick = function(e){
genderresult.innerHTML = "You are "+r.value;
}
});
function showChange(){
var bmi = document.getElementById("bmi").value;
bmiresult.innerHTML = "Your body mass index is "+bmi;
if(bmi=="over 30"){
bmiresult.innerHTML += "<br/>Consider losing weight";
}
}
</script>