Anda di halaman 1dari 23

HRIS PROGRAMMING INTRODUCTION

PHP CRUD Dengan MySQLi dan Bootstrap (Create, Read, Update, Delete)

CRUD adalah singkatan dari Create Read Update Delete, yaitu istilah untuk perintah ke database yaitu
Create=INSERT, Read=SELECT, Update=UPDATE dan Delete=DELETE.

Kita akan mencoba membuat INSERT, SELECT, UPDATE dan


DELETE ke database MySQL dengan menggunakan query MySQLi, dan Framework Bootstrap.
Database

1. DATABASE : kita buat database nya dulu dengan nama : employee


CREATE TABLE `table_employee` (
`id_emp` VARCHAR(7) NULL DEFAULT NULL COLLATE 'utf8mb4_general_ci',
`nik` INT(11) NULL DEFAULT NULL,
`full_name` VARCHAR(200) NULL DEFAULT NULL COLLATE 'utf8mb4_general_ci'
)
COLLATE='utf8mb4_general_ci'
ENGINE=InnoDB
;
PHP CRUD Dengan MySQLi dan Bootstrap (Create, Read, Update, Delete)

2. Config

File config.php ini kita buat untuk melakukan koneksi ke database, jadi file ini nantinya
akan di include
ke setiap file yang akan kita buat supaya bisa berhubungan dengan database.
<?php
$koneksi = mysqli_connect("localhost","root","","employee_training");
if (mysqli_connect_errno()){
echo "Gagal melakukan koneksi ke MySQL: " . mysqli_connect_error();
}
?>
PHP CRUD Dengan MySQLi dan Bootstrap (Create, Read, Update, Delete)

3. index.php (READ)

Selanjutnya kita buat file index.php, file ini adalah file utama dimana setiap kita membuka
web maka
file index.php ini yang akan di tampilkan pertama kali
<?php
include('config.php');
?>
<!DOCTYPE html>
<html>
<head>
<title>WEB.COM</title>
<link rel="stylesheet"
href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css"
integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO"
crossorigin="anonymous">
</head>
PHP CRUD Dengan MySQLi dan Bootstrap (Create, Read, Update, Delete)

<body>
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<div class="container">
<a class="navbar-brand" href="#">CRUD PHP</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-
target="#navbarSupportedContent" aria-controls="navbarSupportedContent"
aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="index.php">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="tambah.php">Tambah</a>
</li>
</ul>
</div>
</div>
</nav>
PHP CRUD Dengan MySQLi dan Bootstrap (Create, Read, Update, Delete)
<div class="container" style="margin-top:20px">
<h2>Daftar Karyawan</h2>
<hr>
<table class="table table-striped table-hover table-sm table-bordered">
<thead class="thead-dark">
<tr>
<th>NO.</th>
<th>ID</th>
<th>NIK</th>
<th>NAMA</th>
<th>ACTION</th>
</tr>
</thead>
<tbody>
PHP CRUD Dengan MySQLi dan Bootstrap (Create, Read, Update, Delete)
<?php
$sql = mysqli_query($koneksi, "SELECT * FROM table_employee ORDER BY id_emp DESC") or
die(mysqli_error($koneksi));

if(mysqli_num_rows($sql) > 0){


$no = 1;
while($data = mysqli_fetch_assoc($sql)){
echo '
<tr>
<td>'.$no.'</td>
<td>'.$data['id_emp'].'</td>
<td>'.$data['nik'].'</td>
<td>'.$data['full_name'].'</td>
<td>
<a href="edit.php?id='.$data['id_emp'].'"
class="badge badge-warning">Edit</a>
<a
href="delete.php?id='.$data['id_emp'].'" class="badge badge-
danger" onclick="return confirm(\'Yakin ingin
menghapus data ini?\')">Delete</a>
</td>
</tr>
';
$no++;
}
} else{
echo '
<tr>
<td colspan="6">Tidak ada data.</td>
</tr>
';
}
?>
PHP CRUD Dengan MySQLi dan Bootstrap (Create, Read, Update, Delete)
<tbody>
</table>
</div>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-
q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"
integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49"
crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"
integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy"
crossorigin="anonymous"></script>
</body>
</html>
PHP CRUD Dengan MySQLi dan Bootstrap (Create, Read, Update, Delete)

4. tambah.php (create)

Tahapan selanjutnya kita buat file tambah.php, file ini berisi script untuk melakukan proses
penambahan data. Ada form input an dan proses INSERT dengan script PHP, silahkan tulis
file di bawah
ini:
<?php
include('config.php');
?>
<!DOCTYPE html>
<html>
<head>
<title>GTHRIS.COM</title>
<link rel="stylesheet"
href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css"
integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO"
crossorigin="anonymous">
</head>
PHP CRUD Dengan MySQLi dan Bootstrap (Create, Read, Update, Delete)
<body>
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<div class="container">
<a class="navbar-brand" href="#">CRUD PHP</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-
target="#navbarSupportedContent" aria-controls="navbarSupportedContent"
aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item">
<a class="nav-link" href="index.php">Home</a>
</li>
<li class="nav-item active">
<a class="nav-link" href="tambah.php">Tambah</a>
</li>
</ul>
</div>
</div>
</nav>
PHP CRUD Dengan MySQLi dan Bootstrap (Create, Read, Update, Delete)
<div class="container" style="margin-top:20px">
<h2>Tambah Karyawan</h2>
<hr>
<?php
if(isset($_POST['submit'])){
$id_emp = $_POST['id_emp'];
$nik = $_POST['nik'];
$full_name = $_POST['full_name'];

$cek = mysqli_query($koneksi, "SELECT * FROM table_employee WHERE id_emp='$id_emp'")


or die(mysqli_error($koneksi));
if(mysqli_num_rows($cek) == 0){
$sql = mysqli_query($koneksi, "INSERT INTO table_employee(id_emp, nik,
full_name) VALUES('$id_emp', '$nik',
'$full_name'") or
die(mysqli_error($koneksi));
if($sql){
echo '<script>alert("Berhasil menambahkan data.");
document.location="tambah.php";</script>';
}else{
echo '<div class="alert alert-warning">Gagal melakukan
proses tambah data.</div>';
}
}else{
echo '<div class="alert alert-warning">Gagal, id_emp sudah
terdaftar.</div>';
}
}
?>
PHP CRUD Dengan MySQLi dan Bootstrap (Create, Read, Update, Delete)
<form action="tambah.php" method="post">
<div class="form-group row">
<label class="col-sm-2 col-form-label">id_emp</label>
<div class="col-sm-10">
<input type="text" name="id_emp" class="form-control" size="4"
required>
</div>
</div>
<div class="form-group row">
<label class="col-sm-2 col-form-label">nik</label>
<div class="col-sm-10">
<input type="text" name="nik" class="form-control" required>
</div>
</div>

<div class="form-group row">


<label class="col-sm-2 col-form-label">nama</label>
<div class="col-sm-10">
<input type="text" name="full_name" class="form-control" required>
</div>
</div>

<div class="form-group row">


<label class="col-sm-2 col-form-label">&nbsp;</label>
<div class="col-sm-10">
<input type="submit" name="submit" class="btn btn-primary“
value="SIMPAN">
</div>
</div>
</form>
PHP CRUD Dengan MySQLi dan Bootstrap (Create, Read, Update, Delete)
</div>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-
q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"
integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49"
crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"
integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy"
crossorigin="anonymous"></script>
</body>
</html>
PHP CRUD Dengan MySQLi dan Bootstrap (Create, Read, Update, Delete)

6. edit.php (update)

File edit.php digunakan untuk melakukan proses edit/update data, file ini akan
menampilkan form
yang sama dengan form tambah.php, bedanya di edit.php ini akan mengambil data ke
database tabel
mahasiswa dengan kondisi id = $_GET[‘id’] yang di dapatkan dari URL. Berikut ini script
untuk edit.php
<?php
include('config.php');
?>
<!DOCTYPE html>
<html>
<head>
<title>GTHRIS.COM</title>
<link rel="stylesheet"
href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css"
integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO"
crossorigin="anonymous">
</head>
PHP CRUD Dengan MySQLi dan Bootstrap (Create, Read, Update, Delete)
<body>
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<div class="container">
<a class="navbar-brand" href="#">CRUD PHP</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-
target="#navbarSupportedContent" aria-controls="navbarSupportedContent"
aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item">
<a class="nav-link" href="index.php">Home</a>
</li>
<li class="nav-item active">
<a class="nav-link" href="tambah.php">Tambah</a>
</li>
</ul>
</div>
</div>
</nav>
PHP CRUD Dengan MySQLi dan Bootstrap (Create, Read, Update, Delete)
<div class="container" style="margin-top:20px">
<h2>Edit Employee</h2>
<hr>
<?php

if(isset($_GET['id'])){

$id_emp = $_GET['id'];

$select = mysqli_query($koneksi, "SELECT * FROM table_employee WHERE id_emp='$id_emp'") or


die(mysqli_error($koneksi));
if(mysqli_num_rows($select) == 0){
echo '<div class="alert alert-warning">ID tidak ada dalam database.</div>';
exit();
}else{
$data = mysqli_fetch_assoc($select);
}
}
?>
PHP CRUD Dengan MySQLi dan Bootstrap (Create, Read, Update, Delete)
<?php
//jika tombol simpan di tekan/klik
if(isset($_POST['submit'])){
$id_emp = $_GET['id'];
$full_name = $_POST['full_name'];
$nik = $_POST['nik'];

$sql = mysqli_query($koneksi, "UPDATE table_employee SET full_name='$full_name',


nik='$nik' WHERE id_emp='$id_emp'") or die(mysqli_error($koneksi));
if($sql){
echo '<script>alert("Berhasil menyimpan data.");
document.location="edit.php?id='.$id_emp.'";</script>';
}else{
echo '<div class="alert alert-warning">Gagal melakukan proses edit
data.</div>';
}
}
?>
PHP CRUD Dengan MySQLi dan Bootstrap (Create, Read, Update, Delete)
<form action="edit.php?id=<?php echo $id_emp; ?>" method="post">
<div class="form-group row">
<label class="col-sm-2 col-form-label">id emp</label>
<div class="col-sm-10">
<input type="text" name="id_emp" class="form-control" size="4"
value="<?php echo $data['id_emp']; ?>" readonly required>
</div>
</div>
<div class="form-group row">
<label class="col-sm-2 col-form-label">Nama</label>
<div class="col-sm-10">
<input type="text" name="full_name" class="form-control" value="<?php echo
$data['full_name']; ?>"
required>
</div>
</div>

<div class="form-group row">


<label class="col-sm-2 col-form-label">Nik</label>
<div class="col-sm-10">
<input type="text" name="nik" class="form-control"
value="<?php echo $data['nik']; ?>"
required>
</div>
</div>

<div class="form-group row">


<label class="col-sm-2 col-form-label">&nbsp;</label>
<div class="col-sm-10">
<input type="submit" name="submit" class="btn btn-primary" value="SIMPAN">
<a href="index.php" class="btn btn-warning">KEMBALI</a>
</div>
</div>
</form>
PHP CRUD Dengan MySQLi dan Bootstrap (Create, Read, Update, Delete)
</div>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-
q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"
integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49"
crossorigin="anonymous">
</script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"
integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy"
crossorigin="anonymous">
</script>
</body>
</html>
PHP CRUD Dengan MySQLi dan Bootstrap (Create, Read, Update, Delete)

3. delete.php (DELETE)

Yang terakhir yaitu membuat file delete.php, file ini berisi script untuk menghapus data,
dengan query DELETE yang mengambil parameter id dari URL. Berikut ini script nya.
<?php
include('config.php');
if(isset($_GET['id_emp'])){
$id_emp = $_GET['id_emp'];

$cek = mysqli_query($koneksi, "SELECT * FROM table_employee WHERE id_emp='$id_emp'")


or die(mysqli_error($koneksi));
if(mysqli_num_rows($cek) > 0){
$del = mysqli_query($koneksi, "DELETE FROM table_employee WHERE id_emp='$id_emp'")
or
die(mysqli_error($koneksi));
if($del){
echo '<script>alert("Berhasil menghapus data.");
document.location="index.php";</script>';
}else{
echo '<script>alert("Gagal menghapus data.");
document.location="index.php";</script>';
}
?>
PHP CRUD Dengan MySQLi dan Bootstrap (Create, Read, Update, Delete)

3. delete.php (DELETE)

Yang terakhir yaitu membuat file delete.php, file ini berisi script untuk menghapus data,
dengan query DELETE yang mengambil parameter id dari URL. Berikut ini script nya.
<?php
include('config.php');
if(isset($_GET['id_emp'])){
$id_emp = $_GET['id_emp'];

$cek = mysqli_query($koneksi, "SELECT * FROM table_employee WHERE id_emp='$id_emp'")


or die(mysqli_error($koneksi));
if(mysqli_num_rows($cek) > 0){
$del = mysqli_query($koneksi, "DELETE FROM table_employee WHERE id_emp='$id_emp'")
or
die(mysqli_error($koneksi));
if($del){
echo '<script>alert("Berhasil menghapus data.");
document.location="index.php";</script>';
}else{
echo '<script>alert("Gagal menghapus data.");
document.location="index.php";</script>';
}
?>
Q&A
#HRISsharingiscaring
THANK YOU
#HRISsharingiscaring

Anda mungkin juga menyukai