Komponen Data List - Catatan Faiq Hisyam Marwan

Contact Form

 

Komponen Data List

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>
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>

Total comment

Author

Faiq Hisyam Marwan

0   comments

Cancel Reply