Mau kaos (T-shirt) Wordpress keren? (Selengkapnya)
SEO Complete Guide for Wordpress

Ingin beriklan di atas?


Dapatkan Script SMS Gateway PHP + MySQL

Seperti: software pengirim SMS massal, SMS survei, SMS polling, SMS quick count, SMS dakwah, Web2SMS dan masih banyak lagi... semuanya berbasis PHP & MySQL
[Info Lengkap...]


Pemrosesan Form dengan Komponen Combo Box


January 3rd, 2009 | by rosihanari | Cetak Artikel Ini Cetak Artikel Ini

Instant Internet Business Ideas
Ingin beriklan di atas?

Wah… lama gak update blog ini, karena terlalu sibuk ngurusin sertifikasi guru :-) Kangen rasanya untuk nulis-nulis artikel lagi he.. he.. he…

Untuk artikel kali ini saya akan paparkan bagaimana melakukan pemrosesan form dengan komponen combo box. Anda tahu kan apa itu combo box? Ya.. combo box adalah salah satu komponen untuk keperluan input data melalui form. Komponen ini memiliki bentuk seperti drop down menu dan kita diminta memilih item yang diinginkan di antara item yang ada dalam list komponen ini.

Artikel yang akan dibahas dalam blog ini terkait dengan pemrosesan form dengan komponen combo box adalah bagaimana membuat item list supaya muncul dalam combo box. Kita dapat membuat item list secara manual ataupun secara otomatis melalui script yang terhubung ke database. Dengan script ini kita dapat mengenerate item list combo box dari data yang tersimpan dalam database.

Pembahasan pertama kita mulai dahulu dengan bagaimana bentuk tag (X)HTML untuk membuat komponen combo box ini. Untuk membuat komponen combo box, tag (X)HTML nya berbentuk sbb:

<select name="namacombobox">
   <option value="value1">Option 1</option>
   <option value="value2">Option 2</option>
   <option value="value3">Option 3</option>
</select>

Tag (X)HTML di atas akan menghasilkan combo box dengan 3 list item pilihan. Pemberian atribut name combo box jangan sampai lupa dituliskan karena pemberian nama ini nantinya akan terkait dengan proses submit ke script pemrosesan script. Selanjutnya apa maksudnya atribut option? Ya… atribut ini nanti terkait dengan value yang akan disubmit. Misalkan ada user yang memilih item ke-1, yaitu OPTION 1, maka value yang akan disubmit adalah ‘value1′. Sedangkan bila item ke-2 yang dipilih, maka value yang disubmit adalah ‘value2, begitu seterusnya.

Selanjutnya kita terapkan konsep di atas in real world. Maksudnya kita akan membuat combo box dan juga script pemrosesnya. Misalkan combo box ini digunakan untuk menampilkan pilihan negara lalu mensubmitnya.

Oya… supaya value dan data dari combo box ini bisa diproses atau disubmit, komponen combo box ini harus diletakkan dalam tag

form.html

<form method="post" action="submit.php">
Pilih salah satu negara :
<select name="negara">
   <option value="ID">Indonesia</option>
   <option value="MY">Malaysia</option>
   <option value="AU">Australia</option>
   <option value="US">Amerika Serikat</option>
   <option value="CA">Canada</option>
</select>
<input type="submit" name="submit" value="Submit" />
</form>

submit.php

<?php
// membaca value yang disubmit pada komponen bernama 'negara'
$kodeNegara = $_POST['negara'];
echo "Anda telah memilih negara berkode ".$kodeNegara;
?>

OK… bila Anda jalankan form.html di browser, lalu memilih option negara Australia misalnya, kemudian mensubmitnya maka akan tampil “Anda telah memilih negara berkode AU” pada submit.php. Nah dalam hal ini bisa disimpulkan bahwa value yang disubmit adalah value yang terletak pada atribut value=”…” pada tag

Selanjutnya, misalkan Anda punya tabel dalam database yang berisi data lalu Anda ingin menampilkannya sebagai list item combo boxnya. Bagaimana caranya? Caranya mudah sekali bro… konsepnya hanyalah melakukan proses looping pada bagian sesuai data yang dibaca dari database. OK, sebagai contoh misalkan kita punya tabel COUNTRIES dan data sbb:

CREATE TABLE `countries` (
  `id` varchar(2) NOT NULL DEFAULT '',
  `namanegara` varchar(20) DEFAULT NULL,
  PRIMARY KEY  (`id`)
)
 
INSERT INTO `countries` VALUES ('ID', 'Indonesia');
INSERT INTO `countries` VALUES ('AU', 'Australia');
INSERT INTO `countries` VALUES ('US', 'Amerika Serikat');
INSERT INTO `countries` VALUES ('CA', 'Kanada');
INSERT INTO `countries` VALUES ('MY', 'Malaysia');

maka script PHP untuk mengenerate list item untuk combo box nya adalah sbb:

form.php

<?php
// koneksi ke mysql
mysql_connect("dbhost","dbuser","dbpass");
mysql_select_db("dbname");
?>
 
<form method="post" action="submit.php">
Pilih salah satu negara :
<select name="negara">
<?php
   // query untuk menampilkan semua negara
   $query = "SELECT * FROM countries";
   $hasil = mysql_query($query);
   while ($data = mysql_fetch_array($hasil))
   {
      // setiap negara yang dibaca dari tabel disisipkan ke tag <option></option>
      echo "<option value='".$data['id']."'>".$data['namanegara']."</option>";
   }
?> 
</select>
<input type="submit" name="submit" value="Submit" />
</form>

Gimana mudah sekali bukan? Mudah-mudahan ada manfaatnya buat Anda.


Beberapa artikel terkait


Share this article on:

Kata kunci: combobox - form - PHP - script -


Ada 23 komentar dalam artikel ini.

  1. [...] saya menulis artikel bagaimana memproses input melalui komponen combo box, dan juga tentang radio button, dalam kesempatan ini, saya akan coba bahas tentang bagaimana [...]

  2. Irwin Hosh says:

    tHANKS sALAM kENAL

  3. antowi says:

    kalau mau bikin search engine dengan dua search engine gimana mas? misalnya search engine wordpress buat search di blog & google search buat search web
    terus ada pilihan dropdown gitu..
    thanks sebelumnya

  4. rosihanari says:

    to antowi: sebenarnya untuk 2 jenis search engine ini sama-sama kita bisa memanfaatkan search enginenya Google. Untuk searching konten di blog kita, kita manfaatkan Google untuk mencari halaman di blog kita yang telah diindex oleh Google. Dahulu hal ini support, karena kita bisa pasang kotak pencarian dengan menggunakan 2 opsi pencarian tersebut. Namun… tampaknya sekarang hanya bisa dipilih salah satu saja. Anda bisa mendapatkan kode untuk menempatkan kotak pencarian tersebut melalui Google Adsense (http://www.google.com/adsense). Untuk petunjuk pemasangan kode kotak pencarian di blog, silakan baca http://blog.rosihanari.net/memasang-adsense-for-search-di-wordpress/

  5. wahid says:

    wah tutorial blog ini bagus sekali, klo boleh saya ingin minta tutorial buat suatu pencarian multi kategori dengan combo box misalkan buat suatu pencarian judul buku pada suatu perpustakaan online…
    dengan beberapa kategori sbb:

    1.Cari berdasarkan judul
    2.Cari berdasarkan penerbit
    3.Cari berdasarkan tahun terbit
    4.Cari berdasarkan kategori buku

    Kalo boleh mohon di kasih pencerahannya..
    Terima kasih banyak

  6. wahid says:

    ya juga ya pak, saya akan coba pelajari lagi…

    Terima kasih banyak pak

  7. Assalaamu\’alaykum..
    Maaf nih numpang nanya lagi Pak Ari :-)
    Gini pak, saya coba modif wordpress saya (di localhost), kebetulan saya ada script \’emailme\’ filena misal : form.html dan kontak.php. Form na Saya taruh di sidebar wordpress dengan metode include. Form na dengan metode \”post\” ke kontak.php. Yg jadi masalah, pas di submit, kok error 404 ya? Apa scriptnya belum dikomunikasikan dg database MySQL nya? Kalo iya, gimana ya caranya? Atau memang wordpress gak bisa akses file tsb langsung dari browser (contohnya : web.com/arsip/kontak.php) ?? Saya masih bingung..
    Mohon penerangannya..
    Terima Kasih banyak Pak Ari.
    Wassalaamu\’alaykum..

  8. rosihanari says:

    to imam zatnika: anda letakkan di folder mana kontak.php nya?

  9. tery says:

    pak bagaimana ya kalau menggunakan bahasa pemrograman JSP. tolong bantu dong. kalau bisa kirim email.



Tolong beri komentar donk!

Komentar Anda akan berguna untuk kemajuan blog ini.


Mohon maaf, komentar yang menggunakan email palsu atau komentar bernada negatif atau cemooh secara otomatis akan terhapus karena dianggap spam dan tidak akan tampil dalam daftar komentar.

Dimohon jangan pula memasukkan code program dalam bentuk apapun ke dalam komentar karena akan dianggap spam.

*
Untuk membuktikan bahwa komentar Anda bukan spam, tulis kata yang muncul dalam gambar di bawah ini. Bila Anda tidak bisa membaca kata dalam gambar, klik pada gambar tersebut untuk mendengarkan suara dari kata tersebut
Click to hear an audio file of the anti-spam word