CRUD Sederhana Menggunakan PHP-MySQL dengan MySQLi extension
Assalamu’alaikum..
Halo teman-teman, pada kesempatan kali ini saya akan berbagi tutorial tentang cara membuat aplikasi CRUD sederhana menggunakan PHP dan MySQL dengan mysqli extensions.
Sebelum membahas langkah-langkahnya ada baiknya kita mengenal apa itu aplikasi CRUD. CRUD merupakan singkatan dari Create, Read, Update dan Delete. Sesuai dengan namanya, aplikasi CRUD merupakan aplikasi yang digunakan untuk menginput data ke database (Create), menampilkan data dari database (Read), mengedit/mengupdate data pada database (Update) dan menghapus data dari database (Delete).
Tutorial ini saya tujukan terutama bagi teman-teman yang mungkin baru dalam mempelajari PHP. Memahami konsep CRUD sangat penting jika kita ingin membuat sebuah aplikasi. Tanpa memahami konsep ini, kita tidak bisa membuat aplikasi bahkan yang sangat sederhana sekalipun, kecuali jika aplikasi yang kita buat tidak berhubungan dengan database.
Bagi teman-teman yang belum menguasai dasar HTML, PHP dan MySQL, saya sarankan untuk mempelajarinya terlebih dahulu sebelum mengikuti tutorial ini. Akan lebih baik lagi jika Anda juga menguasai CSS. Karena di sini saya tidak akan menjelaskan hal-hal yang bersifat dasar. Jika teman-teman mengikuti tutorial ini, saya asumsikan teman-teman sudah menguasai dasar-dasar HTML, PHP dan MySQL.
Kali ini kita akan belajar membuat aplikasi untuk mengolah biodata mahasiswa. Berikut ini gambaran hasil aplikasi yang akan kita buat:
Halaman utama menampilkan data mahasiswa:

Halaman untuk menginput data:

Halaman untuk mengedit data:

Tampilan ketika akan menghapus data:

Adapun file-file yang nantinya akan kita buat adalah sebagai berikut:

Oke langsung saja, selanjutnya kita akan membahas langkah-langkahnya.
Langkah 1 : Menyiapkan Database
Langkah pertama yang harus kita lakukan adalah menyiapkan database terlebih dahulu. Database ini akan digunakan untuk menyimpan data dari aplikasi crud yang kita buat.
Buatlah database dengan nama crud_sederhana, bisa dengan menggunakan Command Promt atau dengan phpMyAdmin. Setelah database dibuat, langkah selanjutnya yaitu membuat tabel dengan nama mahasiswa ke dalam database tadi.
Struktur tabel mahasiswa adalah sebagai berikut:

Berikut ini adalah script untuk membuat tabel mahasiswa:
CREATE TABLE `mahasiswa` ( `id` int(11) NOT NULL AUTO_INCREMENT, `nim` char(8) DEFAULT NULL, `nama` varchar(100) DEFAULT NULL, `fakultas` varchar(50) DEFAULT NULL, `jurusan` varchar(50) DEFAULT NULL, `ipk` decimal(3,2) DEFAULT NULL, PRIMARY KEY (`id`) );
Langkah 2 : Koneksi ke Database
Sebelum melakukan langkah ini kita harus membuat folder untuk menyimpan file-file yang nantinya akan kita buat. Buat folder dengan nama crud_sederhana di dalam folder htdocs.
Langkah selanjutnya yaitu membuat file untuk melakukan koneksi ke database. Buat file baru dengan nama koneksi.php, simpan ke dalam folder crud-sederhana tadi, kemudian isi dengan kode dibawah ini:
<?php // buat koneksi dengan database mysql $host = "localhost"; $user = "root"; $pass = ""; $name = "crud_sederhana"; $link = mysqli_connect($host,$user,$pass,$name); //periksa koneksi, tampilkan pesan kesalahan jika gagal if(!$link){ die ("Koneksi dengan database gagal: ".mysql_connect_errno(). " - ".mysql_connect_error()); } ?>
Silahkan sesuaikan variabel $host dan $user sesuai dengan komputer Anda.
File koneksi.php ini nantinya akan kita panggil ke dalam file-file lainnya dengan fungsi include() agar setiap file bisa terhubung ke database.
Langkah 3 : Menampilkan Data
Langkah ketiga yaitu membuat file untuk menampilkan data. Karena akan kita jadikan sebagai halaman utama maka kita beri nama file ini dengan nama index.php. Setelah membuat file index.php di dalam folder crud_sederhana, isilah dengan kode berikut:
<?php // memanggil file koneksi.php untuk melakukan koneksi database include 'koneksi.php'; ?> <!DOCTYPE html> <html> <head> <style> table{ width: 840px; margin: auto; } h1{ text-align: center; } </style> </head> <body> <h1>Tabel Biodata Mahasiswa</h1> <center><a href="input.php">Input Data ≫ </a></center> <br/> <table border="1"> <tr> <th>No</th> <th>NIM</th> <th>Nama</th> <th>Fakultas</th> <th>Jurusan</th> <th>IPK</th> <th>Pilihan</th> </tr> <?php // jalankan query untuk menampilkan semua data diurutkan berdasarkan nim $query = "SELECT * FROM mahasiswa ORDER BY nim ASC"; $result = mysqli_query($link, $query); //mengecek apakah ada error ketika menjalankan query if(!$result){ die ("Query Error: ".mysqli_errno($link). " - ".mysqli_error($link)); } //buat perulangan untuk element tabel dari data mahasiswa $no = 1; //variabel untuk membuat nomor urut // hasil query akan disimpan dalam variabel $data dalam bentuk array // kemudian dicetak dengan perulangan while while($data = mysqli_fetch_assoc($result)) { // mencetak / menampilkan data echo "<tr>"; echo "<td>$no</td>"; //menampilkan no urut echo "<td>$data[nim]</td>"; //menampilkan data nim echo "<td>$data[nama]</td>"; //menampilkan data nama echo "<td>$data[fakultas]</td>"; //menampilkan data fakultas echo "<td>$data[jurusan]</td>"; //menampilkan data jurusan echo "<td>$data[ipk]</td>"; //menampilkan data ipk // membuat link untuk mengedit dan menghapus data echo '<td> <a href="edit.php?id='.$data['id'].'">Edit</a> / <a href="hapus.php?id='.$data['id'].'" onclick="return confirm(\'Anda yakin akan menghapus data?\')">Hapus</a> </td>'; echo "</tr>"; $no++; // menambah nilai nomor urut } ?> </table> </body> </html>
Apabila index.php ini kita jalankan di web browser maka akan terlihat tampilan seperti ini:

Seperti yang kita lihat, tabel mahasiswa di atas masih kosong karena memang kita belum memasukkan data apapun ke dalam tabel. Untuk itu pada langkah selanjutnya kita akan membuat sebuah halaman untuk memasukkan data pada tabel mahasiswa.
Langkah 4 : Memasukkan Data
Pada tahap ini kita akan membuat dua buah file. File yang pertama berisi sebuah form untuk memasukkan data yang akan kita beri nama input.php. File yang kedua berfungsi untuk memproses data yang telah dimasukkan pada form input.php. File ini kita beri nama input_proses.php.
Berikut ini adalah tampilan kode pada file input.php:
<!DOCTYPE html> <html> <head> <style> h1{ text-align: center; } .container{ width: 400px; margin: auto; } </style> </head> <body> <h1>Input Data</h1> <div class="container"> <form id="form_mahasiswa" action="input_proses.php" method="post"> <fieldset> <legend>Input Data Mahasiswa</legend> <p> <label for="nim">NIM : </label> <input type="text" name="nim" id="nim" placeholder="Contoh: 12345678"> </p> <p> <label for="nama">Nama : </label> <input type="text" name="nama" id="nama"> </p> <p> <label for="fakultas" >Fakultas : </label> <select name="fakultas" id="fakultas"> <option value="Kedokteran">Kedokteran </option> <option value="MIPA">MIPA</option> <option value="Ekonomi">Ekonomi</option> <option value="Teknik">Teknik</option> <option value="Sastra">Sastra</option> <option value="Hukum">Hukum</option> </select> </p> <p> <label for="jurusan">Jurusan : </label> <input type="text" name="jurusan" id="jurusan"> </p> <p > <label for="ipk">IPK : </label> <input type="text" name="ipk" id="ipk" placeholder="Contoh: 2.75"> </p> </fieldset> <p> <input type="submit" name="input" value="Tambah Data"> </p> </form> </div> </body> </html>
Tampilan halaman input.php:

Saya rasa kode di atas cukup mudah dipahami karena hanya berupa html. Pada kode di atas terdapat form dengan action = “input_proses.php”, artinya ketika form tersebut disubmit maka data yang diinputkan pada form akan diproses oleh file input_proses.php
Tampilan kode input_proses.php adalah sebagai berikut:
<?php // memanggil file koneksi.php untuk melakukan koneksi database include 'koneksi.php'; // mengecek apakah tombol input dari form telah diklik if (isset($_POST['input'])) { // membuat variabel untuk menampung data dari form $nim = $_POST['nim']; $nama = $_POST['nama']; $fakultas = $_POST['fakultas']; $jurusan = $_POST['jurusan']; $ipk = (float) $_POST['ipk']; // jalankan query INSERT untuk menambah data ke database $query = "INSERT INTO mahasiswa VALUES (NULL, '$nim', '$nama', '$fakultas','$jurusan',$ipk)"; $result = mysqli_query($link, $query); // periska query apakah ada error if(!$result){ die ("Query gagal dijalankan: ".mysqli_errno($link). " - ".mysqli_error($link)); } } // melakukan redirect (mengalihkan) ke halaman index.php header("location:index.php"); ?>
File input_proses.php akan mengambil data yang diinput dari form pada halaman input.php kemudian memasukkan data tersebut ke dalam database menggunakan query INSERT INTO.
Sampai tahap ini kita sudah bisa menginput data ke dalam tabel mahasiswa, namun kita belum bisa melakukan edit data dan hapus data.
Langkah 5 : Mengupdate / Mengedit Data
Langkah selanjutnya yaitu membuat halaman untuk update/edit data. Sama seperti sebelumnya, pada tahap ini kita akan membuat dua file: file untuk membuat form dan file untuk memproses form.
Sekarang buat file untuk membuat form update data dengan nama edit.php. kemudian isikan kode berikut:
<?php // memanggil file koneksi.php untuk membuat koneksi include 'koneksi.php'; // mengecek apakah di url ada nilai GET id if (isset($_GET['id'])) { // ambil nilai id dari url dan disimpan dalam variabel $id $id = ($_GET["id"]); // menampilkan data mahasiswa dari database yang mempunyai id=$id $query = "SELECT * FROM mahasiswa WHERE id='$id'"; $result = mysqli_query($link, $query); // mengecek apakah query gagal if(!$result){ die ("Query Error: ".mysqli_errno($link). " - ".mysqli_error($link)); } // mengambil data dari database dan membuat variabel" utk menampung data // variabel ini nantinya akan ditampilkan pada form $data = mysqli_fetch_assoc($result); $nim = $data["nim"]; $nama = $data["nama"]; $fakultas = $data["fakultas"]; $jurusan = $data["jurusan"]; $ipk = $data["ipk"]; } else { // apabila tidak ada data GET id pada akan di redirect ke index.php header("location:index.php"); } ?> <!DOCTYPE html> <html> <head> <style> h1{ text-align: center; } .container{ width: 400px; margin: auto; } </style> </head> <body> <h1>Edit Data</h1> <div class="container"> <form id="form_mahasiswa" action="edit_proses.php" method="post"> <input type="hidden" name="id" value="<?php echo $id; ?>"> <fieldset> <legend>Edit Data Mahasiswa</legend> <p> <label for="nim">NIM : </label> <input type="text" name="nim" id="nim" value="<?php echo $nim ?>"> </p> <p> <label for="nama">Nama : </label> <input type="text" name="nama" id="nama" value="<?php echo $nama ?>"> </p> <p> <label for="fakultas" >Fakultas : </label> <select name="fakultas" id="fakultas"> <option value="Kedokteran" <?php if($data['fakultas'] == 'Kedokteran'){ echo 'selected'; } ?>> Kedokteran </option> <option value="MIPA" <?php if($data['fakultas'] == 'MIPA'){ echo 'selected'; } ?>> MIPA</option> <option value="Ekonomi" <?php if($data['fakultas'] == 'Ekonomi'){ echo 'selected'; } ?>> Ekonomi</option> <option value="Teknik" <?php if($data['fakultas'] == 'Teknik'){ echo 'selected'; } ?>> Teknik</option> <option value="Sastra" <?php if($data['fakultas'] == 'Sastra'){ echo 'selected'; } ?>> Sastra</option> <option value="Hukum" <?php if($data['fakultas'] == 'Hukum'){ echo 'selected'; } ?>> Hukum</option> </select> </p> <p> <label for="jurusan">Jurusan : </label> <input type="text" name="jurusan" id="jurusan" value="<?php echo $jurusan ?>"> </p> <p > <label for="ipk">IPK : </label> <input type="text" name="ipk" id="ipk" value="<?php echo $ipk ?>"> </p> </fieldset> <p> <input type="submit" name="edit" value="Update Data"> </p> </form> </div> </body> </html>
Tampilan halaman edit:

Halaman edit data ini dapat diakses melalui tombol link yang terdapat pada kolom pilihan Tabel Biodata Mahasiswa pada halaman index.php.

Link tersebut mengandung query string. Query string adalah sebutan untuk karakter tambahan di belakang URL atau di belakang penulisan alamat dari sebuah situs. Contohnya apabila kita mengeklik tombol edit pada mahasiswa dengan id = 3, maka akan menuju ke alamat:
http://localhost/crud_sederhana/edit.php?id=3
Tambahan teks “?id=3” inilah yang disebut dengan query string. Karakter tanda tanya (?) merupakan pembatas antara alamat situs dengan query string.
Pada contoh tersebut berarti kita mengirim data berupa variabel “id” yang bernilai “3” ke dalam halaman http://localhost/crud_sederhana/edit.php. Data ini bisa diakses menggunakan variabel $_GET[”id”].
File edit.php akan mengambil nilai $_GET[”id”] dan disimpan pada variabel $id. Setelah itu data mahasiswa yang akan diedit ditampilkan menggunakan query
"SELECT * FROM mahasiswa WHERE id='$id'"
. Hasil query kemudian disimpan pada beberapa variabel. Variabel-variabel ini digunakan untuk mengisi atribut value pada form agar data tersebut dapat tampil di form.
Sekarang buat file edit_proses.php. Lalu isikan kode berikut:
<?php // mengecek apakah tombol edit telah diklik if (isset($_POST['edit'])) { // buat koneksi dengan database include("koneksi.php"); // membuat variabel untuk menampung data dari form edit $id = $_POST['id']; $nim = $_POST['nim']; $nama = $_POST['nama']; $fakultas = $_POST['fakultas']; $jurusan = $_POST['jurusan']; $ipk = (float) $_POST['ipk']; //buat dan jalankan query UPDATE $query = "UPDATE mahasiswa SET "; $query .= "nim = '$nim', nama = '$nama', "; $query .= "fakultas='$fakultas', "; $query .= "jurusan = '$jurusan', ipk=$ipk "; $query .= "WHERE id = '$id'"; $result = mysqli_query($link, $query); //periksa hasil query apakah ada error if(!$result) { die ("Query gagal dijalankan: ".mysqli_errno($link). " - ".mysqli_error($link)); } } //lakukan redirect ke halaman index.php header("location:index.php"); ?>
File edit_proses.php akan mengambil data yang diinput dari form pada halaman edit.php kemudian melakukan update data menggunakan query UPDATE.
Langkah 6 : Menghapus Data
Langkah terakhir yaitu membuat halaman untuk menghapus data. Buat file bernama hapus.php kemudian isi dengan kode berikut:
<?php // buka koneksi dengan MySQL include("koneksi.php"); //mengecek apakah di url ada GET id if (isset($_GET["id"])) { // menyimpan variabel id dari url ke dalam variabel $id $id = $_GET["id"]; //jalankan query DELETE untuk menghapus data $query = "DELETE FROM mahasiswa WHERE id='$id' "; $hasil_query = mysqli_query($link, $query); //periksa query, apakah ada kesalahan if(!$hasil_query) { die ("Gagal menghapus data: ".mysqli_errno($link). " - ".mysqli_error($link)); } } // melakukan redirect ke halaman index.php header("location:index.php"); ?>
Sama seperti halaman edit.php, halaman hapus.php ini dapat diakses melalui link yang terdapat pada kolom Pilihan pada Tabel Biodata Mahasiswa di halaman index.php.
File hapus.php akan mengambil nilai id pada query string menggunakan variabel $_GET[“id”]. Nilai id ini digunakan untuk mengetahui data mahasiswa yang mana yang akan dihapus. Setelah itu data dihapus menggunakan query
"DELETE FROM mahasiswa WHERE id='$id' "
.
Sampai tahap ini kita telah selesai membuat aplikasi CRUD sederhana untuk mengolah data mahasiswa.
Semoga bermanfaat ...
Semoga bermanfaat ...
CRUD Sederhana Menggunakan PHP-MySQL dengan MySQLi extension
Reviewed by Unknown
on
Juli 03, 2017
Rating:
Tidak ada komentar