Komponen datalist
Komponen datalist merupakan elemen
form baru pada HTML5. Datalist digunakan untuk membuat daftar list. Komponen
datalist memberikan dukungan autocomplete dasar untuk pilihan pada field input.
Komponen datalist merupakan pengabungan antara list dan field input dengan
atribut autocomplete. Saat membuat pilihan
pada datalist, bila terdapat huruf/item yang sama dengan data pada data list maka akan muncul item
yang cocok (fungsi autocomplete bekerja).
Format umum Penulisan komponen
datalist adalah sebagai berikut :
<input list="list">
<datalist id="id">
<option value="nilai1">
<option value=" nilai2">
<option value=" nilai3">
</datalist>
<datalist id="id">
<option value="nilai1">
<option value=" nilai2">
<option value=" nilai3">
</datalist>
Berikut ini adalah contoh penggunaan
dari komponen input datalist
<!DOCTYPE
html>
<html>
<body>
<form
action="demo_form.asp" method="get">
<input
list="browsers" name="browser">
<datalist
id="browsers">
<option
value="Internet Explorer">
<option
value="Firefox">
<option
value="Chrome">
<option
value="Opera">
<option
value="Safari">
</datalist>
<input
type="submit">
</form>
</body>
</html>