6 Membuat Aplikasi CRUD Menggunakan PHP MySQLi Dan Bootstrap

Membuat Aplikasi CRUD dengan PHP, MySQLi dan Bootstrap
(Studi Kasus: Data Mahasiswa)
Pada kesempatan kali ini akan dibahas bagaimana cara membuat sebuah
aplikasi untuk mengelola data mahasiswa yaitu Aplikasi CRUD dengan PHP,
MySQLi dan Bootstrap. CRUD adalah singkatan dari Create Read Update Delete,
yaitu istilah untuk perintah ke database yaitu Create=INSERT, Read=SELECT,
Update=UPDATE dan Delete=DELETE. Jadi di aplikasi yang dibuat nantinya bisa
digunakan untuk INSERT, SELECT, UPDATE dan DELETE ke database MySQL dengan
menggunakan query MySQLi, dan tentunya dengan Framework Bootstrap agar
tampilannya lebih bagus.
Pada latihan ini bootstrap yang dipakai online, jadi tidak didownload file
bootstrapnya, kalau file bootstrap mau didownload dan dimasukkan ke dalam
folder aplikasi, silahkan pelajari cara menggunakan Bootstrap di folder lokal/dalam
aplikasi.
Selanjut kita perhatikan file yang akan kita dibuat nanti, yaitu file
yaitu file database.sql, config.php, index.php, tambah.php, edit.php, dan
delete.php. File database.sql digunakan untuk membuat database bisa dibuat
dengan cara mengetikkan melalui phpMyAdmin.
Pertama kita buat database db_akademik dan tabel mahasiswa. Silahkan
diketik pada phpMyAdmin Anda sesuai struktur tabel tersebut.
Script membuat database dan tabel terdapat pada lampiran materi ini
Jika sudah nanti kita akan mendapatkan sebuah tabel dengan

nama mahasiswa dan beberapa data seperti pada gambar di bawah ini
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.
Page 1 of 3
Script membuat file config.php terdapat pada lampiran materi ini
Jangan lupa dirubah detail koneksinya, jika sudah silahkan disimpan, dan
selesai tahapan membuat file config.php
Selanjutnya kita buat file index.php, file ini adalah file utama di mana setiap
kita membuka web maka file index.php ini yang akan di tampilkan pertama kali.
Silahkan buat script file index.php seperti di bawah ini:
Script index.php
Hasil dari file index.php akan tampil seperti di bawah ini
Tahap selanjutnya kita buat file tambah.php, file ini berisi script untuk
melakukan proses penambahan data mahasiswa ke dalam tabel. Ada form input
an dan proses INSERT dengan script PHP.
Script membuat file tambah.php terdapat pada lampiran materi ini
Hasil dari file tambah.php seperti gambar di bawah ini
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
Page 2 of 3
Script membuat file edit.php terdapat pada lampiran materi ini
Hasil dari file edit.php seperti pada gambar di bawah ini
Tahap terakhir yaitu membuat file delete.php, file ini berisi script untuk
menghapus data mahasiswa, dengan query DELETE yang mengambil parameter id
dari URL. Berikut ini scriptnya
Script membuat file delete.php terdapat pada lampiran materi ini
Demikian tahapan untuk membuat aplikasi CRUD dengan menggunakan

PHP, MySQLi dan Bootstrap. Silahkan dikembangkan lagi dengan menambahkan
tabel baru seperti dosen, matakuliah, dan sebagainya untuk meningkatkan
kemampuan anda dalam membuat aplikasi berbasis web.
Page 3 of 3
Lampiran
Script membuat file database db_akademik dan tabel mahasiswa, config.php, index.php, tambah.php, edit.php dan delete.php
1. Membuat database db_akademik dan tabel mahasiswa

Langkah pertama membuat database db_akademik dilanjutkan dengan membuat tabel mahasiswa.
CREATE DATABASE db_akademik;
DROP TABLE IF EXISTS `mahasiswa`;

CREATE TABLE `mahasiswa` (
ìd` int(11) NOT NULL,
`nim` int(11) NOT NULL,
`nama` varchar(50) NOT NULL,
`jenis_kelamin` varchar(20) NOT NULL,
`jurusan` varchar(30) NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=latin1;
ALTER TABLE `mahasiswa`

ADD PRIMARY KEY (ìd`);
ALTER TABLE `mahasiswa`

MODIFY ìd` int(11) NOT NULL AUTO_INCREMENT;
COMMIT;
INSERT INTO `mahasiswa` (ìd`, `nim`, `nama`, `jenis_kelamin`, `jurusan`) VALUES

(1, 11112, 'TEDY SULTONI', 'LAKI-LAKI', 'TEKNIK INFORMATIKA'),
(2, 11113, 'ABDUL KAMIL', 'LAKI-LAKI', 'TEKNIK INFORMATIKA'),
(3, 11114, 'MEGA WATI PUTRI', 'PEREMPUAN', 'TEKNIK INFORMATIKA'),
(4, 11115, 'DWI WAHYUNI', 'PEREMPUAN', 'TEKNIK INFORMATIKA'),
(5, 11116, 'KIWIL', 'LAKI-LAKI', 'TEKNIK INFORMATIKA');
Page 1 of 15
Lampiran
2. Script membuat file config.php
<?php
//koneksi ke database mysql, isi parameter sesuai web server masing-masing
$koneksi = mysqli_connect("localhost","root","","db_akademik");
//cek jika koneksi ke mysql gagal, maka akan tampil pesan error
if (mysqli_connect_errno()){
echo "Gagal melakukan koneksi ke MySQL: " . mysqli_connect_error();
}
?>
3. Script membuat file index.php

<?php
//memasukkan file config.php
include('config.php');
?>
<!DOCTYPE html>
<html>
<head>
<title>CRUD PHP MySQLi</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sh
a384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<div class="container">
<a class="navbar-brand" href="#">CRDU PHP MySQLi</a>
Page 2 of 15
Lampiran
<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>
<div class="container" style="margin-top:20px">

<h2>Daftar Mahasiswa</h2>
<hr>
<table class="table table-striped table-hover table-sm table-bordered">

<thead class="thead-dark">
<tr>
<th>NO.</th>
<th>NIM</th>
<th>NAMA MAHASISWA</th>
Page 3 of 15
Lampiran
<th>JENIS KELAMIN</th>
<th>JURUSAN</th>
<th>AKSI</th>
</tr>
</thead>
<tbody>
<?php
//query ke database SELECT tabel mahasiswa urut berdasarkan id yang paling besar
$sql = mysqli_query($koneksi, "SELECT * FROM mahasiswa ORDER BY id DESC") or die(mysqli_error($koneksi))
;
//jika query diatas menghasilkan nilai > 0 artinya ada data, maka menjalankan script di bawah if...
if(mysqli_num_rows($sql) > 0){
//membuat variabel $no untuk menyimpan nomor urut
$no = 1;
//melakukan perulangan while dengan dari dari query $sql
while($data = mysqli_fetch_assoc($sql)){
//menampilkan data perulangan
echo '
<tr>
<td>'.$no.'</td>
<td>'.$data['nim'].'</td>
<td>'.$data['nama'].'</td>
<td>'.$data['jenis_kelamin'].'</td>
<td>'.$data['jurusan'].'</td>
<td>
<a href="edit.php?id='.$data['id'].'" class="badge badge-warning">Edit</a>
<a href="delete.php?id='.$data['id'].'" class="badge badge-
danger" onclick="return confirm(\'Yakin ingin menghapus data ini?\')">Delete</a>
</td>
</tr>
Page 4 of 15
Lampiran
';
$no++;
}
//jika query menghasilkan nilai 0 artinya tidak ada data
}else{
echo '
<tr>
<td colspan="6">Tidak ada data.</td>
</tr>
';
}
?>
<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>
Page 5 of 15
Lampiran
4. Script membuat file tambah.php

<?php include('config.php'); ?>
<!DOCTYPE html>
<html>
<head>
</head>
<body>
</button>

</li>
<li class="nav-item active">
</li>
</ul>
</div>
Page 6 of 15
Lampiran
</div>
</nav>

<h2>Tambah Mahasiswa</h2>
<hr>
<?php
if(isset($_POST['submit'])){
$nim = $_POST['nim'];
$nama = $_POST['nama'];
$jenis_kelamin = $_POST['jenis_kelamin'];
$jurusan = $_POST['jurusan'];
$cek = mysqli_query($koneksi, "SELECT * FROM mahasiswa WHERE nim='$nim'") or die(mysqli_error($koneksi));
if(mysqli_num_rows($cek) == 0){
$sql = mysqli_query($koneksi, "INSERT INTO mahasiswa(nim, nama, jenis_kelamin, jurusan) VALUES('$nim', '
$nama', '$jenis_kelamin', '$jurusan')") 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, NIM sudah terdaftar.</div>';
}
}
Page 7 of 15
Lampiran
?>
<form action="tambah.php" method="post">

<div class="form-group row">
<label class="col-sm-2 col-form-label">NIM</label>
<div class="col-sm-10">
<input type="text" name="nim" class="form-control" size="4" required>
</div>
</div>
<label class="col-sm-2 col-form-label">NAMA MAHASISWA</label>
<input type="text" name="nama" class="form-control" required>
</div>
</div>
<label class="col-sm-2 col-form-label">JENIS KELAMIN</label>
<div class="form-check">
<input type="radio" class="form-check-input" name="jenis_kelamin" value="LAKI-LAKI" required>
<label class="form-check-label">LAKI-LAKI</label>
</div>
<input type="radio" class="form-check-input" name="jenis_kelamin" value="PEREMPUAN" required>
<label class="form-check-label">PEREMPUAN</label>
</div>
</div>
</div>
<label class="col-sm-2 col-form-label">JURUSAN</label>
Page 8 of 15
Lampiran
<select name="jurusan" class="form-control" required>
<option value="">PILIH JURUSAN</option>
<option value="TEKNIK INFORMATIKA">TEKNIK INFORMATIKA</option>
<option value="TEKNIK SIPIL">TEKNIK SIPIL</option>
<option value="PERTANIAN">PERTANIAN</option>
</select>
</div>
</div>
<label class="col-sm-2 col-form-label"> </label>
<input type="submit" name="submit" class="btn btn-primary" value="SIMPAN">
</div>
</div>
</form>
</div>

</body>
</html>
Page 9 of 15
Lampiran
5. Script membuat file edit.php

<?php include('config.php'); ?>
<!DOCTYPE html>
<html>
<head>
</head>
<body>
</button>

</li>
</li>
</ul>
</div>
Page 10 of 15
Lampiran
</div>
</nav>

<h2>Edit Mahasiswa</h2>
<hr>
<?php
//jika sudah mendapatkan parameter GET id dari URL
if(isset($_GET['id'])){
//membuat variabel $id untuk menyimpan id dari GET id di URL
$id = $_GET['id'];
//query ke database SELECT tabel mahasiswa berdasarkan id = $id

$select = mysqli_query($koneksi, "SELECT * FROM mahasiswa WHERE id='$id'") or die(mysqli_error($koneksi));
//jika hasil query = 0 maka muncul pesan error

if(mysqli_num_rows($select) == 0){
echo '<div class="alert alert-warning">ID tidak ada dalam database.</div>';
exit();
//jika hasil query > 0
}else{
//membuat variabel $data dan menyimpan data row dari query
$data = mysqli_fetch_assoc($select);
}
}
?>
<?php
Page 11 of 15
Lampiran
//jika tombol simpan di-klik

if(isset($_POST['submit'])){
$nama = $_POST['nama'];
$jenis_kelamin = $_POST['jenis_kelamin'];
$jurusan = $_POST['jurusan'];
$sql = mysqli_query($koneksi, "UPDATE mahasiswa SET nama='$nama', jenis_kelamin='$jenis_kelamin', jurusan='$

jurusan' WHERE id='$id'") or die(mysqli_error($koneksi));
if($sql){
echo '<script>alert("Berhasil menyimpan data."); document.location="edit.php?id='.$id.'";</script>';
}else{
echo '<div class="alert alert-warning">Gagal melakukan proses edit data.</div>';
}
}
?>
<form action="edit.php?id=<?php echo $id; ?>" method="post">

<label class="col-sm-2 col-form-label">NIM</label>
<input type="text" name="nim" class="form-
control" size="4" value="<?php echo $data['nim']; ?>" readonly required>
</div>
</div>
<label class="col-sm-2 col-form-label">NAMA MAHASISWA</label>
<input type="text" name="nama" class="form-control" value="<?php echo $data['nama']; ?>" required>
</div>
Page 12 of 15
Lampiran
</div>
<label class="col-sm-2 col-form-label">JENIS KELAMIN</label>
<input type="radio" class="form-check-input" name="jenis_kelamin" value="LAKI-
LAKI" <?php if($data['jenis_kelamin'] == 'LAKI-LAKI'){ echo 'checked'; } ?> required>
<label class="form-check-label">LAKI-LAKI</label>
</div>
<input type="radio" class="form-check-
input" name="jenis_kelamin" value="PEREMPUAN" <?php if($data['jenis_kelamin'] == 'PEREMPUAN'){ echo 'checked'; } ?> requ
ired>
<label class="form-check-label">PEREMPUAN</label>
</div>
</div>
</div>
<label class="col-sm-2 col-form-label">JURUSAN</label>
<select name="jurusan" class="form-control" required>
<option value="">PILIH JURUSAN</option>
<option value="TEKNIK INFORMATIKA" <?php if($data['jurusan'] == 'TEKNIK INFORMATIKA'){ echo 'sel
ected'; } ?>>TEKNIK INFORMATIKA</option>
<option value="TEKNIK SIPIL" <?php if($data['jurusan'] == 'TEKNIK SIPIL'){ echo 'selected'; } ?>
>TEKNIK SIPIL</option>
<option value="PERTANIAN" <?php if($data['jurusan'] == 'PERTANIAN'){ echo 'selected'; } ?>>PERTA
NIAN</option>
</select>
</div>
Page 13 of 15
Lampiran
</div>
<label class="col-sm-2 col-form-label"> </label>
<input type="submit" name="submit" class="btn btn-primary" value="SIMPAN">
<a href="index.php" class="btn btn-warning">KEMBALI</a>
</div>
</div>
</form>
</div>

</body>
</html>
Page 14 of 15
Lampiran
6. Script membuat file delete.php

<?php
//include file config.php
include('config.php');
//jika benar mendapatkan GET id dari URL

if(isset($_GET['id'])){
//membuat variabel $id yang menyimpan nilai dari $_GET['id']
$id = $_GET['id'];
//melakukan query ke database, dengan cara SELECT data yang memiliki id yang sama dengan variabel $id
$cek = mysqli_query($koneksi, "SELECT * FROM mahasiswa WHERE id='$id'") or die(mysqli_error($koneksi));
//jika query menghasilkan nilai > 0 maka eksekusi script di bawah

if(mysqli_num_rows($cek) > 0){
//query ke database DELETE untuk menghapus data dengan kondisi id=$id
$del = mysqli_query($koneksi, "DELETE FROM mahasiswa WHERE id='$id'") 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>';
}
}else{
echo '<script>alert("ID tidak ditemukan di database."); document.location="index.php";</script>';
}
}else{
echo '<script>alert("ID tidak ditemukan di database."); document.location="index.php";</script>';
}
?>
Page 15 of 15

6 Membuat Aplikasi CRUD Menggunakan PHP MySQLi Dan Bootstrap

Diunggah oleh

Informasi Dokumen

Hak Cipta

Format Tersedia

Bagikan dokumen Ini

Bagikan atau Tanam Dokumen

Opsi Berbagi

Apakah menurut Anda dokumen ini bermanfaat?

Apakah konten ini tidak pantas?

Hak Cipta:

Format Tersedia

6 Membuat Aplikasi CRUD Menggunakan PHP MySQLi Dan Bootstrap

Diunggah oleh

Hak Cipta:

Format Tersedia

Membuat Aplikasi CRUD dengan PHP, MySQLi dan Bootstrap

(Studi Kasus: Data Mahasiswa)

Jika sudah nanti kita akan mendapatkan sebuah tabel dengan

Hasil dari file index.php akan tampil seperti di bawah ini

Script membuat file tambah.php terdapat pada lampiran materi ini

Hasil dari file tambah.php seperti gambar di bawah ini

Hasil dari file edit.php seperti pada gambar di bawah ini

Script membuat file delete.php terdapat pada lampiran materi ini

Demikian tahapan untuk membuat aplikasi CRUD dengan menggunakan

1. Membuat database db_akademik dan tabel mahasiswa

CREATE DATABASE db_akademik;

DROP TABLE IF EXISTS `mahasiswa`;

ALTER TABLE `mahasiswa`

ALTER TABLE `mahasiswa`

INSERT INTO `mahasiswa` (`id`, `nim`, `nama`, `jenis_kelamin`, `jurusan`) VALUES

2. Script membuat file config.php

3. Script membuat file index.php

<button class="navbar-toggler" type="button" data-toggle="collapse" data-

<div class="collapse navbar-collapse" id="navbarSupportedContent">

<div class="container" style="margin-top:20px">

<table class="table table-striped table-hover table-sm table-bordered">

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-

4. Script membuat file tambah.php

<div class="collapse navbar-collapse" id="navbarSupportedContent">

<div class="container" style="margin-top:20px">

$cek = mysqli_query($koneksi, "SELECT * FROM mahasiswa WHERE nim='$nim'") or die(mysqli_error($koneksi));

<form action="tambah.php" method="post">

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-

5. Script membuat file edit.php

<div class="collapse navbar-collapse" id="navbarSupportedContent">

<div class="container" style="margin-top:20px">

//query ke database SELECT tabel mahasiswa berdasarkan id = $id

//jika hasil query = 0 maka muncul pesan error

//jika tombol simpan di-klik

$sql = mysqli_query($koneksi, "UPDATE mahasiswa SET nama='$nama', jenis_kelamin='$jenis_kelamin', jurusan='$

<form action="edit.php?id=<?php echo $id; ?>" method="post">

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-

6. Script membuat file delete.php

//jika benar mendapatkan GET id dari URL

//jika query menghasilkan nilai > 0 maka eksekusi script di bawah

Anda mungkin juga menyukai