Creating a HTML drop-down list

2021 Oct 01

Inorder to create a drop-down selection list in HTML, we must first understand why they are important.
Drop-down lists can be used in lots of ways, from creating a way for people to chose from a strict set of options, to making an on-off switch(even though you should use buttons for that)
Before we start, here is an example:

Select Image:

Images from Wikipedia, on Oct. 2nd & 1st, 2021

For some weird reason, it's not in

<input>

It has it's own tags, know as <select> and <option>. Using these is alittle like making a list, if you've ever made one. Here's an example bit of HTML.

</select>

Next we want to add values to <options>, and an id(#) to <select>.
You most-likely already know how to do ids, and maybe also values(if you have used input in any way), so I'll leave it up to you.
However, you may not know some things that could be useful here, such as preselections, or making things update upon being changed, well, you can do preselections with selected in the <option> that you want to be preselected. Changes done the page upon the change of the selection in the drop-down(or anything else that can be changed by the user) is onchange="submitFunction()" being placed in the <select>.
Let's check back on the code that we made at the code example:

</select>

Inorder to access the selected option with JavaScript, use document.getElementById("selection").value
That's basically it, feel free to CTRL + C CTRL + V it. /s