�ݺ�ߣ

Membuat CRUD dengan PHP7 dan
MySQLi + Framework Bootstrap
Software pendukung
? Xampp
? Editor
? Browser
1. Buatlah database akademik
2. Buatlah tbl_siswa
3. Tambahkan data

4. Hasil penambahan data
5. Buat file koneksi.php
<?php
$koneksi = mysqli_connect("localhost","root","","akademik");
// mengecek koneksi
if (mysqli_connect_errno()){
echo "Koneksi database gagal : " . mysqli_connect_error();
}
?>

6. Buatlah file index.php
<!DOCTYPE html>
<html>
<head>
<title>DATA SISWA</title>
</head>
<body>
<H2>Data Siswa</H2><br/>
<a href="tambah.php"> +Tambah Siswa</a>
<table border="1" width="50%">
<tr>
<th>No</th>
<th>Nama</th>
<th>NIS</th>
<th>Alamat</th>
<th>Opsi</th>
</tr>
<?php
include 'koneksi.php';
$no=1;
$data = mysqli_query($koneksi, "select * from tbl_siswa");
while ($d = mysqli_fetch_array($data)) {
?>
<tr>
<td><?php echo $no++; ?></td>
<td><?php echo $d['nama']; ?></td>
<td><?php echo $d['nis']; ?></td>
<td><?php echo $d['alamat']; ?></td>
<td>
<a href="edit.php?id=<?php echo $d['id']; ?>">Edit</a>
<a href="hapus.php?id=<?php echo $d['id']; ?>">Hapus</a>
</td>
</tr>
<?php
}
?>
</table>
</body>
</html>
7. Run browser http://localhost/crudphp7/index.php

8. Buat file tambah.php
<!DOCTYPE html>
<html>
<head>
<title>tambah siswa</title>
</head>
<body>
<a href="index.php">Kembali</a><br/>
<h2>Tambah Data siswa</h2>
<form method="post" action="tambah_aksi.php">
nama : <input type="text" name="nama"><br/>
nis : <input type="text" name="nis"><br/>
alamat : <input type="text" name="alamat"><br/>
<input type="submit" value="Simpan">
</form>
</body>
</html>
9. Buat file tambah_aksi.php
<?php
//koneksi ke database
// menangkap data yang di kirim dari form
$nama = $_POST['nama'];
$nis = $_POST['nis'];
$alamat = $_POST['alamat'];
// menginput data ke database
mysqli_query($koneksi, "insert into tbl_siswa values('','$nama','$nis','$alamat')");
header("location:index.php");
?>
10. Run browser klik tambah siswa

12. Buat file edit.php
<html>
<head>
<title>edit</title>
</head>
<body>
<a href="index.php">KEMBALI</a>
<br/>
<h3>EDIT DATA MAHASISWA</h3>
<?php
$id = $_GET['id'];
$data = mysqli_query($koneksi,"select * from tbl_siswa where id='$id'");
while($d = mysqli_fetch_array($data)){
?>
<form method="post" action="update.php">
<input type="hidden" name="id" value="<?php echo $d['id']; ?>">
Nama : <input type="text" name="nama" value="<?php echo $d['nama'];
?>"><br/>
NIS : <input type="number" name="nis" value="<?php echo $d['nis'];
?>"><br/>
Alamat : <input type="text" name="alamat" value="<?php echo
$d['alamat']; ?>"><br/>
<input type="submit" value="edit">
</form>
<?php
}
?>
</body>
</html>

13. Buat file udpate.php untuk proses update data
<?php
// koneksi database
// menangkap data yang di kirim dari form
$id = $_POST['id'];
$nama = $_POST['nama'];
$nis = $_POST['nis'];
$alamat = $_POST['alamat'];
// update data ke database
mysqli_query($koneksi,"update tbl_siswa set nama='$nama', nis='$nis',
alamat='$alamat' where id='$id'");
// mengalihkan halaman kembali ke index.php
?>
14. Run browser klik edit
15. Hasil proses edit

16. Buat file hapus.php
<?php
// koneksi database
// menangkap data id yang di kirim dari url
$id = $_GET['id'];
// menghapus data dari database
mysqli_query($koneksi, "delete from tbl_siswa where id='$id'");
// mengalihkan halaman kembali ke index.php
?>
17. Run browser klik hapus salah satu data
18. Tambahkan validasi input, edit dan hapus

Membuat Tampilan Dengan Bootrap
Cara menggunakan framework bootraps
1. Download file : https://getbootstrap.com/
2. Setelah di download extra file 3 folder gabungan dengan folder projek di htdoc
Langkah menggunakan framework bootraps
1. Tambahkan kodingan dibawah head pada file index.php
<head>
<title>DATA SISWA</title>

<link rel="stylesheet" href="css/bootstrap.min.css" />
<script src=/slideshow/crud-php7-mysq-li-bootstrap/229559958/"js/bootstrap.min.js"></script>
</head>
2. Tambabkan class pada table
<H2>Data Siswa</H2><br/>
<a href="tambah.php" class="btn btn-info" role="button"> +Tambah Siswa</a>
<table class="table table-hover">
<tr>
<th>No</th>
<th>Nama</th>
<th>NIS</th>
<th>Alamat</th>
<th>Opsi</th>
</tr>
<?php
$no=1;
$data = mysqli_query($koneksi, "select * from tbl_siswa");
while ($d = mysqli_fetch_array($data)) {
?>
<tr>
<td><?php echo $no++; ?></td>
<td><?php echo $d['nama']; ?></td>
<td><?php echo $d['nis']; ?></td>
<td><?php echo $d['alamat']; ?></td>
<td>
<a href="edit.php?id=<?php echo $d['id']; ?>" class="btn btn-
primary" role="button">Edit</a>
<a href="hapus.php?id=<?php echo $d['id']; ?>" class="btn btn-

danger" role="button">Hapus</a>
</td>
</tr>
<?php
}
?>
</table>

3. Lihat hasil
4. Tambahkan kodingan di file tambah.php
<head>
<title>tambah siswa</title>

<link rel="stylesheet" href="css/bootstrap.min.css" />
<script src=/slideshow/crud-php7-mysq-li-bootstrap/229559958/"js/bootstrap.min.js"></script>
</head>

5. Tambahkan kodingan pada kodingan diabwah ini warna biru
<a href="index.php" class="btn btn-info" role="button">Kembali</a><br/>
<div class="container">
<h2>Tambah Data siswa</h2>
<form method="post" action="tambah_aksi.php">
nama : <input type="text" name="nama" class="form-control"><br/>
nis : <input type="text" name="nis" class="form-control"><br/>
alamat : <input type="text" name="alamat" class="form-control"><br/>
<button type="submit" class="btn btn-success" value="Simpan">Simpan</button>
</form>
</div>
6. Lihat hasil tampilan
7. Sumber : https://getbootstrap.com/docs/4.2/components/alerts/

�ݺ�ߣ

Crud php7 mysq li + bootstrap

Recommended

More Related Content

More from SMK - Statens Museum for Kunst (10)

Crud php7 mysq li + bootstrap