Membuat dropdown berantai

Membuat dropdown berantai

2083
17
SHARE

Halo kawan..akhirnya ada waktu buat nulis juga.. hehe. Kali ini saya akan menulis sesuatu yang (mungkin) pernah menjadi pertanyaan bagi semua orang yang belajar pemrograman. Yaitu membuat select / dropdown berantai.

select berantai

Jadi misalnya di droddown pertama berisi nama provinsi, kemudian droddown kedua berisi kota dan droddown ketiga berisi kecamatan. Misalnya pengguna memilih provinsi Jawa Barat, maka kota yang muncul pada droddown kedua hanya kota yang ada di jawa barat. Demikian juga misalnya pengguna memilih kota Bandung, maka yang muncul pada droddown kecamatan hanya kecamatan yangย  ada di Bandung.

Membuat dropdown berantai

Biar tidak penasaran baiklah langsung saja kita mulai membuatnya.
Oia lupa, sebelum membuatnya anda memerlukan jquery-1.10.2.min.js dan jquery.chained.min.js (Copyright 2010-2013 Mika Tuupola) – anda dapat mendownloadnya di akhir artikel ini.

Step 1 : Buatlah database dan tabel provinsi, tabel kota dan tabel kecamatan. Kemudian isikan juga data dalam tabel-tabel tersebut. (anda dapat mendownload database di akhir artikel ini).

Step 2 : Buatlah file select.php dengan kode sbb :

Step 3 : Jalankan select.php melalui browser anda dengan mengetikan http://localhost/folderprojectanda/select.php. Bila tidak ada kesalahan akan muncul 3 dropdown seperti gambar di awal artikel ini. Cobalah untuk memilih provinsi, kota dan kecamatan.

Bagaimana mudah bukan. Biar tidak capek nulis ini silahkan di download source code melalui link di bawai ini.

DOWNLOAD

Anda dapat membuat select berantai hingga banyak level. Misalnya dari kecamatan nanti ada dropdown lagi RW, kemudian dropdown RT, nomor rumah dst.. hahaha. Jangan lupa komentarnya ya. Terima kasih telah mengunjungi harviacode.com

Bagikan artikel ini ya.. terima kasih

17 COMMENTS

  1. mas mau nanya itukan comboxbox bertingkat, jika diakhir combobox bertingkat dikombinasikan dengan textfield otomatis gimana ya?…

  2. Hai mimin Harviacode. Perkenalkan saya Kresna. Saya senang sekali mimin membagikan ilmu tentang php. Saya harap mimin dan timnya lebih sering sharing ilmu nya di blog ini. Saya menjadikan website ini sebagai salah satu pembelajaran saya khususnya framework CodeIgniter.

    • hallo mas Kresna.. terima kasih sebelumnya. dan mohon maaf ini jarang update artikel karena saya bekerja sendiri dan saat ini lagi banyak urusan.. terima kasih. ๐Ÿ™‚

    • wah.. harus menyesuaikan koding worpressnya dan itu tidak mudah gan karena banyak yang harus diubah. Saran saya mending pakai plugin yang khusus buat WP aja, biasanya ada.

    • lah kok bisa hahaha… coba di cek kembali querynya mas.. cek jg id / class select nya. pastikan sesuai dengan yang ada di javascriptnya.

LEAVE A REPLY