Studi Kasus : Membuat form combobox dengan isian dinamis dari database (mysql)
Kebutuhan : Webserver Packages, already installed.

Combobox merupakan salah satu element form yang sering digunakan dalam aplikasi – aplikasi pendaftaran, pada umumnya combobox digunakan untuk memilih salah satu option dimana terdapat banyak option yang ada. Value dalam combobox sebenarnya dapat ditulis langsung dalam html, namun, bagaimana jika data yang ingin ditampilkan sangat banyak atau tergantung pada kondisi tertentu?
Misalkan, kita ingin menampilkan pilihan kota – kota yang ada dalam negara Indonesia, maka kota yang ditampilkan juga merupakan kota yg berada dalam Indonesia.
Misalkan, user ternyata berasal dari Inggris, maka kota yang ditampilkan juga merupakan kota yg berada dalam negara Inggris.

Kita memerlukan combobox dinamis.

Ok, langsung praktik saja.

Step 1 : Persiapkan Database

  1. Buat database dengan nama db_tutorial
  2. Siapkan tabel dengan nama tb_kota, dengan struktur tabel seperti gambar dibawah ini.
  3. Insert kan beberapa sample data, seperti gambar dibawah
  4. Done!

Step 2 : Persiapkan Folder Kerja

  1. Buat folder dengan nama tutorphp dalam document root anda
  2. Simpan semua file dalam tutorial ini dalam folder tersebut.

Step 3 : Membuat script koneksi ke Database

  1. Ketikkan script berikut,
    <?php
    $host = "localhost";
    $user = "root";//adjust according to your mysql setting
    $pass = ""; //adjust according to your mysql setting, i use no password here
    $dbName = "db_tutorial";
    mysql_connect($host, $user, $pass);
    mysql_select_db($dbName)
    or die ("Connect Failed !! : ".mysql_error());
    ?>
    
  2. simpan dengan nama connect.php

Step 4 : Membuat form combobox dinamis

  1. Ketikkan script berikut,
    <form name='form' method='post' action='prosescombo.php'>
    <h3> Choose Your City</h3>
    <select name="kota">
    <option value=0 selected>- city -</option>
    <?php
    include 'connect.php';
    $q = mysql_query("select * from tb_kota where negara = 'Indonesia' "); //choose the city from indonesia only
    
    while ($row1 = mysql_fetch_array($q)){
      echo "<option value=$row1[kota]>$row1[kota]</option>";
    }
    ?>
    </select>
    <input type="submit" name="submit" value="Submit">
    </form>
    
  2. simpan dengan nama formcombo.php

Step 5 : Membuat menampilkan pilihan

  1. Ketikkan script berikut,
    <?php
    $kota = $_POST['kota'];
    
    	if ($kota == '0') {
    		echo "anda belum memilih";
    	} else
    		echo "anda memilih ".$kota;
    ?>
    
  2. simpan dengan nama prosescombo.php

Step 6 : Testing Code

  1. Pergi ke http://localhost/tutorphp/formcombo.php. Anda akan melihat form seperti dibawah. Pilih salah satu option (Disini saya memilih Solo)
  2. Klik Submit dan anda akan melihat hasilnya

OK. Haaaaaaaapppy Coding! :D
Hal yang juga menarik:

Hak Cipta

Semua skrip dan teknik dalam artikel di itx.web.id boleh digunakan sebagaimana kehendakmu tanpa perlu mencantumkan sumber. Kamu tidak boleh mengkopi seluruh artikel, dalam Bahasa Indonesia ataupun diterjemahkan ke dalam bahasa lain.

Pencarian ke sini:

combo box, menampilkan isi database ke combobox php, membuat list otomatis muncul data dari database basis web, menampilkan data ke combobox php, menampilkan data di database tampil di combo dengan nama ikan sama di java, menampilkan data dari database record nya sama ke combobox di java, menampilkan data dari database ketika jcombo dipilih pada java, memunculkan nim saat memilih nama di php, membuat select dan input data isi otomatis, membuat pilihan pada form pengisian dengan database dari database php, membuat pilihan cetak data atau tidak dengan php, Membuat input data dengan php pdf, update combobox otomatis setelah melakukan penyimpanan di delphi 7, menampilkan record database di combobox dengan 1 nama mewakili semua, teknik select di php, source combo box php, solusi search select option di php, seleksi data yang akan ditampilkan di yii, script penyimpanan data menggunakan combobox dinamis, script list menu lalu muncul otomatis harga di textbox php.

Related Articles:

: PHP

About the author

obviously, a girl. with sweet smile, off course. turning her 21 years trapped on Informatics departement and just started to having some crush with it lately. she uses wordpress. she loves php. she lo

33 Comments

  • Wanrushdi says:

    Saya dari Malaysia, telah lama saya ikuti artikel di itx ni, semua coding yg di bagi sukses….. tapi yang saya masih ngak faham dan langsung ngak berjaya bila saya mahu buat coding tu di komputer pelayan (maksudnya bukan di localhost), boleh bapa bimbing saya?

    • itx says:

      perbedaan mendasar terletak di nama folder.
      misalnya di localhost: E:\namafolder\
      kalau di server : /home/namauser/public_html/

  • dedi says:

    nama saya dedi, Studi Kasus : Membuat form combobox dengan isian dinamis dari database (mysql) sangat berguna bagi saya, saya sebagai pemula mengucapkan terima kasih.
    setelah saya coba, saya bisa memilih nama kota dan menampilkan nama kota.
    Namun untuk nama kota yang menggunakan spasi / terdiri dari 2 kata misalnya Balik Papan,
    ketika saya memilih kota “Balik Papan”, kemudian saya tekan tombol submit, outputnya hanya mencetak : “Balik” / hanya tercetak satu kata, sedangkan kata sesudah spasi tidak tercetak, untuk itu mohon penjelasan bagi yg sudah mahir php, bagaimana untuk mencetaknya secara utuh, terima kasih sblmnya…. :roll:

  • dedi says:

    nama saya dedi, Studi Kasus : Membuat form combobox dengan isian dinamis dari database (mysql) sangat berguna bagi saya, saya sebagai pemula mengucapkan terima kasih.
    setelah saya coba, saya bisa memilih nama kota dan menampilkan nama kota.
    Namun untuk nama kota yang menggunakan spasi / terdiri dari 2 kata misalnya New York,
    ketika saya memilih kota “New York”, kemudian saya tekan tombol submit, outputnya hanya mencetak : “New” / hanya tercetak satu kata, sedangkan kata sesudah spasi tidak tercetak, untuk itu mohon penjelasan bagi yg sudah mahir php, bagaimana untuk mencetaknya secara utuh, terima kasih sblmnya…. :roll:

  • kiki says:

    Saya mau tanya mas,,
    bagaimana cara memasukkan data kedalam combo box, yang apabila di inputkan dari link yang lain,,
    contohnya :
    saya menginputkan nama makanan “nasi goreng” dari link 1, setelah saya klik tombol input, secara otomatis nama makanan “nasi goreng” tadi secara otomatis langsung masuk ke dalam combo box di link 2, dan masuk juga ke dalam database nya.
    tolong dong mas,, bagaimana caranya,,,
    saya udah mencari ke forum2 php, tp tak kunjung ada jawabannya..
    saya berharap sekali pertanyaan saya dijawab,,,
    sebelumnya saya ucapkan terima kasih,,,

    • rizky maulana says:

      mba buat insert into nya dulu biar masuk ke database selanjutnya mba tinggal panggil dari database buat di link1 ata link 2 nya..

  • Indra says:

    Dear mass,

    saya mo tanya…..
    sebelumnya saya ucapkan terima kasih untuk solusinya,saya sudah bisa memasukan data combobox secara otomatis dari database,akan tetapi saya ada permasalahan kembali….
    saya ingin memunculkan data dari combobox tersebut ke dalm text box, contohnya begini mass…
    misalnya data yang ada di text box saya tersebut berisi value kode.nah ketika saya select nilainya akan muncul secara otomatis di text boxnya seperti untuk type or nama barangnya…..
    saya sudah mencoba menggunakan combobox dinamis with ajax….tapi tetap tidak muncul..

    Mohon bantuan dan sarannya ya mass…….. (worship) (worship)

    thanks a lot.

  • ibnu says:

    Bos itx,

    thank you atas sourcecode combobox dinamisnya. Namun saat ini ada kebutuhan untuk membuat combobox pilihan dengan jumlah record yang sangat banyak (mencapai puluhan ribu record) dalam satu field yang akan diletakkan pada satu combo box.

    Oleh karena itu, maka perlu dibuat combobox seperti pada Searching by keypress oleh pencari seperti mencari seseorang di facebook. Setiap kata yang diketik pada combobox langsung melakukan filter/seleksi yang bersesuaian (perintah LIKE?) antara kata yang telah diketik dengan record yang bersesuaian.

    Bisa bantu kode nya Bos itx?

    Regards,

    Ibnu.

  • deny agustian says:

    Sy punya pengalaman sama ky mas Dedi, ketika memilih data dari combo box yg lebih dari satu kata, misalnya “New York”, setelah di klik submit, maka data yg tersimpan di database cuma satu kata aja : “New”, sedangkan kata setelah spasi tidak tersimpan di database. tolong pencerahannya dong master ix….butuh banget neh…….

  • Adi Saputra says:

    Artikel yang sangat membantu..
    terima kasih..

    tukeran link ya gan..
    http://tuto-rial.com/
    salam

  • wahyu says:

    sangat membantu, tapi jika untuk menampilkan negaranya hampir sama kan caranya? tp hasilnya yg muncul indonesia 2x dan amerika jg 2x, bagaimana caranya biar yang di combobox cm mcl 1x ? :wink:

  • NurJay says:

    contoh pada database mahasiswa : misaal sy punya tabel mahasiswa, krs, dosen, mata kuliah,dll. form input mahasiswa menyimpan data mhs, form dosen utk dosen, dst.
    form krs, berisi nim, nama, jurusan, mata kuliah, dosen. tabel krs terkoneksi dengan tabel mhs, dosen, matakuliah.
    pertanyaan sy:
    - karena data saya suda terinput pada form mahasiswa maka, jika saya akan mengisi form krs, maka jika saya menginput nim sya , maka data nama dan jurusan saya akan muncul otomatis form, jadi kita tinggal input data matakuliah dan dosen yang masih kosong/ akan dipilih. mohon solusinya.. trims sblmnyahttp://itx.web.id/wp-includes/images/smilies/wink.gif

  • fil says:

    (heart) sis, ajarin donk combobox dinamisnya kok di xampp gak bisa ya..
    pliss..
    aq mau buat pilihan negara trus tampil kota2nya tp gak sukses tuh gimana ya ajarin dooonk..

  • widhi says:

    dah dicb kode diatas n sukses running gan.
    tp ada yg ingin sy tanyakan: ;-)
    kode diatas, nyarinya kan berdasarkan negara yg langsung ditulis discriptnya pake indonesia.
    nah kalo nama negaranya kita buat pake combobox (diinput secara manual pake script aja kemudian dicombobox yg kedua langsung tampil nama kotanya kl combobox yg pertama diklik nama negaranya), gmana scriptnya gan (jd ada 2 combobox)???

    mohon sharingnya :-)

  • jouleea says:

    mas, punya contoh ga untuk kasus saya berikut :
    1. saya punya tabel barang
    2. kemudian ada menu tampilan untuk menampilkan data – data barang dan di sebelahnya ada cekbox
    3. jika saya memilih dengan acak, kemudian submit, maka pilihan2 yg saya cek terinsert ke tabel gudang_stok

    mohon pencerahannya,
    kl yang delete multiple saya udah coba berhasil, tp untuk insert belum berhasil….
    :oops: :oops:

  • baharsan says:

    makasih infonya bro…thanks ya… bermanfaat banget… :)

  • Massol says:

    Okelah gan, mantep tutorialnya. Hatur Tengkyu (dance)

  • Aba Vernandez says:

    Makasih banyak ya gan, ini berarti buat sy yg masih pemula. semoga amal kebaikannya di balas dengan yang lebih baik oleh 4JJI SWT. Amiiinn… Saya selalu mengikuti setiap materi dari sini krn saya dapat paham dengan cepat di situs ini. Makasih.. ya…!

  • sudana says:

    mas klo mau memunculkan yang amerika scriptnya gmn ngeloopingnya?
    jadi yg atas combobox untuk negara indonesia dan bawahnya combobox untuk amerika.. ;)

  • Hi! Would you mind if I share your blog with my zynga group? There’s a lot of people that I think would really appreciate your content. Please let me know. Cheers

  • Hey! I could have sworn I’ve been to this blog before but after reading through some of the post I realized it’s new to me. Nonetheless, I’m definitely happy I found it and I’ll be book-marking and checking back frequently!

  • Muhamad says:

    Terima kasih atas penjelasannya , sangat membantu , memang hal kecil sederhana jika belum tahu akan menjadi hambatan besar

  • khoiron says:

    misal untuk coding edit, cara manggilnya gmn mas kalau inputannya milih dari data base di atas

  • muhammad abdul azis says:

    mas kalau program dijava gimana untuk menampilkan otomatis ketika diklik combobok?terimakasih mas

  • aspandi says:

    Mohon pencerahannya mas, Saya membuat form edit, lalu saya memanggil dan menampilkan daftar nama yang ada di database dalam bentuk combo box., gimana caranya agar ketika salah satu data di-klik (data yg ingin di edit) dan record nama dari data yg ingin di edit tersebut otomatis ter-select ? (dalam kasus combo box)

  • rendih says:

    mau tanya kalau mau menampilkan atau memanggil data yang udah tampil di list menu kemudian ditampilkan di listmenu selanjutnya dan sampai ke textfield atau textarea..
    terus gimana cara buat field jadi autonumber contoh nya (Kd_001) dan seterusnya
    php saya menggunakan dreamweaver ..
    mohon pencerahaannya..soal ya udah 1 minggu belum ketemu2 juga kalau bisa kasih link download nya bentuk pdf ATAU tutorial ya makasih seblumnya udh dikasih komen..
    salam

  • State Architect Guðjón Samúelsson’s design of
    the church was commissioned in 1937.

  • geo target says:

    Hi colleagues, how is all, and what you want to say about this piece of writing, in my view its genuinely amazing
    iin favor of me.

  • Hurrah! In the end I got a weblog from where I know how to in fact get helpful facts concerning my study and knowledge.

  • Rosalyn says:

    I am regular visitor, how are you everybody? This piece off writig posted
    at tbis site is truyly nice.

  • This is a topic which is near to myy heart… Besst wishes!
    Where are your contact details though?

  • dodo games says:

    It’s amazing for me to have a website, which is good designed for my know-how.
    thanks admin

2 Trackbacks / Pingbacks

Leave a Reply

Your email address will not be published. Required fields are marked *