HTML datalist: Main Tips
- The HTML
<datalist>
element generates a drop-down menu with predefined options for users to select. - This element sets the options for the <input> element.
- The
<datalist>
adds the HTML autocomplete feature to the form.
![DataCamp DataCamp](https://assets.bitdegree.org/online-learning-platforms/storage/media/datacamp-logo-5f96bfc70113e.o.png)
Pros Main Features
- Easy to use with a learn-by-doing approach
- Offers quality content
- Gamified in-browser coding experience
- The price matches the quality
- Suitable for learners ranging from beginner to advanced
- Free certificates of completion
- Focused on data science skills
- Flexible learning timetable
![Udacity Udacity](https://assets.bitdegree.org/online-learning-platforms/storage/media/udacity-review-logo-small.o.png)
Pros Main Features
- Simplistic design (no unnecessary information)
- High-quality courses (even the free ones)
- Variety of features
- Nanodegree programs
- Suitable for enterprises
- Paid Certificates of completion
![Udemy Udemy](https://assets.bitdegree.org/online-learning-platforms/storage/media/udemy-logo-small.o.png)
Pros Main Features
- Easy to navigate
- No technical issues
- Seems to care about its users
- Huge variety of courses
- 30-day refund policy
- Free certificates of completion
Use of datalist
The <datalist>
tag specifies an HTML autocomplete feature to be used with a form element. An alternative element is <select>.
Example
<input list="books">
<datalist id="books">
 <option value="Fiction">
 <option value="Non-Fiction">
</datalist>
However, the discussion of <datalist>
vs <select>
should mention that the <select>
requires users to choose from the indicated options. The <datalist>
allows users to either choose from the specified answers, or to type in their original ones.
Browser support
![Browser image](https://www.bitdegree.org/learn/assets/browsers/chrome-logo.jpg)
Chrome
20+
![Browser image](https://www.bitdegree.org/learn/assets/browsers/edge-logo.jpg)
Edge
All
![Browser image](https://www.bitdegree.org/learn/assets/browsers/firefox-logo.jpg)
Firefox
4+
![Browser image](https://www.bitdegree.org/learn/assets/browsers/ie-logo.jpg)
IE
10+
![Browser image](https://www.bitdegree.org/learn/assets/browsers/opera-logo.jpg)
Opera
9.5+
![Browser image](https://www.bitdegree.org/learn/assets/browsers/safari-logo.jpg)
Safari
12.1+
Mobile browser support
![Browser image](https://www.bitdegree.org/learn/assets/browsers/chrome-logo.jpg)
Chrome
33+
![Browser image](https://www.bitdegree.org/learn/assets/browsers/firefox-logo.jpg)
Firefox
4+
![Browser image](https://www.bitdegree.org/learn/assets/browsers/opera-logo.jpg)
Opera
-
![Browser image](https://www.bitdegree.org/learn/assets/browsers/safari-logo.jpg)
Safari
12.2+