Membuat Aplikasi Database Sederhana: Perbedaan antara revisi
Loncat ke navigasi
Loncat ke pencarian
Tidak ada ringkasan suntingan |
Tidak ada ringkasan suntingan |
||
| Baris 68: | Baris 68: | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | <meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
<title>Data Siswa Organisasi</title> | <title>Data Siswa Organisasi</title> | ||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-xOolHFLEh07PJGoPkLv1IbcEPTNtaed2xpHsD9ESMhqIYd0nLMwNLD69Npy4HI+N" crossorigin="anonymous"> | <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384- xOolHFLEh07PJGoPkLv1IbcEPTNtaed2xpHsD9ESMhqIYd0nLMwNLD69Npy4HI+N" crossorigin="anonymous"> | ||
</head> | </head> | ||
<body> | <body> | ||
<div class="container mt-5"> | <div class="container mt-5"> | ||
<h2 class="mb-4">Data Siswa Organisasi</h2> | |||
<!-- Notifikasi Pop-Up --> | |||
<?php if (isset($_GET['success']) && $_GET['success'] == 1): ?> | |||
<script> | |||
alert("Data berhasil ditambahkan!"); | |||
</script> | |||
<?php endif; ?> | |||
<!-- Form Pencarian --> | |||
<form method="GET" action="index.php" class="d-flex mb-3"> | |||
<input type="text" name="search" class="form-control me-2" placeholder="Cari nama atau kelas" value="<?= htmlspecialchars($search); ?>"> | |||
<button type="submit" class="btn btn-primary">Cari</button> | |||
<a href="index.php" class="btn btn-secondary ms-2">Reset</a> | |||
</form> | |||
<!-- Tombol Tambah Siswa --> | |||
<a href="tambah.php" class="btn btn-primary mb-3">Tambah Siswa</a> | |||
<table class="table table-bordered"> | |||
<thead> | |||
<tr> | |||
<th>ID</th> | |||
<th>Nama</th> | |||
<th>Kelas</th> | |||
<th>No HP</th> | |||
<th>Riwayat Organisasi</th> | |||
<th>Jabatan</th> | |||
<th>Tahun Ajaran</th> | |||
<th>Aksi</th> | |||
</tr> | |||
</thead> | |||
<tbody> | |||
<?php foreach ($siswa as $row): ?> | |||
<tr> | |||
<td><?= htmlspecialchars($row['id']); ?></td> | |||
<td><?= htmlspecialchars($row['nama']); ?></td> | |||
<td><?= htmlspecialchars($row['kelas']); ?></td> | |||
<td><?= htmlspecialchars($row['no_hp']); ?></td> | |||
<td><?= htmlspecialchars($row['riwayat_organisasi']); ?></td> | |||
<td><?= htmlspecialchars($row['jabatan']); ?></td> | |||
<td><?= htmlspecialchars($row['tahun_ajaran']); ?></td> | |||
<td> | |||
<a href="edit.php?id=<?= $row['id']; ?>" class="btn btn-warning btn-sm">Edit</a> | |||
<a href="hapus.php?id=<?= $row['id']; ?>" class="btn btn-danger btn-sm" onclick="return confirm('Yakin ingin menghapus data?');">Hapus</a> | |||
</td> | |||
</tr> | |||
<?php endforeach; ?> | |||
</tbody> | |||
</table> | |||
</div> | </div> | ||
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script> | <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script> | ||
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-Fy6S3B9q64WdZWQUiU+q4/2Lc9npb8tCaSX9FK7E8HnRr0Jz8D6OP9dO5Vg3Q9ct" crossorigin="anonymous"></script> | <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-Fy6S3B9q64WdZWQUiU+q4/2Lc9npb8tCaSX9FK7E8HnRr0Jz8D6OP9dO5Vg3Q9ct" crossorigin="anonymous"></script> | ||
</body> | </body> | ||
</html> | </html> | ||
=Buat file edit.php= | =Buat file edit.php= | ||
<?php | <?php | ||
include 'config.php'; | include 'config.php'; | ||
// Ambil ID dari URL | // Ambil ID dari URL | ||
$id = $_GET['id']; | $id = $_GET['id']; | ||
// Ambil data siswa dari database | // Ambil data siswa dari database | ||
$stmt = $pdo->prepare("SELECT * FROM siswa WHERE id = ?"); | $stmt = $pdo->prepare("SELECT * FROM siswa WHERE id = ?"); | ||
$stmt->execute([$id]); | $stmt->execute([$id]); | ||
$siswa = $stmt->fetch(); | $siswa = $stmt->fetch(); | ||
// Jika form disubmit, update data siswa | // Jika form disubmit, update data siswa | ||
if ($_SERVER['REQUEST_METHOD'] == 'POST') { | if ($_SERVER['REQUEST_METHOD'] == 'POST') { | ||
$nama = $_POST['nama']; | |||
$kelas = $_POST['kelas']; | |||
$no_hp = $_POST['no_hp']; | |||
$riwayat_organisasi = $_POST['riwayat_organisasi']; | |||
$jabatan = $_POST['jabatan']; | |||
$tahun_ajaran = $_POST['tahun_ajaran']; | |||
// Update data siswa | |||
$stmt = $pdo->prepare("UPDATE siswa SET nama = ?, kelas = ?, no_hp = ?, riwayat_organisasi = ?, jabatan = ?, tahun_ajaran = ? WHERE id = ?"); | |||
$stmt->execute([$nama, $kelas, $no_hp, $riwayat_organisasi, $jabatan, $tahun_ajaran, $id]); | |||
// Redirect ke halaman utama setelah update | |||
header("Location: index.php"); | |||
} | } | ||
?> | ?> | ||
<!DOCTYPE html> | <!DOCTYPE html> | ||
<html lang="id"> | <html lang="id"> | ||
<head> | <head> | ||
<meta charset="UTF-8"> | |||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | |||
<title>Edit Data Siswa</title> | |||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-xOolHFLEh07PJGoPkLv1IbcEPTNtaed2xpHsD9ESMhqIYd0nLMwNLD69Npy4HI+N" crossorigin="anonymous"> | |||
</head> | </head> | ||
<body> | <body> | ||
<div class="container mt-5"> | <div class="container mt-5"> | ||
<h2 class="mb-4">Edit Data Siswa</h2> | |||
<form method="POST"> | |||
<div class="mb-3"> | |||
<label>Nama</label> | |||
<input type="text" name="nama" class="form-control" value="<?= htmlspecialchars($siswa['nama']); ?>" required> | |||
</div> | |||
<div class="mb-3"> | |||
<label>Kelas</label> | |||
<input type="text" name="kelas" class="form-control" value="<?= htmlspecialchars($siswa['kelas']); ?>" required> | |||
</div> | |||
<div class="mb-3"> | |||
<label>No HP</label> | |||
<input type="text" name="no_hp" class="form-control" value="<?= htmlspecialchars($siswa['no_hp']); ?>" required> | |||
</div> | |||
<div class="mb-3"> | |||
<label>Riwayat Organisasi</label> | |||
<textarea name="riwayat_organisasi" class="form-control" required><?= htmlspecialchars($siswa['riwayat_organisasi']); ?> | |||
</textarea> | |||
</div> | |||
<div class="mb-3"> | |||
<label>Jabatan</label> | |||
<input type="text" name="jabatan" class="form-control" value="<?= htmlspecialchars($siswa['jabatan']); ?>" required> | |||
</div> | |||
<div class="mb-3"> | |||
<label>Tahun Ajaran</label> | |||
<input type="text" name="tahun_ajaran" class="form-control" value="<?= htmlspecialchars($siswa['tahun_ajaran']); ?>" required> | |||
</div> | |||
<button type="submit" class="btn btn-primary">Simpan Perubahan</button> | |||
<a href="index.php" class="btn btn-secondary">Batal</a> | |||
</div> | </form> | ||
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script> | </div> | ||
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-Fy6S3B9q64WdZWQUiU+q4/2Lc9npb8tCaSX9FK7E8HnRr0Jz8D6OP9dO5Vg3Q9ct" crossorigin="anonymous"></script> | <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script> | ||
</body> | <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-Fy6S3B9q64WdZWQUiU+q4/2Lc9npb8tCaSX9FK7E8HnRr0Jz8D6OP9dO5Vg3Q9ct" crossorigin="anonymous"></script> | ||
</html> | </body> | ||
</html> | |||
=Buat file hapus.php= | =Buat file hapus.php= | ||
<?php | <?php | ||
include 'config.php'; | include 'config.php'; | ||
$id = $_GET['id']; | $id = $_GET['id']; | ||
$stmt = $pdo->prepare("DELETE FROM siswa WHERE id = ?"); | $stmt = $pdo->prepare("DELETE FROM siswa WHERE id = ?"); | ||
$stmt->execute([$id]); | $stmt->execute([$id]); | ||
header("Location: index.php"); | header("Location: index.php"); | ||
?> | ?> | ||
Revisi per 7 November 2024 07.01
Sebelum memulai pastikan apache2, mariadb, dan php sudah terinstall dengan baik
Siapkan Database
masuk ke mariadb lalu ketikkan perintah berikut
CREATE DATABASE organisasi_siswa; CREATE USER 'siswa'@'localhost' IDENTIFIED BY '12345'; GRANT ALL PRIVILEGES ON organisasi_siswa.* TO 'siswa'@'localhost';
USE organisasi_siswa;
CREATE TABLE siswa (
id INT AUTO_INCREMENT PRIMARY KEY,
nama VARCHAR(100) NOT NULL,
kelas VARCHAR(15) NOT NULL,
no_hp VARCHAR(15) NOT NULL,
riwayat_organisasi TEXT NOT NULL,
jabatan VARCHAR(50) NOT NULL,
tahun_ajaran VARCHAR(9) NOT NULL
);
Buaf file config.php
isi dengan kode berikut
<?php
// config.php
$host = 'localhost';
$dbname = 'organisasi_siswa';
$username = 'siswa'; // sesuaikan dengan username MariaDB Anda
$password = '12345'; // sesuaikan dengan password MariaDB Anda
try {
$pdo = new PDO("mysql:host=$host;dbname=$dbname", $username, $password);
$pdo->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
} catch (PDOException $e) {
die("Koneksi gagal: " . $e->getMessage());
}
?>
Buat file index.php
<?php
include 'config.php';
$query = $pdo->query("SELECT * FROM siswa");
//$siswa = $query->fetchAll(PDO::FETCH_ASSOC);
// Mendapatkan kata kunci dari form pencarian jika ada
$search = isset($_GET['search']) ? $_GET['search'] : ;
// Query dengan kondisi pencarian jika kata kunci ada
if ($search) {
$query = $pdo->prepare("SELECT * FROM siswa WHERE nama LIKE ? OR kelas LIKE ?");
$query->execute(["%$search%", "%$search%"]);
} else {
$query = $pdo->query("SELECT * FROM siswa");
}
$siswa = $query->fetchAll(PDO::FETCH_ASSOC);
?>
<!DOCTYPE html>
<html lang="id">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Data Siswa Organisasi</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384- xOolHFLEh07PJGoPkLv1IbcEPTNtaed2xpHsD9ESMhqIYd0nLMwNLD69Npy4HI+N" crossorigin="anonymous">
</head>
<body>
Data Siswa Organisasi
<?php if (isset($_GET['success']) && $_GET['success'] == 1): ?>
<script>
alert("Data berhasil ditambahkan!");
</script>
<?php endif; ?>
<form method="GET" action="index.php" class="d-flex mb-3">
<input type="text" name="search" class="form-control me-2" placeholder="Cari nama atau kelas" value="<?= htmlspecialchars($search); ?>">
<button type="submit" class="btn btn-primary">Cari</button>
<a href="index.php" class="btn btn-secondary ms-2">Reset</a>
</form>
<a href="tambah.php" class="btn btn-primary mb-3">Tambah Siswa</a>
<thead>
</thead>
<tbody>
<?php foreach ($siswa as $row): ?>
<?php endforeach; ?>
</tbody>
| ID | Nama | Kelas | No HP | Riwayat Organisasi | Jabatan | Tahun Ajaran | Aksi |
|---|---|---|---|---|---|---|---|
| <?= htmlspecialchars($row['id']); ?> | <?= htmlspecialchars($row['nama']); ?> | <?= htmlspecialchars($row['kelas']); ?> | <?= htmlspecialchars($row['no_hp']); ?> | <?= htmlspecialchars($row['riwayat_organisasi']); ?> | <?= htmlspecialchars($row['jabatan']); ?> | <?= htmlspecialchars($row['tahun_ajaran']); ?> |
<a href="edit.php?id=<?= $row['id']; ?>" class="btn btn-warning btn-sm">Edit</a>
<a href="hapus.php?id=<?= $row['id']; ?>" class="btn btn-danger btn-sm" onclick="return confirm('Yakin ingin menghapus data?');">Hapus</a>
|
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script> <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-Fy6S3B9q64WdZWQUiU+q4/2Lc9npb8tCaSX9FK7E8HnRr0Jz8D6OP9dO5Vg3Q9ct" crossorigin="anonymous"></script> </body> </html>
Buat file edit.php
<?php
include 'config.php';
// Ambil ID dari URL
$id = $_GET['id'];
// Ambil data siswa dari database
$stmt = $pdo->prepare("SELECT * FROM siswa WHERE id = ?");
$stmt->execute([$id]);
$siswa = $stmt->fetch();
// Jika form disubmit, update data siswa
if ($_SERVER['REQUEST_METHOD'] == 'POST') {
$nama = $_POST['nama'];
$kelas = $_POST['kelas'];
$no_hp = $_POST['no_hp'];
$riwayat_organisasi = $_POST['riwayat_organisasi'];
$jabatan = $_POST['jabatan'];
$tahun_ajaran = $_POST['tahun_ajaran'];
// Update data siswa
$stmt = $pdo->prepare("UPDATE siswa SET nama = ?, kelas = ?, no_hp = ?, riwayat_organisasi = ?, jabatan = ?, tahun_ajaran = ? WHERE id = ?");
$stmt->execute([$nama, $kelas, $no_hp, $riwayat_organisasi, $jabatan, $tahun_ajaran, $id]);
// Redirect ke halaman utama setelah update
header("Location: index.php");
}
?>
<!DOCTYPE html>
<html lang="id">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Edit Data Siswa</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-xOolHFLEh07PJGoPkLv1IbcEPTNtaed2xpHsD9ESMhqIYd0nLMwNLD69Npy4HI+N" crossorigin="anonymous">
</head>
<body>
Edit Data Siswa
<form method="POST">
<label>Nama</label>
<input type="text" name="nama" class="form-control" value="<?= htmlspecialchars($siswa['nama']); ?>" required>
<label>Kelas</label>
<input type="text" name="kelas" class="form-control" value="<?= htmlspecialchars($siswa['kelas']); ?>" required>
<label>No HP</label>
<input type="text" name="no_hp" class="form-control" value="<?= htmlspecialchars($siswa['no_hp']); ?>" required>
<label>Riwayat Organisasi</label>
<textarea name="riwayat_organisasi" class="form-control" required><?= htmlspecialchars($siswa['riwayat_organisasi']); ?>
</textarea>
<label>Jabatan</label>
<input type="text" name="jabatan" class="form-control" value="<?= htmlspecialchars($siswa['jabatan']); ?>" required>
<label>Tahun Ajaran</label>
<input type="text" name="tahun_ajaran" class="form-control" value="<?= htmlspecialchars($siswa['tahun_ajaran']); ?>" required>
<button type="submit" class="btn btn-primary">Simpan Perubahan</button>
<a href="index.php" class="btn btn-secondary">Batal</a>
</form>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script> <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-Fy6S3B9q64WdZWQUiU+q4/2Lc9npb8tCaSX9FK7E8HnRr0Jz8D6OP9dO5Vg3Q9ct" crossorigin="anonymous"></script> </body> </html>
Buat file hapus.php
<?php
include 'config.php';
$id = $_GET['id'];
$stmt = $pdo->prepare("DELETE FROM siswa WHERE id = ?");
$stmt->execute([$id]);
header("Location: index.php");
?>