The Power Of Network

Bagi para newbie PHP seperti saya, membuat combo box menu dinamis yang terhubung dengan database tentunya adalah hal yang cukup rumit.

Pada awalnya rasa penasaran saya muncul ketika saya melihat sebuat website, dimana ketika combo box yang kita pilih, maka web tersebut akan menampilkan data yang diminta sesuai dengan menu yg dipilih dari combobox tersebut.

Karena kurangnya pengalaman saya didalam coding PHP, hal ini merupakan hal yang cukup rumit pada awalnya. Dan hal ini juga cukup menggelitik otak saya untuk terus berfikir bagaimana cara membuat combo box menu yang dapat menampilkan data ketika dipilih menunya.

Tapi Alhamdulilah setelah bertapa dan bertanya kepada Mbah Gugel, akhirnya saya dapat membuat combo box menu tersebut.

Kita langsung saja mulai bagaimana cara membuat combo box dinamis ini.

Pertama-tama kita buat sebuah database, sebagai contoh saya buat tabel dengan nama barang.

CREATE  TABLE  `barang`.`barang` (
`id` VARCHAR( 20  )  NOT  NULL ,
`nama` VARCHAR( 20  )  NOT  NULL ,
`merk` VARCHAR( 20  )  NOT  NULL ,
`harga` INT( 11  )  NOT  NULL ,
PRIMARY  KEY (  `id`  )
);

Dan untuk contohnya saya masukan data:

INSERT INTO `barang` VALUES ('b01', 'Kaos', 'Merk01', '5000');
INSERT INTO `barang` VALUES ('b02', 'Kemeja', 'Merk02', '10000');
INSERT INTO `barang` VALUES ('b03', 'Celana', 'Merk03', '15000');

Setelah Tabelnya siap selanjutnya kita buat file PHPnya.
konek.php

<?php
//host database
$dbhost = "nama_hos";
//User Database
$dbuser = "username";
//Password Database
$dbpswd = "password";
//Nama Database
$dbname = "nama_database";
mysql_connect($dbhost, $dbuser, $dbpswd);
mysql_select_db($dbname);
?>

Nah sekarang kita buat Halaman Utamanya
combobox.php

<?php
include 'konek.php';
//ini merupakan fungsi javascript untuk membuat cookie dan aksi pada saat kita memilih Combo Box.
echo"
<script language='javascript'>
function buatCookie(name,value,expiredays)
{
var exdate=new Date();
exdate.setDate(exdate.getDate()+expiredays);
document.cookie = name+ '=' +escape(value)+
((expiredays==null) ? '' : ';expires='+exdate.toGMTString());
}
function pilih(combobox)
{
var isi = combobox.options[combobox.selectedIndex].value;
buatCookie('barang',isi,1);
document.combobox.submit()
}
</script>
";
//mengambil nilai cookienya
$cookie = $_COOKIE['barang'];
//tampilan comboboxnya
$query = mysql_query("SELECT * FROM barang ORDER BY id");
echo"
<form method='post' name='combobox' action='combobox.php'>
<table>
<tr>
<td>Nama Barang</td>
<td><select name='nama_barang' onchange='javascript:pilih(this)'>
<option value='barang' selected>Pilih</option>
";
while($data = mysql_fetch_array($query)){
if($cookie == $data['id']){$select = "selected";}
else{$select = "";}
echo"<option value='".$data['id']."' ".$select.">".$data['nama']."</option>";
}
echo"</select></td></tr></table>';
//tampilkan hasil pencarian database
$query_barang = mysql_query("SELECT * FROM barang WHERE id = '".$cookie."'");
$rows = mysql_num_rows($query_barang);
$data_barang = mysql_fetch_array($query_barang);
$harga = number_format($data_barang['harga'], 0, ',', '.');
if($rows>0){
echo"<table><tr><td>".$data_barang['nama']."</td><td>".$data_barang['merk']."</td><td>Rp. ".$harga."</td></tr></table>";
}else{
echo"<table><tr><td>Silahkan Pilih Nama Barang</td></tr></table>";
}
?>

Untuk penjelasannya, setiap kali combo box dipilih. Maka combo box akan memanggil fungsi javascript untuk membuat cookie dan melakukan submit kepada form yang dituju.
Lalu halaman PHP akan melakukan pencarian query pada database berdasarkan cookie yang telah dibuat oleh javascript tadi.

Demikian dari saya semoga bermanfaat, dan untuk para master PHP kalau ada masukan dan kritikan atau kesalahan dari script yang telah saya buat, mohon petunjuk dan bimbingannya, karena saya sendiri masih nuwbi dalam PHP.

Lihat juga artikel saya yang lain disini