Monday, December 1, 2014

Tag option HTML

Tag <option> digunakan untuk membuat daftar item-item pada tag<select>, <datalist> dan <optgroup>. Tag option memiliki tag pembuka (<option>) dan penutup (</option>).

Beberapa atribut tag option:

disabled: Jika atribut ini dipakai maka pilihan daftar tidak bisa dipilih. Sebagian browser menampilkan pilihan dengan warna abu-abu, menandakan dalam kondisi tidak bisa dipilih.

label: Atribut untuk memberi kategori (label) dari daftar pilihan. Misalnya kategori buah berisi daftar; pisang, semangka, apel, jeruk dan lainnya.

selected: Atribut ini dideklarasikan untuk menentukan suatu daftar pilihan dalam kondisi terpilih.

value: Atribut ini berisi nilai dari suatu daftar pilihan yang akan disimpan ke database (jika dikombinasikan ke php). Jika tidak dideklarasikan, maka nilai defaultnya adalah teks di antara tag option.

Contoh:

<!DOCTYPE HTML>
    <html>
        <head>
            <title>Contoh tag option</title>
        </head>
    <body>
    <select>
      <optgroup label="Sayuran">
        <option value="bayam">Bayam</option>
        <option>Daun ubi</option>
        <option>Kol</option>
      </optgroup>
      <optgroup label="Buah">
        <option>Pisang</option>
        <option>Mangga</option>
        <option>Pepaya</option>
      </optgroup>
      <optgroup label="Kacang-kacangan">
        <option>Kacang hijau</option>
        <option>Kacang tanah</option>
        <option selected>Kacang kedelai</option>
      </optgroup>
      <optgroup label="Lainnya" disabled>
        <option>Lainnya 1</option>
        <option>Lainnya 2</option>
        <option>Lainnya 3</option>
      </optgroup>
    </select>
    </body>
</html>


Output:

Pilihan "Kacang kedelai" dalam posisi terpilih.
Referensi tulisan:
  1. <option>; ditulis oleh: Kontributor MDN, developer.mozilla.org, diakses 02 Desember 2014.
    About MDN by Mozilla Contributors is licensed under CC-BY-SA 2.5.

No comments:

Post a Comment