Drop down menu WordPress widget - php

Question

<form id="promacform" onsubmit="return protein_calculator(this);" method="post">
Weight: <input type="text" name="protein_weight" id="protein_weight" size="5"; /> lbs.<br />
Activity level (1.1-1.4): <input type="text" name="protein_activity" id="protein_activity" size="5"; /> <br />
<br><input type="submit" name="submit" id="submit" value="Calculate" /><br />
<div id="protein_result"></div>
</form>
Im trying to add a drop down menu for the activity level which will have 4 options:
Lightly active (moderate exercise but sedentary job)
Moderately active (intense exercise but sedentary job)
Very active (moderate exercise and active job)
Extra active (intense exercise and active job)
im not quite sure how to set it up, because the way it is set up now the user has to input a number ranging from 1.1-1.4(activity level range) and from there it calculates it.

Answer 1

From my comment, you presumably want just this:
<label>Activity level
<select name="protein_activity">
<option value="1.1">Lightly Active</option>
<option value="1.2">Moderately Active</option>
<option value="1.3">Very Active</option>
<option value="1.4">Extra Active</option>
</select>
</label>
Another possibility you may be interested is a range slider, but you would have to modify your PHP side to accommodate that the form would send from 1-4 instead of 1.1-1.4 but it might add a user experience. This is just a quick and dirty example of a range. Note range is only available in HTML5:
<style>
input[type=range] {
width: 300px;
}
ul.ranger {
width: 300px;
display: table;
list-style: none;
margin: 0;
padding: 0;
}
ul.ranger li {
display: table-cell;
text-align: center;
width: 75px;
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
padding: 0;
}
ul.ranger li:last-child {
text-align: right;
}
ul.ranger li:first-child {
text-align: left;
}
</style>
<form>
<input type="range" min="1" max="4" value="2" id="slider" name="protein_activity">
<ul class="ranger">
<li>Light</li>
<li>Moderate</li>
<li>Heavy</li>
<li>Extreme</li>
</ul>
</form>