Cara menampilkan data berdasarkan dropdown select php mysqli pada codeigniter maupun laravel sehingga menghasilkan informasi sesuai pilihan di combobox dalam bentuk list tabel atau tampil pada sebuah form submit. Jadi data value yang terdapat pada list pilihan combobox dalam bentuk dropdown select ini dapat berupa kategori atau parameter tertentuk yang dimiliki oleh tiap-tiap baris data. Akan tetapi untuk menampilkan data ke dalam form, list dalam pilihan combobox harus unik sebagai sebuah atribut yang mewakili setiap baris data pada tabel mysql. Kedua model cara menampilkan data berdasarkan dropdown select pada pilihan combobox yaitu data tampil pada list tabel dan data tampil pada form isian atau textbox akan segera kita bahas satu per satu. Show Tutorial cara menampilkan data berdasarkan dropdown select php mysqli yang dapat juga digunakan di codeigniter laravel ini kami lakukan menggunakan web server XAMPP versi 7.3 dengan apache dan database mysql. Sekali lagi kami sampaikan bahwa tutorial ini akan menampilkan data dalam bentuk tabel dan data di dalam form textbox berdasarkan pilihan combobox. Berikut pembahasan tentang bagaimana cara menampilkan data berdasarkan dropdown select php mysqli dimana data akan tampil dalam list tabel dan di form kolom isian.
Cara Menampilkan Data Berdasarkan Dropdown Select PHP MySQLimenampilkan data dropdown select 1. Membuat Folder Direktori di htdocs. Silahakn buat nama folder terserah Anda, karena akan memproses kode php maka sebaiknya terletak di dalam direktori xampp htdocs. Sebagai contoh nama folder yang kami buat adalah "combobox", sehingga url folder menjadi c:\xampp\htdocs\combobox\. Semua file php dan assets lain juga sebaiknya harus tersimpan di dalam folder direktori ini. 2. Membuat Rancangan Database. Dalam tutorial cara menampilkan data berdasarkan dropdown select php mysqli ini kita membutuhkan database dan tabel, misal tabel pegawai lengkap dengan atribut. Karena akan menampilkan data berdasarkan pilihan combobox maka setidaknya ada satu atribut tabel dengan value yang memungkinkan sama-sama dimiliki oleh lebih dari satu pegawai, misal atribut unit kerja. Dan tentu saja harus memiliki primary key dengan nilai unik, sebagai index untuk menampilkan data ke dalam form textbox. Untuk lebih jelasnya, perhatikan struktur tabel di bawah ini.  Pada desain tabel pegawai seperti di atas, field unit_kerja akan ditampilkan ke dalam combobox sehingga dapat dipilih dalam bentuk dropdown select. Kemudian data pegawai yang memiliki value unit kerja sebagaimana dipilih dalam combobox akan tampil dalam list tabel. Agar tutorial cara menampilkan data berdasarkan dropdown select php mysqli ini dapat teman-teman ikuti dengan lancar, sementara buat dulu database dengan desain yang sama seperti di atas, atau copas saja kode sql di bawah ini. -- phpMyAdmin SQL Dump -- version 4.9.0.1 -- https://www.phpmyadmin.net/ -- -- Host: 127.0.0.1 -- Generation Time: Dec 05, 2020 at 01:07 PM -- Server version: 10.4.6-MariaDB -- PHP Version: 7.3.9 SET SQL_MODE = "NO_AUTO_VALUE_ON_ZERO"; SET AUTOCOMMIT = 0; START TRANSACTION; SET time_zone = "+00:00"; /*!40101 SET @OLD_CHARACTER_SET_CLIENT=@@CHARACTER_SET_CLIENT */; /*!40101 SET @OLD_CHARACTER_SET_RESULTS=@@CHARACTER_SET_RESULTS */; /*!40101 SET @OLD_COLLATION_CONNECTION=@@COLLATION_CONNECTION */; /*!40101 SET NAMES utf8mb4 */; -- -- Database: `db_tutorial` -- -- -------------------------------------------------------- -- -- Table structure for table `tb_pegawai` -- CREATE TABLE `tb_pegawai` ( `id_peg` int(11) NOT NULL, `nip` varchar(24) NOT NULL, `nama` varchar(128) NOT NULL, `unit_kerja` varchar(64) NOT NULL, `gol` varchar(8) NOT NULL, `pangkat` varchar(255) NOT NULL, `jabatan` varchar(64) NOT NULL ) ENGINE=InnoDB DEFAULT CHARSET=latin1; -- -- Dumping data for table `tb_pegawai` -- INSERT INTO `tb_pegawai` (`id_peg`, `nip`, `nama`, `unit_kerja`, `gol`, `pangkat`, `jabatan`) VALUES (1, '19871010 201001 1 001', 'Rina Maulana', 'Kepegawaian', 'IV/B', 'Pembina', 'Kepala Bagian'), (2, '19761019 201001 1 001', 'Ibrahim', 'Administrasi', 'IV/A', 'Penata', 'Kepala Sub Bagian'), (3, '19761010 201001 1 001', 'Sumaryam', 'Keuangan', 'IV/A', 'Penata', 'Wakil Kepala'), (4, '19840610 201001 1 001', 'Abraham', 'Kepegawaian', 'III/E', 'Pengatur', 'Koordinatior'), (5, '19881010 201001 1 001', 'Rajasa Hatmoko', 'Kepegawaian', 'III/D', 'Pengatur Muda', 'Koordinator'), (6, '19591210 201001 1 001', 'Darno', 'Administrasi', 'III/C', 'Pengatur Muda', 'Staff'), (7, '19600310 201001 1 001', 'Yatmi Utama', 'Administrasi', 'III/E', 'Penata Muda', 'Staff Ahli'), (8, '19610510 201001 1 001', 'Abdul K', 'Kepegawaian', 'III/DB', 'Penata Muda', 'Staff'); -- -- Indexes for dumped tables -- -- -- Indexes for table `tb_pegawai` -- ALTER TABLE `tb_pegawai` ADD PRIMARY KEY (`id_peg`); -- -- AUTO_INCREMENT for dumped tables -- -- -- AUTO_INCREMENT for table `tb_pegawai` -- ALTER TABLE `tb_pegawai` MODIFY `id_peg` int(11) NOT NULL AUTO_INCREMENT, AUTO_INCREMENT=16; COMMIT; /*!40101 SET CHARACTER_SET_CLIENT=@OLD_CHARACTER_SET_CLIENT */; /*!40101 SET CHARACTER_SET_RESULTS=@OLD_CHARACTER_SET_RESULTS */; /*!40101 SET COLLATION_CONNECTION=@OLD_COLLATION_CONNECTION */; 3. Desain Form dengan Dropdown Select. Pada tutorial cara menampilkan data berdasarkan dropdown select php mysqli ini, maka kita akan membutuhkan form yang memiliki atribut select dalam bentuk combobox. Kemudian hasil perintah yang disubmit ditampilkan pada halaman yang sama, sehingga action query php mysqli juga dibuat pada file ini. Berikut adalah kode program untuk form dropdown select tersebut, dan tampilan ini juga sekaligus berfungsi sebagai homepage atau halaman index. Simpan sebagai index.php <html>
<head>
<title>Cara Menampilkan Data Berdasarkan Dropdown Select PHP MySQLi</title>
</head>
<body>
<h3>Menampilkan Data Berdasarkan Dropdown Select Ke Daftar Tabel</h3>
<form action="<?php echo $_SERVER["PHP_SELF"];?>" method="GET">
<p>Select list:</p>
<select name="unit_kerja" style="width:160px;">
<?php
include "koneksi.php";
//query menampilkan nama unit kerja ke dalam combobox
$query =mysqli_query($conn, "SELECT * FROM tb_pegawai GROUP BY unit_kerja ORDER BY unit_kerja");
while ($data = mysqli_fetch_array($query)) {
?>
<option value="<?=$data['unit_kerja'];?>"><?php echo $data['unit_kerja'];?></option>
<?php
}
?>
</select>
<input type="submit" value="Pilih">
<a href="./">Refresh</a>
</form>
<table border="1" cellpadding="2">
<thead>
<tr>
<th>No</th>
<th>NIP</th>
<th>Nama</th>
<th>Unit Kerja</th>
<th>Gol</th>
<th>Pangkat</th>
<th>Jabatan</th>
</tr>
</thead>
</table>
</body>
</html>
Script php di atas akan menampilkan halaman form pilihan combobox dengan nilai unit kerja yang dapat dipilih dalam bentuk select dropdown, dan memiliki button submit sebagai action. Yang perlu diperhatikan adalah pada baris ke-13 yaitu query $query =mysqli_query($conn, "SELECT * FROM tb_pegawai GROUP BY unit_kerja ORDER BY unit_kerja"); yang berfungsi untuk mengambil nama-nama unit kerja dari tabel pegawai. 4. Membuat Query Action Berdasarkan Pilihan Combobox. Ini adalah tahap terakhir untuk menampilkan data berdasarkan dropdown select php mysqli, letakan query berikut tepat di bawah "</thead>" pada langkah no.3 di file yang sama. Pastikan posisi penempatan kode program sesuai, karena tidak hanya script php saja, melainkan ada juga beberapa tag html tabel sebagai lanjutan kode program di file sebelumnya. Simpan query action php mysqli nya. <?php
if (isset($_GET['unit_kerja'])) {
$unit_kerja=trim($_GET['unit_kerja']);
//menampilkan pegawai berdasarkan unit kerja yang dipilih pada combobox
$tamPeg=mysqli_query($conn, "SELECT * FROM tb_pegawai WHERE unit_kerja='$unit_kerja' ORDER BY gol DESC");
$no=0;
while ($tpeg = mysqli_fetch_array($tamPeg)) {
$no++;
?>
<tbody>
<tr>
<td><?php echo $no;?></td>
<td><?php echo $tpeg['nip'];?></td>
<td><?php echo $tpeg['nama'];?></td>
<td><?php echo $tpeg['unit_kerja'];?></td>
<td><?php echo $tpeg['gol'];?></td>
<td><?php echo $tpeg['pangkat'];?></td>
<td><?php echo $tpeg['jabatan'];?></td>
</tr>
</tbody>
<?php
}
}
?>
Perhatikan baris kode program ke-6 yaitu $tamPeg=mysqli_query($conn, "SELECT * FROM tb_pegawai WHERE unit_kerja='$unit_kerja' ORDER BY gol DESC");, terlihat ada parameter pada WHERE. Jadi setelah submit pilihan pada combobox, maka query ini bekerja dengan parameter WHERE sesuai dengan nama unit kerja yang dipilih. Jadi setelah digabungkan langkah ke-3 dan ke-4 maka akan menghasilkan kode program yang utuh untuk menampilkan data berdasarkan dropdown select pilihan combobox. Berikut adalah kode program yang lengkap, teman-teman jangan copy dari langkah ke-3 dan ke-4, cukup copy dari sini saja. <html>
<head>
<title>Cara Menampilkan Data Berdasarkan Dropdown Select PHP MySQLi</title>
</head>
<body>
<h3>Menampilkan Data Berdasarkan Dropdown Select Ke Daftar Tabel</h3>
<form action="<?php echo $_SERVER["PHP_SELF"];?>" method="GET">
<p>Select list:</p>
<select name="unit_kerja" style="width:160px;">
<?php
include "koneksi.php";
//query menampilkan nama unit kerja ke dalam combobox
$query =mysqli_query($conn, "SELECT * FROM tb_pegawai GROUP BY unit_kerja ORDER BY unit_kerja");
while ($data = mysqli_fetch_array($query)) {
?>
<option value="<?=$data['unit_kerja'];?>"><?php echo $data['unit_kerja'];?></option>
<?php
}
?>
</select>
<input type="submit" value="Pilih">
<a href="./">Refresh</a>
</form>
<table border="1" cellpadding="2">
<thead>
<tr>
<th>No</th>
<th>NIP</th>
<th>Nama</th>
<th>Unit Kerja</th>
<th>Gol</th>
<th>Pangkat</th>
<th>Jabatan</th>
</tr>
</thead>
<?php
if (isset($_GET['unit_kerja'])) {
$unit_kerja=trim($_GET['unit_kerja']);
//menampilkan pegawai berdasarkan unit kerja yang dipilih pada combobox
$tamPeg=mysqli_query($conn, "SELECT * FROM tb_pegawai WHERE unit_kerja='$unit_kerja' ORDER BY gol DESC");
$no=0;
while ($tpeg = mysqli_fetch_array($tamPeg)) {
$no++;
?>
<tbody>
<tr>
<td><?php echo $no;?></td>
<td><?php echo $tpeg['nip'];?></td>
<td><?php echo $tpeg['nama'];?></td>
<td><?php echo $tpeg['unit_kerja'];?></td>
<td><?php echo $tpeg['gol'];?></td>
<td><?php echo $tpeg['pangkat'];?></td>
<td><?php echo $tpeg['jabatan'];?></td>
</tr>
</tbody>
<?php
}
}
?>
</table>
</body>
</html>
Jika tutorial cara menampilkan data berdasarkan dropdown select php mysqli ini berhasil, maka akan tampil daftar tabel pegawai seperti gambar di bawah ini. Menampilkan Data pada Form Berdasarkan Pilihan ComboboxContoh berikutnya adalah membuat sebuah form dengan pilihan NIP pegawai pada sebuah combobox yang nilai nya juga diambil dari database. Jadi ketika salah satu pilihan di combo box tersebut dipilih, maka data pegawai berdasarkan id terpilih tersebut akan tampil pada sebuah form submit. Berikut adalah kode program nya, simpan sebagai form.php <html>
<head>
<title>Cara Menampilkan Data pada Form Berdasarkan Pilihan Combobox</title>
</head>
<body>
<h3>Menampilkan Data pada Form Berdasarkan Pilihan Combo Box</h3>
<form action="<?php echo $_SERVER["PHP_SELF"];?>" method="GET">
<p>Pilih Pegawai:</p>
<select name="id_peg" style="width:200px;">
<?php
include "koneksi.php";
//query menampilkan nip pegawai ke dalam combobox
$query =mysqli_query($conn, "SELECT * FROM tb_pegawai ORDER BY id_peg");
while ($data = mysqli_fetch_array($query)) {
?>
<option value="<?=$data['id_peg'];?>"><?php echo $data['nip'];?></option>
<?php
}
?>
</select>
<input type="submit" value="Pilih">
<a href="./form.php">Refresh</a>
</form>
<h4>Data Pegawai</h4>
<?php
if (isset($_GET['id_peg'])) {
$id_peg=$_GET['id_peg'];
//menampilkan data pegawai berdasarkan pilihan combobox ke dalam form
$tamPeg=mysqli_query($conn, "SELECT * FROM tb_pegawai WHERE id_peg='$id_peg'");
$tpeg = mysqli_fetch_array($tamPeg);
?>
<form action="#" method="POST">
<table border="0" cellpadding="2">
<tr>
<td width="100">NIP</td>
<td width="280">: <input type="text" name="nip" value="<?php echo $tpeg['nip']; ?>" /></td>
</tr>
<tr>
<td>Nama</td>
<td>: <input type="text" name="nama" value="<?php echo $tpeg['nama']; ?>" /></td>
</tr>
<tr>
<td>Unit Kerja</td>
<td>: <input type="text" name="unit_kerja" value="<?php echo $tpeg['unit_kerja']; ?>" /></td>
</tr>
<tr>
<td>Gol</td>
<td>: <input type="text" name="gol" value="<?php echo $tpeg['gol']; ?>" /></td>
</tr>
<tr>
<td>Pangkat</td>
<td>: <input type="text" name="pangkat" value="<?php echo $tpeg['pangkat']; ?>" /></td>
</tr>
<tr>
<td>Jabatan</td>
<td>: <input type="text" name="jabatan" value="<?php echo $tpeg['jabatan']; ?>" /></td>
</tr>
<tr>
<td></td>
<td> <input type="submit" value="Save"></td>
</tr>
</table>
</form>
<?php
}
?>
</body>
</html>
Jika script php di atas dijalankan maka akan menampilkan data pegawai berdasarkan pilihan combobox ke dalam form submit seperti gambar di bawah ini. Cukup sampai disini tutorial cara menampilkan data berdasarkan dropdown select php mysqli yang juga dapat diimplementasikan pada codeigniter atau laravel. Tentu saja kasus ini masih sangat sederhana, silahkan teman-teman kembangkan kembali mengikuti perkembangan dan metode masing-masing. Cara Menampilkan Data Berdasarkan Dropdown Select PHP MySQLiDownload Complete Script Sekian penjelasan tentang bagaimana cara menampilkan data berdasarkan dropdown select php mysqli baik ke dalam daftar tabel maupun ke dalam form submit. Untuk mendapatkan source code atau script php Anda dapat langsung copas melalui jendela script yang tersedia atau via link di atas. Jika ada kendala atau pertanyaan silahkan hubungi kami melalui email atau melalui form komentar dan obrolan. Semoga dapat membantu. Baca juga :
Cara Menampilkan Data Berdasarkan Dropdown Select PHP MySQLiTags: cara menampilkan data berdasarkan dropdown select php mysqli, menampilkan data berdasarkan pilihan combobox, menampilkan data ke combobox, dropdown select php mysqli, menampilkan data berdasarkan dropdown select php mysqli Apakah tag list digunakan untuk membuat drop down list?Pada HTML-nya, Menu dropdown diciptakan dengan menggunakan elemen tag <ul> dengan id="menu_dropdown" (baris ke-8).
Select2 itu apa?Select2 merupakan salah satu plugin yang banyak digunakan pada form, sebagai pengganti dropdown select di aplikasi web. Select2 memberikan kemudahan kepada user, karena kita bisa memilih data dengan memasukkan pencarian pada dropdown tersebut.
|
Membuat dropdown list php
Pos Terkait
Copyright © 2024 ketajaman Inc.
