HTML Form Select Tags

The select tag is an HTML element that allows you to create a dropdown list of options within a form. The option tag is used to define the options within the dropdown list. Here’s an example of how to use the select tag:

<form action="/submit-form" method="post">
  <label for="country">Select a country:</label>
  <select id="country" name="country">
    <option value="usa">United States</option>
    <option value="canada">Canada</option>
    <option value="mexico">Mexico</option>
  </select>
  
  <button type="submit">Submit</button>
</form>

In this example, we’re creating a dropdown list of countries. The select tag contains three option tags, each with a value attribute that specifies the value that will be submitted to the server if the user selects that option. The text between the option tags is the text that will be displayed to the user in the dropdown list.

The id attribute of the select tag is used to uniquely identify the dropdown list, and the name attribute specifies the name of the dropdown list, which will be used to retrieve the selected value on the server.

You can also add the multiple attribute to the select tag to allow the user to select multiple options from the dropdown list, like this:

<form action="/submit-form" method="post">
  <label for="fruits">Select your favorite fruits:</label>
  <select id="fruits" name="fruits" multiple>
    <option value="apple">Apple</option>
    <option value="banana">Banana</option>
    <option value="orange">Orange</option>
    <option value="grape">Grape</option>
  </select>
  
  <button type="submit">Submit</button>
</form>

In this example, the multiple attribute has been added to the select tag, allowing the user to select multiple options. The selected options will be submitted as an array of values to the server.

Wordpress Social Share Plugin powered by Ultimatelysocial
Wordpress Social Share Plugin powered by Ultimatelysocial