Updated 11 August 2022 by Heru - Tutorial
#PHP #MySQLi #Bootstrap
Hari ini kita akan mencoba membuat CRUD (Create, Read, Update and Delete) dengan PHP, MySQLi dan Bootstrap untuk mempercantik tampilannya.
Daftar Isi : - Membuat database dan tabel nya
- Membuat folder project
- Membuat file koneksi.php
- Membuat file input (Create)
- Menampilkan, mengedit dan menghapus data (Read, Update and Delete)
- Membuat
file update.php
Membuat database dan tabel nya
Silakan buka XAMPP dan jalankan Apache dan MySQL nya, lalu buka browser dan ketikkan :
http://localhost/phpmyadmin
Buat database baru (misal crud) dengan mengetikkan perintah di menu New – SQL :
create database crud;
Lalu klik Go, maka database crud akan terbuat. Silakan klik database tersebut untuk masuk ke dalam nya.
Setelah masuk ke dalam database crud, kemudian buat tabel
anggota di dalam database tersebut dengan mengetikkan di menu SQL:
create table anggota(
id_anggota int not null auto_increment primary key,
username varchar (50),
nama varchar(50),
alamat varchar(50),
email varchar(30),
no_hp char(13)
);
Tabel diatas akan berisi kolom/field id_anggota, username, nama, alamat, email dan no_hp dengan type data sesuai yang dituliskan diatas.
Membuat folder project
Buat folder crud di htdocs untuk folder projectnya.
Didalam folder crud buat folder bootstrap. Kemudian download bootstrap di
https://getbootstrap.com/, lalu ekstrak
Copy folder css dan js hasil ekstrakan tadi ke folder bootstrap yang sudah kalian buat
Membuat file koneksi.php
Untuk menghubungan database yang telah dibuat dengan file php yang nanti akan kita buat, dibutuhkan sebuah koneksi untuk menghubungkan keduanya. Buat file koneksi.php dengan isi sebagai berikut :
php
$host="localhost";
$user="root";
$password="";
$db="crud";
$kon = mysqli_connect($host,$user,$password,$db);
if (!$kon){
die("Koneksi gagal:".mysqli_connect_error());
}
?>
File koneksi.php tersebut
akan menghubungkan kita ke database dengan memanggil mysqli_connect($host,$user,$password,$db) .
Jika gagal terhubung, maka akan ada keterangan koneksi gagal beserta keterangan errornya karena kita sudah memberikan perintah mysqli_connect_error()
Untuk menginput data yang diinginkan, kita akan membuat file create.php. Untuk mempercantik tampilannya kita menggunakan Bootstrap. Silakan buat seperti ini :
<html>
<head>
<title>Form Pendaftaran Anggotatitle>
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css">
head>
<body>
<div class="container">
//Include file koneksi, untuk koneksikan ke database
include "koneksi.php";
//Fungsi untuk mencegah inputan karakter yang tidak sesuai
function input($data) {
$data = trim($data);
$data = stripslashes($data);
$data = htmlspecialchars($data);
return $data;
}
//Cek apakah ada kiriman form dari method post
if ($_SERVER["REQUEST_METHOD"] == "POST") {
$username=input($_POST["username"]);
$nama=input($_POST["nama"]);
$alamat=input($_POST["alamat"]);
$email=input($_POST["email"]);
$no_hp=input($_POST["no_hp"]);
//Query input menginput data kedalam tabel anggota
$sql="insert into anggota (username,nama,alamat,email,no_hp) values
('$username','$nama','$alamat','$email','$no_hp')";
//Mengeksekusi/menjalankan query diatas
$hasil=mysqli_query($kon,$sql);
//Kondisi apakah berhasil atau tidak dalam mengeksekusi query diatas
if ($hasil) {
header("Location:index.php");
}
else {
echo " Data Gagal disimpan.
";
}
}
?>
<h2>Input Datah2>
<form action="PHP_SELF"];?>" method="post">
<div class="form-group">
<label>Username:label>
<input type="text" name="username" class="form-control" placeholder="Masukan Username" required />
div>
<div class="form-group">
<label>Nama:label>
<input type="text" name="nama" class="form-control" placeholder="Masukan Nama" required/>
div>
<div class="form-group">
<label>Alamat:label>
<textarea name="alamat" class="form-control" rows="5"placeholder="Masukan Alamat" required>textarea>
div>
<div class="form-group">
<label>Email:label>
<input type="email" name="email" class="form-control" placeholder="Masukan Email" required/>
div>
<div class="form-group">
<label>No HP:label>
<input type="text" name="no_hp" class="form-control" placeholder="Masukan No HP" required/>
div>
<button type="submit" name="submit" class="btn btn-primary">Submitbutton>
form>
div>
body>
html>
Menampilkan, mengedit dan menghapus data (Read, Update and Delete)
Untuk menampilkan hasil inputan yang telah dilakaukan, mari kita buat file index.php untuk menanganinya. Silakan buat seperti dibawah ini :
<html>
<head>
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css">
head>
<body>
<div class="container">
<br>
<h4>CRUD Sederhana dengan PHP dan Bootstraph4>
include "koneksi.php";
//Cek apakah ada nilai dari method GET dengan nama id_anggota
if (isset($_GET['id_anggota'])) {
$id_anggota=htmlspecialchars($_GET["id_anggota"]);
$sql="delete from anggota where id_anggota='$id_anggota' ";
$hasil=mysqli_query($kon,$sql);
//Kondisi apakah berhasil atau tidak
if ($hasil) {
header("Location:index.php");
}
else {
echo " Data Gagal dihapus.
";
}
}
?>
<table class="table table-bordered table-hover">
<br>
<thead>
<tr>
<th>Noth>
<th>Usernameth>
<th>Namath>
<th>Alamatth>
<th>Emailth>
<th>No HPth>
<th colspan='2'>Aksith>
tr>
thead>
include "koneksi.php";
$sql="select * from anggota order by id_anggota desc";
$hasil=mysqli_query($kon,$sql);
$no=0;
while ($data = mysqli_fetch_array($hasil)) {
$no++;
?>
<tbody>
<tr>
<td>td>
<td>td>
<td>td>
<td>td>
<td>td>
<td>td>
<td>
<a href="update.php?id_anggota=" class="btn btn-warning" role="button">Updatea>
<a href="PHP_SELF"]);?>?id_anggota=" class="btn btn-danger" role="button">Deletea>
td>
tr>
tbody>
}
?>
table>
<a href="create.php" class="btn btn-primary" role="button">Tambah Dataa>
div>
body>
html>
Membuat file update.php
Untuk menjalankan perintah update pada index.php, dibutuhkan script update.php seperti dibawah ini :
<html>
<head>
<title>Form Pendaftaran Anggotatitle>
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css">
head>
<body>
<div class="container">
//Include file koneksi, untuk koneksikan ke database
include "koneksi.php";
//Fungsi untuk mencegah inputan karakter yang tidak sesuai
function input($data) {
$data = trim($data);
$data = stripslashes($data);
$data = htmlspecialchars($data);
return $data;
}
//Cek apakah ada nilai yang dikirim menggunakan methos GET dengan nama id_anggota
if (isset($_GET['id_anggota'])) {
$id_anggota=input($_GET["id_anggota"]);
$sql="select * from anggota where id_anggota=$id_anggota";
$hasil=mysqli_query($kon,$sql);
$data = mysqli_fetch_assoc($hasil);
}
//Cek apakah ada kiriman form dari method post
if ($_SERVER["REQUEST_METHOD"] == "POST") {
$id_anggota=htmlspecialchars($_POST["id_anggota"]);
$username=input($_POST["username"]);
$nama=input($_POST["nama"]);
$alamat=input($_POST["alamat"]);
$email=input($_POST["email"]);
$no_hp=input($_POST["no_hp"]);
//Query update data pada tabel anggota
$sql="update anggota set
username='$username',
nama='$nama',
alamat='$alamat',
email='$email',
no_hp='$no_hp'
where id_anggota=$id_anggota";
//Mengeksekusi atau menjalankan query diatas
$hasil=mysqli_query($kon,$sql);
//Kondisi apakah berhasil atau tidak dalam mengeksekusi query diatas
if ($hasil) {
header("Location:index.php");
}
else {
echo " Data Gagal diupdate.
";
}
}
?>
<h2>Update Datah2>
<form action="PHP_SELF"]);?>" method="post">
<div class="form-group">
<label>Username:label>
<input type="text" name="username" class="form-control" value="" placeholder="Masukan Username" required />
div>
<div class="form-group">
<label>Nama:label>
<input type="text" name="nama" class="form-control" value="" placeholder="Masukan Nama" required/>
div>
<div class="form-group">
<label>Alamat:label>
<textarea name="alamat" class="form-control" rows="5" placeholder="Masukan Alamat" required>textarea>
div>
<div class="form-group">
<label>Email:label>
<input type="email" name="email" class="form-control" value="" placeholder="Masukan Email" required/>
div>
<div class="form-group">
<label>No HP:label>
<input type="text" name="no_hp" class="form-control" value="" placeholder="Masukan No HP" required/>
div>
<input type="hidden" name="id_anggota" value="" />
<button type="submit" name="submit" class="btn btn-primary">Submitbutton>
form>
div>
body>
html>
Sekarang silakan dicoba di browser dengan mengetikkan http://localhost/crud dan lihat hasilnya.
Untuk demo online bisa dilihat disini, namun ada warning milik 000webhost mengenai header("Location:index.php") yang belum saya perbaiki dan masih saya cari tahu penyebabnya. Secara keseluruhan program berjalan lancar jika di hosting, hanya muncul warning dari 000webhost. Jika di localhost tidak muncul warning tersebut. Untuk di hosting tentu
database pada koneksi.php nya harus disesuaikan terlebih dahulu.
Semoga bermanfaat.
Lihat tutorial PHP lainnya di : Belajar PHP
Dukungan untuk Belajarisme
Suka dengan tulisan ini ? Kamu bisa memberikan dukungan dengan mentraktir kopi di
trakteer.id atau membagikan konten ini ke sosial media dan teman mu.
Apa itu CRUD pada php?
CRUD merupakan istilah populer pada kalangan back end developer. Merupakan singkatan dari Create, Read, Update, dan Delete. Sebuah proses yang memiliki keterkaitan dengan transaksi atau pengambilan data dari dan atau ke database.
Langkah langkah membuat CRUD?
Tutorial Membuat Aplikasi CRUD Dengan PHP dan MySQL.
STEP 1 – Persiapan..
STEP 2 – Membuat Database..
STEP 3 – Buat Koneksi Database..
STEP 4 – Buat View Data..
STEP 5 – Buat Insert Data..
STEP 6 – Buat Update Data..
STEP 7 – Buat Delete Data..
STEP 8 – Buat Cetak Laporan..
Apa itu CRUD di HTML?
Pengertian CRUD adalah kepanjangan dari Create, Read, Update dan Delete. Keempat istilah ini merupakan perintah atau query yang digunakan programmer untuk melakukan aksi melalui database relasional.
Apa itu fungsi CRUD?
CRUD adalah singkatan dari create, read, update, dan delete. Kegunaan dari pemrograman CRUD adalah untuk membaca, menyisipkan, memanipulasi, mengedit, dan menghapus data tabel. Peran CRUD sangat krusial karena berhubungan dengan sistem informasi perusahaan.
