Tutorial Membuat Data siswa dengan PHP dan My SQL dengan image
Membuat Data siswa dengan PHP dan My SQL dengan image
Langkah pertama kita perhatikan dulu apa saja yang wajib kita siapkan dala membuat aplikasi sederhana di PHP dan My SQL
1. Siapkan XAMPP nya bisa versi 5 ke atas
2. Notepad ++ atau apliaksi sejenisnya
3. Buatlah folder di dalam htdoc dengan nama "datasiswa"
Ini adalah file dalam folder "datasiswa" yang akan kita buat nanti
Ok yang akan kita buat pertama kali adalah database nya dulu kita kasih nama "datasiswa"
-- phpMyAdmin SQL Dump
-- version 5.0.2
-- https://www.phpmyadmin.net/
--
-- Host: 127.0.0.1
-- Waktu pembuatan: 17 Nov 2020 pada 14.47
-- Versi server: 10.4.13-MariaDB
-- Versi PHP: 7.4.8
SET SQL_MODE = "NO_AUTO_VALUE_ON_ZERO";
START TRANSACTION;
SET time_zone = "+00:00";
/*!40101 SET @OLD_CHARACTER_SET_CLIENT=@@CHARACTER_SET_CLIENT */;
/*!40101 SET @OLD_CHARACTER_SET_RESULTS=@@CHARACTER_SET_RESULTS */;
/*!40101 SET @OLD_COLLATION_CONNECTION=@@COLLATION_CONNECTION */;
/*!40101 SET NAMES utf8mb4 */;
--
-- Database: `db_siswa`
--
-- --------------------------------------------------------
--
-- Struktur dari tabel `tsiswa`
--
CREATE TABLE `tsiswa` (
`id` int(11) NOT NULL,
`nis` varchar(11) NOT NULL,
`nama` varchar(50) NOT NULL,
`jenis_kelamin` varchar(10) NOT NULL,
`jurusan` varchar(15) NOT NULL,
`foto` varchar(200) NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=latin1;
--
-- Dumping data untuk tabel `tsiswa`
--
INSERT INTO `tsiswa` (`id`, `nis`, `nama`, `jenis_kelamin`, `jurusan`, `foto`) VALUES
(5, '3103228138', 'Joan Arc', 'perempuan', 'Rekayasa Perang', '17112020133242unnamed.jpg'),
(6, '3103118139', 'Wendri Tri Pambudi', 'Laki-laki', 'RPL', '17112020133224JPEG_20200511_160923_7370848770903211139.jpg'),
(7, '3103118132', 'Ahha', 'Laki-laki', 'RPL', '171120201346485712.png'),
(8, '31031181311', 'wawan', 'Laki-laki', 'RPL', '17112020134833Capture.PNG');
--
-- Indexes for dumped tables
--
--
-- Indeks untuk tabel `tsiswa`
--
ALTER TABLE `tsiswa`
ADD PRIMARY KEY (`id`);
--
-- AUTO_INCREMENT untuk tabel yang dibuang
--
--
-- AUTO_INCREMENT untuk tabel `tsiswa`
--
ALTER TABLE `tsiswa`
MODIFY `id` int(11) NOT NULL AUTO_INCREMENT, AUTO_INCREMENT=9;
COMMIT;
/*!40101 SET CHARACTER_SET_CLIENT=@OLD_CHARACTER_SET_CLIENT */;
/*!40101 SET CHARACTER_SET_RESULTS=@OLD_CHARACTER_SET_RESULTS */;
/*!40101 SET COLLATION_CONNECTION=@OLD_COLLATION_CONNECTION */;
Kalau mau di simpan dengan nama datasiswa.sql
Lalu kita buat file "koneksi.php " dan ini scriptnya
<?php
$connect=mysqli_connect("localhost","root","","datasiswa");
if(!$connect){
echo "Koneksi Gagal";
die();
}
?>
kita simpan di folder datasiswa
Kemudian langakah berikutnya adalah membuat file index.php
<?php
error_reporting(0);
include 'koneksi.php';
?>
<html>
<head>
<title>Daftar Data Siswa</title>
<style type="text/css">
* {
font-family: "Trebuchet MS";
}
h1 {
text-transform: uppercase;
color: #9400D3;
}
table {
border: solid 1px #DDEEEE;
border-collapse: collapse;
border-spacing: 0;
width: 70%;
margin: 10px auto 10px auto;
}
table thead th {
background-color: #DDEFEF;
border: solid 1px #DDEEEE;
color: #9400D3;
padding: 10px;
text-align: left;
text-shadow: 1px 1px 1px #fff;
text-decoration: none;
}
table tbody td {
border: solid 1px #DDEEEE;
color: #333;
padding: 10px;
text-shadow: 1px 1px 1px #fff;
}
a {
background-color: #9400D3;
color: #fff;
padding: 10px;
text-decoration: none;
font-size: 12px;
}
</style>
</head>
<body>
<center>
<h1>Data Siswa</h1>
<a href="form_simpan.php">+Tambah Data</a><br><br>
<form action="" method="POST" >
<input type="text" name="query" placeholder="Cari Data"/>
<input type="submit" name="cari" value="Search" />
</form>
<table border="1" width="100%">
<tr>
<th>No</th>
<th>Foto</th>
<th>NIS</th>
<th>Nama</th>
<th>Jenis Kelamin</th>
<th>Jurusan</th>
<th colspan="2">Aksi</th>
</tr>
<?php
$no = 1;
$query = $_POST['query'];
if($query != ''){
$select = mysqli_query ($connect, "SELECT * FROM tsiswa WHERE nis LIKE '%".$query."%' OR
nama LIKE '%".$query."%' ");
}else {
$select = mysqli_query($connect, "SELECT * FROM tsiswa");
}
if(mysqli_num_rows($select)){
while ($data = mysqli_fetch_array($select)) {
?>
<tr>
<td><center><?php echo $no++ ?></center></td>
<td><center><?php echo "<img src='images/".$data['foto']."' width='100' height='100'>"?></center></td>
<td><center><?php echo $data['nis'] ?></center></td>
<td><center><?php echo $data['nama'] ?></center></td>
<td><center><?php echo $data['jenis_kelamin'] ?></center></td>
<td><center><?php echo $data['jurusan'] ?></center></td>
<td><center><a href="form_ubah.php?nis=<?php echo $data ['nis'] ?>">Ubah </a></center></td>
<td><center><a href="proses_hapus.php?nis=<?php echo $data ['nis'] ?>"
onclick="return confirm('Apakah anda yakin ingin menghapus data siswa <?php echo $data ['nama']; ?> ? ')" > Hapus </a></center></td>
</tr>
<?php }}else {
echo '<tr><td colspan="7"><center> Tidak ada data</center> </td></tr>';
}?>
</table>
</center>
</body>
</html>
Kita simpan lagi di folder yang sama ya
Langkah berikkutnya kita buat file form_simpan.php
<html>
<head>
<title>Tambah Data</title>
<style type="text/css">
* {
font-family: "Trebuchet MS";
}
h1 {
text-transform: uppercase;
color: #9400D3;
}
button {
background-color: #9400D3;
color: #fff;
padding: 10px;
text-decoration: none;
font-size: 12px;
border: 0px;
margin-top: 20px;
}
label {
margin-top: 10px;
float: left;
text-align: left;
width: 100%;
}
input {
padding: 6px;
width: 100%;
box-sizing: border-box;
background: #f8f8f8;
border: 2px solid #ccc;
outline-color: salmon;
}
div {
width: 100%;
height: auto;
}
.base {
width: 400px;
height: auto;
padding: 20px;
margin-left: auto;
margin-right: auto;
background: #ededed;
}
</style>
</head>
<body>
<center>
<h1>Tambah Data</h1>
<center>
<form method="post" action="proses_simpan.php" enctype="multipart/form-data">
<section class="base">
<div>
<label>NIS</label>
<input type="text" name="nis" autofocus="" required="" />
</div>
<div>
<label>Nama</label>
<input type="text" name="nama" />
</div>
<div>
<label>Jenis Kelamin</label>
<td>
<input type="radio" name="jenis_kelamin" value="Laki-laki"> Laki-laki
<input type="radio" name="jenis_kelamin" value="Perempuan"> Perempuan
</td>
</div>
<div>
<label>Jurusan</label>
<input type="text" name="jurusan" required="" />
</div>
<div>
<label>Foto</label>
<input type="file" name="foto" required="" />
</div>
<div>
<button type="submit" value="Simpan">Simpan Data</button>
<a href="index.php"><button type="button" value="Batal">Batal</button></a>
</div>
</section>
</form>
</body>
</html>
Kita simpan lagi di folder yang sama ya
Berikutnya kita buat file form_ubah.php
<html>
<head>
<title>Ubah Data</title>
<style type="text/css">
* {
font-family: "Trebuchet MS";
}
h1 {
text-transform: uppercase;
color: #9400D3;
}
button {
background-color: #9400D3;
color: #fff;
padding: 10px;
text-decoration: none;
font-size: 12px;
border: 0px;
margin-top: 20px;
}
label {
margin-top: 10px;
float: left;
text-align: left;
width: 100%;
}
input {
padding: 6px;
width: 100%;
box-sizing: border-box;
background: #f8f8f8;
border: 2px solid #ccc;
outline-color: salmon;
}
div {
width: 100%;
height: auto;
}
.base {
width: 400px;
height: auto;
padding: 20px;
margin-left: auto;
margin-right: auto;
background: #ededed;
}
</style>
</head>
<body>
<section class="base">
<h1>Ubah Data Siswa</h1>
<?php
// Load file koneksi.php
include "koneksi.php";
// Ambil data NIS yang dikirim oleh index.php melalui URL
$nis = $_GET['nis'];
// Query untuk menampilkan data siswa berdasarkan NIS yang dikirim
$query = "SELECT * FROM tsiswa WHERE nis='".$nis."'";
$sql = mysqli_query($connect, $query); // Eksekusi/Jalankan query dari variabel $query
$data = mysqli_fetch_array($sql); // Ambil data dari hasil eksekusi $sql
?>
<form method="post" action="proses_ubah.php?nis=<?php echo $nis; ?>" enctype="multipart/form-data">
<table cellpadding="8">
<tr>
<td>Nama</td>
<td><input type="text" name="nama" value="<?php echo $data['nama']; ?>"></td>
</tr>
<tr>
<td>Jenis Kelamin</td>
<td>
<?php
if($data['jenis_kelamin'] == "Laki-laki"){
echo "<input type='radio' name='jenis_kelamin' value='laki-laki' checked='checked'> Laki-laki";
echo "<input type='radio' name='jenis_kelamin' value='perempuan'> Perempuan";
}else{
echo "<input type='radio' name='jenis_kelamin' value='laki-laki'> Laki-laki";
echo "<input type='radio' name='jenis_kelamin' value='perempuan' checked='checked'> Perempuan";
}
?>
</td>
</tr>
<tr>
<td>Jurusan</td>
<td><input type="text" name="jurusan" value="<?php echo $data['jurusan']; ?>"></td>
</tr>
<tr>
<td>Foto</td>
<td>
<input type="checkbox" name="ubah_foto" value="true"> Ceklis jika ingin mengubah foto<br>
<input type="file" name="foto">
</td>
</tr>
</table>
<hr>
<div>
<button type="submit" value="Ubah">Simpan Data</button>
<a href="index.php"><button type="button" value="Batal">Batal</button></a>
</div>
<section>
</form>
</body>
</html>
Tetap sama kita simpan di folder yang kita buat tadi ya awas jangan sampai lupa
Langkah selanjutnya kita buat file proses_simpan.php
<?php
// Load file koneksi.php
include "koneksi.php";
// Ambil Data yang Dikirim dari Form
$nis = $_POST['nis'];
$nama = $_POST['nama'];
$jenis_kelamin = $_POST['jenis_kelamin'];
$jurusan = $_POST['jurusan'];
$foto = $_FILES['foto']['name'];
$tmp = $_FILES['foto']['tmp_name'];
// Rename nama fotonya dengan menambahkan tanggal dan jam upload
$fotobaru = date('dmYHis').$foto;
// Set path folder tempat menyimpan fotonya
$path = "images/".$fotobaru;
// Proses upload
if(move_uploaded_file($tmp, $path)){ // Cek apakah gambar berhasil diupload atau tidak
// Proses simpan ke Database
$query ="INSERT INTO tsiswa (nis,nama,jenis_kelamin,jurusan,foto)
VALUE ('$nis','$nama','$jenis_kelamin','$jurusan','$fotobaru')";
$sql = mysqli_query($connect, $query); // Eksekusi/ Jalankan query dari variabel $query
if($sql){ // Cek jika proses simpan ke database sukses atau tidak
// Jika Sukses, Lakukan :
header("location: index.php"); // Redirect ke halaman index.php
}else{
// Jika Gagal, Lakukan :
echo "Maaf, Terjadi kesalahan saat mencoba untuk menyimpan data ke database.";
echo "<br><a href='form_simpan.php'>Kembali Ke Form</a>";
}
}else{
// Jika gambar gagal diupload, Lakukan :
echo "Maaf, Gambar gagal untuk diupload.";
echo "<br><a href='form_simpan.php'>Kembali Ke Form</a>";
}
?>
Lalu simpan di folder yang kita buat tadi janganlupa klik save ya gaes
Langkah selanjutnya buat file proses_ubah.php
<?php
// Load file koneksi.php
include "koneksi.php";
// Ambil data NIS yang dikirim oleh form_ubah.php melalui URL
$nis = $_GET['nis'];
// Ambil Data yang Dikirim dari Form
$nama = $_POST['nama'];
$jenis_kelamin = $_POST['jenis_kelamin'];
$jurusan = $_POST['jurusan'];
// Cek apakah user ingin mengubah fotonya atau tidak
if(isset($_POST['ubah_foto'])){ // Jika user menceklis checkbox yang ada di form ubah, lakukan :
// Ambil data foto yang dipilih dari form
$foto = $_FILES['foto']['name'];
$tmp = $_FILES['foto']['tmp_name'];
// Rename nama fotonya dengan menambahkan tanggal dan jam upload
$fotobaru = date('dmYHis').$foto;
// Set path folder tempat menyimpan fotonya
$path = "images/".$fotobaru;
// Proses upload
if(move_uploaded_file($tmp, $path)){ // Cek apakah gambar berhasil diupload atau tidak
// Query untuk menampilkan data siswa berdasarkan NIS yang dikirim
$query = "SELECT * FROM tsiswa WHERE nis='".$nis."'";
$sql = mysqli_query($connect, $query); // Eksekusi/Jalankan query dari variabel $query
$data = mysqli_fetch_array($sql); // Ambil data dari hasil eksekusi $sql
// Cek apakah file foto sebelumnya ada di folder images
if(is_file("images/".$data['foto'])) // Jika foto ada
unlink("images/".$data['foto']); // Hapus file foto sebelumnya yang ada di folder images
// Proses ubah data ke Database
$query = "UPDATE tsiswa SET nama='".$nama."', jenis_kelamin='".$jenis_kelamin."', jurusan='".$jurusan."', foto='".$fotobaru."' WHERE nis='".$nis."'";
$sql = mysqli_query($connect, $query); // Eksekusi/ Jalankan query dari variabel $query
if($sql){ // Cek jika proses simpan ke database sukses atau tidak
// Jika Sukses, Lakukan :
header("location: index.php"); // Redirect ke halaman index.php
}else{
// Jika Gagal, Lakukan :
echo "Maaf, Terjadi kesalahan saat mencoba untuk menyimpan data ke database.";
echo "<br><a href='form_ubah.php'>Kembali Ke Form</a>";
}
}else{
// Jika gambar gagal diupload, Lakukan :
echo "Maaf, Gambar gagal untuk diupload.";
echo "<br><a href='form_ubah.php'>Kembali Ke Form</a>";
}
}else{ // Jika user tidak menceklis checkbox yang ada di form ubah, lakukan :
// Proses ubah data ke Database
$query = "UPDATE tsiswa SET nama='".$nama."', jenis_kelamin='".$jenis_kelamin."', jurusan='".$jurusan."' WHERE nis='".$nis."'";
$sql = mysqli_query($connect, $query); // Eksekusi/ Jalankan query dari variabel $query
if($sql){ // Cek jika proses simpan ke database sukses atau tidak
// Jika Sukses, Lakukan :
header("location: index.php"); // Redirect ke halaman index.php
}else{
// Jika Gagal, Lakukan :
echo "Maaf, Terjadi kesalahan saat mencoba untuk menyimpan data ke database.";
echo "<br><a href='form_ubah.php'>Kembali Ke Form</a>";
}
}
?>
Jangan lupa di simpan di folder yang kita buat tadi ya
Next kita buat file proses_hapus.php
<?php
// Load file koneksi.php
include "koneksi.php";
// Ambil data NIS yang dikirim oleh index.php melalui URL
$nis = $_GET['nis'];
// Query untuk menampilkan data siswa berdasarkan NIS yang dikirim
$query = "SELECT * FROM tsiswa WHERE nis='".$nis."'";
$sql = mysqli_query($connect, $query); // Eksekusi/Jalankan query dari variabel $query
$data = mysqli_fetch_array($sql); // Ambil data dari hasil eksekusi $sql
// Cek apakah file fotonya ada di folder images
if(is_file("images/".$data['foto'])) // Jika foto ada
unlink("images/".$data['foto']); // Hapus foto yang telah diupload dari folder images
// Query untuk menghapus data siswa berdasarkan NIS yang dikirim
$query2 = "DELETE FROM tsiswa WHERE nis='".$nis."'";
$sql2 = mysqli_query($connect, $query2); // Eksekusi/Jalankan query dari variabel $query
if($sql2){ // Cek jika proses simpan ke database sukses atau tidak
// Jika Sukses, Lakukan :
header("location: index.php"); // Redirect ke halaman index.php
}else{
// Jika Gagal, Lakukan :
echo "Data gagal dihapus. <a href='index.php'>Kembali</a>";
}
?>
Kita simpan lagi di folder yang kita buat tadi ya gaes
Yang Terakhir adalah membuat folder image di dalam folder datasiswa yang kita buat tadi seperti contoh gambar diatas ya gaes isi file nya
Ok bila semua sudah di buat kemudian kita coba panggil aplikasinya di browser chrome atau mozila kita ketik localhost/datasiswa
Comments
Post a Comment