Cara Membuat Daftar Dropdown di HTML Menggunakan Elemen Select
Elemen <select> di HTML memungkinkan Anda untuk membuat daftar dropdown, yang memungkinkan pengguna untuk memilih satu opsi dari daftar yang disediakan. Berikut adalah cara membuatnya:
1. Membuat Elemen <select>
Pertama, Anda perlu membuat elemen <select>. Elemen ini bertindak sebagai wadah untuk pilihan dropdown.
2. Menambahkan Opsi
Di dalam elemen <select>, Anda perlu menambahkan opsi menggunakan elemen <option>. Setiap <option> mewakili satu item di daftar dropdown.
3. Menentukan Nilai dan Teks
Atribut value dari elemen <option> menentukan nilai yang dikirimkan saat opsi tersebut dipilih. Teks yang ditampilkan di dalam dropdown ditentukan oleh teks di dalam elemen <option>.
4. Menentukan Opsi Terpilih
Anda dapat memilih opsi yang sudah terpilih saat halaman dimuat dengan menggunakan atribut selected pada elemen <option>.
5. Menambahkan Atribut Tambahan
Anda dapat menambahkan atribut tambahan ke elemen <select> untuk mengontrol tampilan dan perilaku dropdown, seperti:
name: Menentukan nama untuk dropdown, yang digunakan untuk mengirimkan nilai ke server.id: Menentukan ID unik untuk dropdown, yang digunakan untuk merujuk ke elemen tersebut dari JavaScript.disabled: Melumpuhkan dropdown sehingga pengguna tidak dapat memilih opsi.size: Menentukan jumlah opsi yang akan ditampilkan dalam dropdown.
Contoh Lengkap
Daftar Dropdown
Contoh di atas akan menampilkan dropdown dengan tiga opsi: Merah, Hijau, dan Biru. Opsi Hijau akan terpilih secara default.
Kesimpulan
Elemen <select> adalah cara sederhana dan mudah untuk membuat daftar dropdown di HTML. Anda dapat menggunakannya untuk memungkinkan pengguna memilih satu opsi dari daftar yang disediakan, dan Anda dapat mengontrol tampilan dan perilaku dropdown menggunakan atribut tambahan.