Membuat ComboBox Dinamis yang saling Berhubungan

Kali ini mau berbagi sedikit mengenai ComboBox yang saling berhubungan antara satu dengan yang lain. Misalkan ada dua combobox yaitu combobox propinsi dan kota, apabila dipilih propinsi Jawa Tengah,  maka yang tampil pada combobox kota hanyalah daftar kota-kota yang berada di Jawa Tengah saja, seperti Semarang, Magelang, dll, intinya yang termasuk kedalam provinsi Jawa Tengah saja yang akan ditampilkan. Kegunaan utama fitur ini adalah agar tidak terjadi kesalahan input data.

1. Pertama buat dulu database beserta tabelnya, berikut struktur tabel didalamnya. Pada kasus ini saya buat database dengan nama oop dan didalamnya ada 2 tabel propinsi dan kota yang mana saling berhubungan. Setelah itu inputkan data melalui phpmyadmin pada tabel provinsi dan tabel kota .
2. Siapkan plugin jquerynya bisa didownload disini .
3. Kalau sudah siapkan text editornya dan mulai ngoding.
4. Langkah pertama buat file dengan nama misal provinsi.html, lanjut sisipkan plugin jquery nya dulu , seperti dibawah ini


 5. Kemudian buat form combobox untuk provinsi dan kota

6. Setelah itu masukan script pemrosesan ajax didalam tag <head> agar combo box saling berhubungan. Seperti dibawah ini.


7. Kemudian buat file php dengan nama cek_kota.php untuk mengambil kota berdasarkan provinsi yang dipilih



 8. Langkah terakhir silahkan run file file provinsi.html melalui server lokal masing-masing, jika berhasil ketika pilih provinsi jawa tengah maka akan muncul kota yang termasuk di Jawa Tengah, demikian yang lainnnya.




Demikian semoga bermanfaat, CMIIW.


7 blogger-facebook

saya mau tanya jquery yg dipakai harus --> jquery-1.8.0.min.js atau versi berapa??

saya mau tanya jquery yg dipakai harus --> jquery-1.8.0.min.js atau versi berapa??

tidak mbak boleh pake versi yang lain

saya menggunakan scrit diatas, yang jadi masalah sekarang adalah ketika, kita pilih provinsi pertama dan kota sudah dipilih juga, apabila kita ganti provinsi untuk pilihan kota yang kita pilih pertama tidak terganti lagi dengan Pilih Kota, tapai tetap di kota di profinsi yang pertama

mau tanya gmana kalo pilih combonya langsung muncul fieldnya

Maaf nih mas, kalo pake Script ini yg terambil saat POST id prov dan id kota bukan nama prov dan kotanya, karena value optionnya id prov dan id kota, gimana supaya yg POST terambil nama provinsi dan kota sesuai dengan option yg tampil. Tanpa perlu query lagi dr sql. Makasih

Tinggal diganti aja mas value nya yang ambil dari database dengan nama provinsi


EmoticonEmoticon