DEV Community

Charity Parks
Charity Parks

Posted on

HTML dropdown boxes explained

Inside of a form that you are collecting user data, you may find the need to use a dropdown box. This is where you want the user to only be able to select one of the options that are provided.

Dropdown boxes in HTML are created inside a <form> with a <select> element. The <select> element is what creates the dropdown list box. <select> has attributes such as 'name'. Without the name attribute nothing would show up inside the dropdown list. Inside of the 'select' element use the <option> element. Its used to give the user the choices (options) to choose from in the dropdown box. Use 'value' element is used inside the 'select' element and it indicates what is being sent to the server along with the 'name'.

Example:

<form action="http://www.123example.com/profile.php">
<p>Which state is your favorite?</p>
<select name="states">
<option value="california">California</option>
<option value="maine">Maine</option>
<option value="texas">Texas</option>
<option value="florida">Florida</option>
</select>
</form>

Happy Coding!

AWS Security LIVE!

Join us for AWS Security LIVE!

Discover the future of cloud security. Tune in live for trends, tips, and solutions from AWS and AWS Partners.

Learn More

Top comments (0)

Billboard image

Create up to 10 Postgres Databases on Neon's free plan.

If you're starting a new project, Neon has got your databases covered. No credit cards. No trials. No getting in your way.

Try Neon for Free →

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay