Membuat Optional Data dari Banyak Data

Sesuai janji saya, di artikel ini saya akan jelaskan bagaimana membuat optional dengan banyak data. Pada artikel sebelumnya tentang membuat optional kita hanya bisa menggunakan sedikit data saja. Paling 3-4 data aja sudah tergolong banyak nantinya. Biasanya sih dua data yaitu jenis kelamin hehehe..
Nah, bagaimana kalau pilihannya ada banyak, misalnya propinsi atau nama negara gitu, maka kita memerlukan optional dalam bentuk drop down. HTML menyediakan tag untuk menampilkan optional dalam bentuk dropdown dengan format seperti ini:

<select name="NAMA_FIELD">
  <option value="VALUE-1">LABEL-1</option>
  <option value="VALUE-2">LABEL-2</option>
  <option value="VALUE-3">LABEL-3</option>
  <option value="VALUE-4">LABEL-4</option>
  ......
</select>

Kita menggunakan tag select untuk membuat dropdown option. Dan untuk menampilkan opsi-opsinya, kita menggunakan tag option. NAMA_FIELD sebagaimana telah dijelaskan dalam membuat input data, berguna untuk mengidentifikasi nama data yang dikirimkan.
VALUE-1 sampai VALUE-4 dan seterusnya kita pakai untuk memberi isi datanya jika pengguna memilih label tersebut. Misalnya pengguna memilih LABEL-4, maka data yang dikirimkan adalah VALUE-4. VALUE dan LABEL bisa dibuat sama atau berbeda-beda terserah anda.
Untuk tanda titik-titik itu tambahan yang menunjukkan dst, jadi jangan diketik titik-titik gitu ya hehehe…

MULTIPLE OPTION

Selanjutnya bagaimana kalau kita ingin pengunjung bisa memilih lebih dari satu option, maka tag select ini kita tambahkan atribut multiple. Contohnya seperti ini:

<select name="NAMA_FIELD" multiple="multiple" size="2">
  <option value="VALUE-1">LABEL-1</option>
  <option value="VALUE-2">LABEL-2</option>
  <option value="VALUE-3">LABEL-3</option>
  <option value="VALUE-4">LABEL-4</option>
  ......
</select>

Pada kode diatas, saya tambahkan dua atribut baru yaitu multiple="multiple" size="2". Multiple dipakai untuk menunjukkan bahwa opsi ini bisa dipilih lebih dari satu. Untuk memilih lebih dari satu, user cukup menekan tombol Ctrl dan klik opsi yang diinginkan. Bagi pengguna Machintos, klik Command Button-nya.

Atribut size adalah jumlah opsi yang dimunculkan. Defaultnya kan cuma 1 aja. Nah, biar pengguna tahu kalau ini multiple option, maka kita tampilkan lebih dari 1, misalnya 2. Tapi kalau opsinya banyak saya sarankan lebih dari 2 yang dimunculkan.

Tweet