12 Apr 10 Teknik Bertingkat Membuat Combo Box
Teknik bertingkat membuat combo box dimaksud adalah bagaimana kita membuat sebuah combo box yang datanya dipengaruhi oleh pilihan dari combo box sebelumnya.
Ilustrasinya sebagai berikut:
Combo box pertama: Berisikan data nama-nama provinsi
Combo box kedua: Berisikan data nama-nama kota, dimana data kota ini tergantung dari pilihan data propinsi pada combo box pertama.
Adapun langkah-langkahnya sebagai berikut:
1. Buat index.php sebagai berikut:
2. Tambahkan Script JS ini dan letakkan di atas </body>
3. Kemudian perhatikan pada code: document.getElementById(“divkedua”).innerHTML = xmlhttp.responseText;, nah itu adalah lokasi tempat penyimpanan hasil eksekusi pada combo box pertama tadi yaitu di dalam tag dengan id=divkedua.
nah di bawah </select> tambahkan <div id=”divkedua”></div>
4. Kemudian perhatikan pada code: xmlhttp.open(‘get’, ‘ambildata.php?kode=’+kode, true);, nah itu adalah sebuah file ambildata.php yang isi dari file tersebut adalah combo box kedua yang nilai datanya dipengaruhi oleh nilai dari combo box pertama dengan menggunakan perintah ?kode=nilai_combo_box_pertama
5. Kemudian buat file ambildata.php sebagai berikut:
6. Selesai
Demikian langkah-langkah pembuatan combo box bertingkat, pada contoh ini kita hanya menerapkan dua combo box. Untuk membuat lebih dari dua, kuncinya pada:
function rubah(combobox)
id=divkedua
ambildata.php
Anda bisa menggunakan database untuk mengambil nilai data dari combo box tersebut, Selamat mempelajari…
Tulisan yang mungkin se-ide
Reader's Comments
Leave a Comment
Community
wah mantep gan, langsung ke tkp, gue coba nie…, mumpung ada ilmu gratis…hehehe
Thanks gan…
Kalau nglihat script seperti itu kok pusing ya mas, tapi sy suka experiment dg ilmu baru kayak gini. Makasih banget dah sharing
Boleh di record ya sementara ini belum memerlukan mungkin lain waktu i will be back to you, thanks
Kunjungan rutin sambil belajar, thx infonya sob, ditunggu kunjungan dan saran-saran untuk blogger pemula ini hiks hiks .. thx
WAduh…klo pke JS saya jadi bingung. kagak ngerti sintaxnya soalnya
Wah ternyata gampang ya?
terima kasih infonya sob ane mo coba dulu ya
info yang menarik master, sy akan coba di WP saya…yupz…berkunjung balik yah
nice post, sayang nya saya blogger dummy, gak bisa terapin ilmunya master….tapi nnt dech saya mau coba beli host n domain yg lebih OK..he..he..
Salam hangat Extreme Webz
langsung d praktekkan mas,,, makasih
mantab nih tutorialnya. ntar tak coba gan.
oke langsung di coba brother … doain berhasil ya …
cari waktu buat nyoba ah.. maklum harus konsentrasi..
salam kenal gan… makasih atas tutornya
Sama kaya bro @Jual Pulsa Elektrik, klo urusan coding ane juga mumet kang.. ampun dah
wah ane agak sedikit pusing neh,,,hehehe,,maklum masih belajar,,tapi makasih bos ilmune,,sapa tau aja ntar ane bisa praktekin
Hebat sekali Gan.
Ane akan cuba praktekin. Makasih.
informasi mantep.Bro..Harusnya setiap hari saya kunjungi Blog ini..thanks yach
Makasih infonya, jadi tertarik nih…
thanks infonya mas. Saya banyak belajar dari blog anda
ga mudeng.
hembbb…..makasih mas infonya ..
membantu banget..
boleh juga tuh tutorialnya..
Thanks atas info nya
ko gambarnya ga bisa diliat ya