Usare il componente datalist in HTML
Vediamo molto spesso nei siti web le caselle di input che suggeriscono il valore da selezionare mentre si scrive.
Questa cosa si può ottenere in diversi modi, e dipende ovviamente anche dalla mole di dati in cui cercare, e dalle tecnologie usate.
Però HTML già prevede un componente che ci permette di ottenere questo comportomanto in maniera semplice: datalist!
Qui sotto un esempio:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>TEST</title>
</head>
<body>
<input list="libri" name="libri" id="libri_inp">
<datalist id="libri">
<option value="IT"></option>
<option value="Iceberg"></option>
<option value="Cujo"></option>
<option value="Le notti di Salem"></option>
</datalist>
</body>
</html>
Nella pagina vedrete solo una casella di input.
Se iniziate a scrivere vedrete una tendina con tutti i valori simili a quello che state cercando.
Enjoy!
html datalist
Commentami!