menampilkan data pada textbox berdasarkan combobox

menampilkan data pada textbox berdasarkan combobox , dengan menggunakan coding PHP secara otomatis dirasa cukup berperan penting dalam setiap project-project Website, Berdasarkan pengalaman pribadi ne... heeee. heeee ;)

Berdasarkan Judul di atas, ialah, Bagaimana cara nya kita menampilkan data secara  otomatis di dalam text box saat kita memilih data yang ada di combobox ,

Ok langsung Ke TKP aja :

Berikut ini adalah data di database untuk membuat  Combobox dinamis :


Nah dari data di atas kita akan menampilkan "product_id" ke dalam list menu dan kemudian saat di klik maka "product_name" akan langsung tampil di text box , berikut codenya :


<?php  
// Koneksi
mysql_connect("localhost","root","");  
mysql_select_db("db_ebsof");  
$result = mysql_query("select * from product");
$jsArray = "var prdName = new Array();\n";
echo 'Kode Produk : <select name="prdId" onchange="document.getElementById(\'prd_name\').value = prdName[this.value]">';
echo '<option>-------</option>';
while ($row = mysql_fetch_array($result)) {
    echo '<option value="' . $row['product_id'] . '">' . $row['product_id'] . '</option>';
    $jsArray .= "prdName['" . $row['product_id'] . "'] = '" . addslashes($row['product_name']) . "';\n";
}
echo '</select>';
?>
<br />
Nama Produk : <input type="text" name="prod_name" id="prd_name"/>
<script type="text/javascript">
<?php echo $jsArray; ?>
</script>


Nah dari kode di atas akan ditampilkan di browser seperti dibawah ini :


Dan bagaimana jika kita ingin menambahkan satu buah text box lagi...?

Misalnya .. table di database kita tambahkan "product_desc"  berikut contohnya :


Nah coding untuk menampilkan "produc_name & product_desc" yaitu

<?php  
mysql_connect("localhost","root","");  
mysql_select_db("db_ebsof");  
$result = mysql_query("select * from product");  
$jsArray = "var prdName = new Array();\n";  
echo 'Kode Produk : <select name="prdId" onchange="changeValue(this.value)">';  
echo '<option>-------</option>';  
while ($row = mysql_fetch_array($result)) {  
    echo '<option value="' . $row['product_id'] . '">' . $row['product_id'] . '</option>';  
    $jsArray .= "prdName['" . $row['product_id'] . "'] = {name:'" . addslashes($row['product_name']) . "',desc:'".addslashes($row['product_desc'])."'};\n";  
}  
echo '</select>';  
?>  
<br/><br />Nama Produk : <input type="text" name="prod_name" id="prd_name"/>
<br /><br />Keterangan : <input type="text" name="prod_desc" id="prd_desc"/>
<script type="text/javascript">  
<?php echo $jsArray; ?>
function changeValue(id){
document.getElementById('prd_name').value = prdName[id].name;
document.getElementById('prd_desc').value = prdName[id].desc;
};
</script>


Sehingga hasilnya akan seperti ini :


Sumber :
http://suckittrees.com/

LihatTutupKomentar