Cara Mengambil Nilai Dropdown yang Dipilih dengan jQuery

Mengetahui pilihan pengguna pada dropdown penting untuk form dinamis. jQuery menyederhanakan pengambilan nilainya. Artikel ini membahas cara mengambil nilai dropdown yang dipilih dengan jQuery.

Mengambil value dan Teks

<script>
$("#kota").val();                  // ambil value opsi
$("#kota option:selected").text(); // ambil teks opsi
</script>

Contoh Kasus: Menampilkan Ongkir Dinamis

<script>
const ongkir = { jkt: 10000, bdg: 15000 };
$("#kota").change(function() {
    const biaya = ongkir[$(this).val()] || 0;
    $("#ongkir").text("Rp" + biaya.toLocaleString("id-ID"));
});
</script>

Event change berjalan setiap kali pilihan berubah.

Mengatur Pilihan lewat Kode

<script>
$("#kota").val("bdg"); // pilih Bandung secara otomatis
</script>

Kesimpulan

Gunakan .val() untuk mengambil nilai dropdown dan option:selected untuk teksnya. Event change ideal untuk aksi dinamis seperti menghitung ongkir sesuai kota yang dipilih.

Referensi: untuk penjelasan lebih mendalam, kunjungi dokumentasi resmi jQuery (api.jquery.com).

Baca Juga

Ali Akbar

Software Developer yang fokus mengembangkan aplikasi berbasis Web dan Desktop. Senang mempelajari teknologi baru terutama di bidang web design dan web development.

View all posts by Ali Akbar →

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *