Tag datalist digabung dengan tag <input> dengan atribut list (daftar) pilihan. Nama atribut list pada tag input menjadi nilai id pada tag datalist. Untuk isi daftar dimuat dalam tag <option> dengan atribut value. Hampir sama dengan dengan ketika Anda membuat daftar dengan tag <select> dengan atribut name dan tag option untuk menampung data daftar.
datalist.html
<!DOCTYPE HTMl>
<html>
<head>
<title>Tag datalist HTML5</title>
</head>
<body>
<div>Dari mana Anda berasal:</div>
<input list="kota" />
<datalist id="kota">
<option value="Medan">
<option value="Bandung">
<option value="Jakarta">
<option value="Palembang">
<option value="Padang">
<option value="Malang">
<option value="Madura">
<option value="Madiun">
<option value="Batu">
<option value="Blitar">
<option value="Nganjuk">
<option value="Nabire">
<option value="Pekanbaru">
<option value="Pontianak">
<option value="Pekalongan">
<option value="Riau">
</datalist>
</body>
</html>
^Baca juga: Tag <dl>, <dt> dan <dd> untuk membuat daftar kata istilah dan penjelasannya.
Referensi tulisan:
- <datalist>; ditulis oleh: Kontributor MDN (Mozilla Developer Network), developer.mozilla.org, diakses 09 Oktober 2014.
About MDN by Mozilla Contributors is licensed under CC-BY-SA 2.5.
No comments:
Post a Comment