Windows

Header Ads

Menampilkan Data dari Database ke Texfield Menggunakan Combo Box

Selamat Pagi mas dan mabk bro, sudah lama saya agak post lagi. Disini saya akan memposting tutorial menampilkan data berdasarakan pilihan pada combo box ke textfiled.
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? Maka kita harus membuat combo box yang dinamis yang berasal dari database. Pada tutorial ini data dari combobox yang diambil dari database akan ditampilkan

Buatlah
database dengan nama: dbakademik

Buat
tabel dengan nama: tb_mhs

Buat
field yaitu: nim, nama, jurusan dan lalu isilah seperti contoh pada gambar di
bawah ini.


Buat file .php dan berikut ini adalah scriptnya:

     <?php  
    mysql_connect("localhost","root","");  
    mysql_select_db("dbakademik"); 
    ?>
<title>Combobox</title>

<p></p>
    <table width="451" border="0" align="center">
      <tr>
        <td width="118">NIM</td>
        <td width="323"><select name="nim" id="nim" onchange="changeValue(this.value)" >
        <option value=0>-Pilih-</option>
        <?php
    $result = mysql_query("select * from tb_mhs");  
    $jsArray = "var dtMhs = new Array();\n";      
    while ($row = mysql_fetch_array($result)) {  
        echo '<option value="' . $row['nim'] . '">' . $row['nim'] . '</option>';  
        $jsArray .= "dtMhs['" . $row['nim'] . "'] = {nama:'" . addslashes($row['nama']) . "',jrsn:'".addslashes($row['jurusan'])."'};\n";  
    }    
    ?>  
        </select></td>
      </tr>
      <tr>
        <td>Nama Mahasiswa</td>
        <td><input type="text" name="nm" id="nm"/></td>
      </tr>
      <tr>
        <td>Jurusan</td>
        <td><input type="text" name="jrsn" id="jrsn"/></td>
      </tr>
    </table>
      <script type="text/javascript">  
    <?php echo $jsArray; ?>
    function changeValue(nim){
    document.getElementById('nm').value = dtMhs[nim].nama;
    document.getElementById('jrsn').value = dtMhs[nim].jrsn;
    };
    </script>
    

Berikut adalah tampilan ketika dijalankan. Combobox NIM berisi NIM yang datanya mengambil dari tb_mhs.


Berikut ini Tampilan ketika salah satu NIM dipilih. Nama serta jurusan akan tampil pada textfield.

Mungkin Sekian tutorial yang saya post jika mengalami kesulitan bisa langsung komentar di bawah sini nanti akan saya bantu. Mudah-mudahan bermanfaat bagi yang membutuhkan. Bagi rekan2 yang butuh referensi tentang aplikasi PHP atau lagi butuh konsultasi seputar masalah Tugas Akhir silahkan kunjungi Forum Pembelajaran dan Gudang Download PHP, dan dapatkan konsultasi dengan programmer rajaphp.com langsung. Happy Coding :)

Post a Comment

0 Comments