Dropdown list is a must!

[oldoc63]

Radio buttons are great if we want our users to pick one option out of a few visible options, but imagine if we have a whole list of options! This situation could quickly lead to a lot of radio buttons to keep track of. An alternative will be something like this:

<form>
  <label for="lunch">What's for lunch?</label>
  <select id="lunch" name="lunch">
    <option value="pizza">Pizza</option>
    <option value="curry">Curry</option>
    <option value="salad">Salad</option>
    <option value="ramen">Ramen</option>
    <option value="tacos">Tacos</option>
  </select>
</form>

[oldoc63]

Notice in the code that we’re using the element to create the dropdown list. To populate the dropdown list, we add multiple elements, each with a value attribute. By default, only one of these options can be selected.

oldoc63 commented 2 years ago

The text rendered is the text included between the opening and closing

tags. However, it is the value of the value attribute that is used in

submission (notice the difference in the text and value capitalization). When the is submitted, the information from this input field will be sent using the name of the

and the value of the chosen . For instance, if a user selected Pizza from the dropdown list, the information would be sent as "lunch=pizza".

[oldoc63]

The text rendered is the text included between the opening and closing

tags. However, it is the value of the value attribute that is used in

submission (notice the difference in the text and value capitalization). When the is submitted, the information from this input field will be sent using the name of the