Membuat Aplikasi Database Sederhana: Perbedaan antara revisi

Dari Dokumentasi Robie
Loncat ke navigasi Loncat ke pencarian
Tidak ada ringkasan suntingan
Tidak ada ringkasan suntingan
 
(18 revisi perantara oleh pengguna yang sama tidak ditampilkan)
Baris 1: Baris 1:
Sebelum memulai pastikan apache2, mariadb, dan php sudah terinstall dengan baik
Sebelum memulai pastikan  


apache2 <code>apt install apache2</code>
mariadb <code>apt install mariadb-server</code>
dns server <code>apt install bind9</code>
dan
php <code>apt install php php-{fpm,common,mbstring,xmlrpc,soap,gd,xml,intl,mysql,cli,mcrypt,ldap,zip,curl} -y</code>
, dan virtualhost sudah terinstall dengan baik


=Siapkan Database=
=Siapkan Database=
masuk ke mariadb
masuk ke mariadb
lalu ketikkan perintah berikut
lalu ketikkan perintah berikut


mariadb (enter)
  CREATE DATABASE organisasi_siswa;
  CREATE DATABASE organisasi_siswa;
  CREATE USER 'siswa'@'localhost' IDENTIFIED BY '12345';
  CREATE USER 'siswa'@'localhost' IDENTIFIED BY '12345';
  GRANT ALL PRIVILEGES ON organisasi_siswa.* TO 'siswa'@'localhost';
  GRANT ALL PRIVILEGES ON organisasi_siswa.* TO 'siswa'@'localhost';
  USE organisasi_siswa;
  USE organisasi_siswa;
  CREATE TABLE siswa (
  CREATE TABLE siswa (
     id INT AUTO_INCREMENT PRIMARY KEY,
     id INT AUTO_INCREMENT PRIMARY KEY,
     nama VARCHAR(100) NOT NULL,
     nama VARCHAR(100) NOT NULL,
     kelas VARCHAR(15) NOT NULL,
     kelas VARCHAR(25) NOT NULL,
     no_hp VARCHAR(15) NOT NULL,
     no_hp VARCHAR(15) NOT NULL,
     riwayat_organisasi TEXT NOT NULL,
     riwayat_organisasi TEXT NOT NULL,
Baris 20: Baris 32:
     tahun_ajaran VARCHAR(9) NOT NULL
     tahun_ajaran VARCHAR(9) NOT NULL
  );
  );
masuk ke folder var/www/html/xitkj1.web1 lalu,


=Buaf file config.php=
=Buaf file config.php=
Baris 42: Baris 55:
=Buat file index.php=
=Buat file index.php=


<?php
<?php
include 'config.php';  
 
include 'config.php';
$query = $pdo->query("SELECT * FROM siswa");
 
//$siswa = $query->fetchAll(PDO::FETCH_ASSOC);
// Mendapatkan kata kunci dari form pencarian jika ada
 
// Mendapatkan kata kunci dari form pencarian jika ada
$search = isset($_GET['search']) ? $_GET['search'] : <nowiki>''</nowiki>;
$search = isset($_GET['search']) ? $_GET['search'] : '';
 
// Tentukan berapa banyak data yang ditampilkan per halaman
// Query dengan kondisi pencarian jika kata kunci ada
 
if ($search) {
$limit = 5;
    $query = $pdo->prepare("SELECT * FROM siswa WHERE nama LIKE ? OR kelas LIKE ?");
 
    $query->execute(["%$search%", "%$search%"]);
// Dapatkan halaman saat ini dari URL, jika tidak ada, default ke 1
} else {
 
    $query = $pdo->query("SELECT * FROM siswa");
$page = isset($_GET['page']) ? (int)$_GET['page'] : 1;
}
 
$offset = ($page - 1) * $limit;
$siswa = $query->fetchAll(PDO::FETCH_ASSOC);
 
?>
// Query untuk menghitung total data
 
<!DOCTYPE html>
$totalQuery = $pdo->query("SELECT COUNT(*) FROM siswa" . ($search ? " WHERE nama LIKE '%$search%' OR kelas LIKE '%$search%'" : ""));
<html lang="id">
 
<head>
$totalData = $totalQuery->fetchColumn();
    <meta charset="UTF-8">
 
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
$totalPages = ceil($totalData / $limit);
    <title>Data Siswa Organisasi</title>
 
   
// Query untuk mengambil data siswa dengan paginasi
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-xOolHFLEh07PJGoPkLv1IbcEPTNtaed2xpHsD9ESMhqIYd0nLMwNLD69Npy4HI+N" crossorigin="anonymous">
 
if ($search) {
 
    $query = $pdo->prepare("SELECT * FROM siswa WHERE nama LIKE ? OR kelas LIKE ? LIMIT :limit OFFSET :offset");
 
    $query->bindValue(1, "%$search%");
 
    $query->bindValue(2, "%$search%");
 
    $query->bindValue(':limit', $limit, PDO::PARAM_INT);
 
    $query->bindValue(':offset', $offset, PDO::PARAM_INT);
 
    $query->execute();
 
} else {
 
    $query = $pdo->prepare("SELECT * FROM siswa LIMIT :limit OFFSET :offset");
 
    $query->bindValue(':limit', $limit, PDO::PARAM_INT);
 
    $query->bindValue(':offset', $offset, PDO::PARAM_INT);
 
    $query->execute();
 
}
 
$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="bootstrap.min.css">
 
</head>
</head>
<body>
<body>
<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 -->
<nowiki><div class="container mt-5"></nowiki>
    <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); ?>">
    <nowiki><h2 class="mb-4">Data Siswa Organisasi</h2></nowiki>
        <button type="submit" class="btn btn-primary">Cari</button>
 
        <a href="index.php" class="btn btn-secondary ms-2">Reset</a>
   
    </form>
 
    <!-- Notifikasi Pop-Up -->
 
    <?php if (isset($_GET['success']) && $_GET['success'] == 1): ?>
 
        <script>
 
            alert("Data berhasil ditambahkan!");


    <!-- Tombol Tambah Siswa -->
        </script>
    <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>


<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
    <?php endif; ?>
<script src="https://cdn.jsdelivr.net/npm/[email protected].2/dist/js/bootstrap.bundle.min.js" integrity="sha384-Fy6S3B9q64WdZWQUiU+q4/2Lc9npb8tCaSX9FK7E8HnRr0Jz8D6OP9dO5Vg3Q9ct" crossorigin="anonymous"></script>
 
    <!-- 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>
 
    <nowiki><table class="table table-bordered"></nowiki>
 
        <thead>
 
            <nowiki><tr></nowiki>
 
                <nowiki><th>ID</th></nowiki>
 
                <nowiki><th>Nama</th></nowiki>
 
                <nowiki><th>Kelas</th></nowiki>
 
                <nowiki><th>No HP</th></nowiki>
 
                <nowiki><th>Riwayat Organisasi</th></nowiki>
 
                <nowiki><th>Jabatan</th></nowiki>
 
                <nowiki><th>Tahun Ajaran</th></nowiki>
 
                <nowiki><th>Aksi</th></nowiki>
 
            <nowiki></tr></nowiki>
 
        </thead>
 
        <tbody>
 
            <?php foreach ($siswa as $row): ?>
 
                <nowiki><tr></nowiki>
 
                    <nowiki><td></nowiki><?= htmlspecialchars($row['id']); ?><nowiki></td></nowiki>
 
                    <nowiki><td></nowiki><?= htmlspecialchars($row['nama']); ?><nowiki></td></nowiki>
 
                    <nowiki><td></nowiki><?= htmlspecialchars($row['kelas']); ?><nowiki></td></nowiki>
 
                    <nowiki><td></nowiki><?= htmlspecialchars($row['no_hp']); ?><nowiki></td></nowiki>
 
                    <nowiki><td></nowiki><?= htmlspecialchars($row['riwayat_organisasi']); ?><nowiki></td></nowiki>
 
                    <nowiki><td></nowiki><?= htmlspecialchars($row['jabatan']); ?><nowiki></td></nowiki>
 
                    <nowiki><td></nowiki><?= htmlspecialchars($row['tahun_ajaran']); ?><nowiki></td></nowiki>
 
                    <nowiki><td></nowiki>
 
                        <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>
 
                    <nowiki></td></nowiki>
 
                <nowiki></tr></nowiki>
 
            <?php endforeach; ?>
 
        </tbody>
 
    <nowiki></table></nowiki>
 
    <!-- Paginasi -->
 
    <nav>
 
        <nowiki><ul class="pagination"></nowiki>
 
            <?php for ($i = 1; $i <= $totalPages; $i++): ?>
 
                <li class="page-item <?= $i === $page ? 'active' : <nowiki>''</nowiki>; ?>">
 
                    <a class="page-link" href="?page=<?= $i; ?>&search=<?= urlencode($search); ?>"><?= $i; ?></a>
 
                <nowiki></li></nowiki>
 
            <?php endfor; ?>
 
        <nowiki></ul></nowiki>
 
    </nav>
 
<nowiki></div></nowiki>
 
<script src="jquery.slim.min.js"></script>
 
<script src="bootstrap.bundle.min.js"></script>


</body>
</body>
</html>
</html>


= Buat file tambah.php =
<?php


=Buat file edit.php=
<?php
include 'config.php';
include 'config.php';


// Ambil ID dari URL
// Jika form disubmit, tambahkan data siswa baru
$id = $_GET['id'];
 
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'];
 
    // Insert data siswa baru


// Ambil data siswa dari database
    $stmt = $pdo->prepare("INSERT INTO siswa (nama, kelas, no_hp, riwayat_organisasi, jabatan, tahun_ajaran) VALUES (?, ?, ?, ?, ?, ?)");
$stmt = $pdo->prepare("SELECT * FROM siswa WHERE id = ?");
$stmt->execute([$id]);
$siswa = $stmt->fetch();


// Jika form disubmit, update data siswa
    $stmt->execute([$nama, $kelas, $no_hp, $riwayat_organisasi, $jabatan, $tahun_ajaran]);
if ($_SERVER['REQUEST_METHOD'] == 'POST') {
 
    $nama = $_POST['nama'];
    // Redirect ke halaman utama setelah penambahan
    $kelas = $_POST['kelas'];
 
    $no_hp = $_POST['no_hp'];
    header("Location: index.php");
    $riwayat_organisasi = $_POST['riwayat_organisasi'];
    $jabatan = $_POST['jabatan'];
    $tahun_ajaran = $_POST['tahun_ajaran'];


    // Update data siswa
    exit();
    $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">
    <meta charset="UTF-8">
    <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">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
    <title>Tambah Data Siswa</title>
 
    <link rel="stylesheet" href="bootstrap.min.css">
 
</head>
</head>
<body>
<body>
<div class="container mt-5">
 
    <h2 class="mb-4">Edit Data Siswa</h2>
<nowiki><div class="container mt-5"></nowiki>
    <form method="POST">
 
        <div class="mb-3">
    <nowiki><h2 class="mb-4">Tambah Data Siswa</h2></nowiki>
            <label>Nama</label>
 
            <input type="text" name="nama" class="form-control" value="<?= htmlspecialchars($siswa['nama']); ?>" required>
    <form method="POST">
        </div>
 
        <div class="mb-3">
        <nowiki><div class="mb-3"></nowiki>
            <label>Kelas</label>
 
            <input type="text" name="kelas" class="form-control" value="<?= htmlspecialchars($siswa['kelas']); ?>" required>
            <label>Nama</label>
        </div>
 
        <div class="mb-3">
            <input type="text" name="nama" class="form-control" required>
            <label>No HP</label>
 
            <input type="text" name="no_hp" class="form-control" value="<?= htmlspecialchars($siswa['no_hp']); ?>" required>
        <nowiki></div></nowiki>
        </div>
 
        <div class="mb-3">
        <nowiki><div class="mb-3"></nowiki>
            <label>Riwayat Organisasi</label>
 
            <textarea name="riwayat_organisasi" class="form-control" required><?= htmlspecialchars($siswa['riwayat_organisasi']); ?></textarea>
            <label>Kelas</label>
        </div>
 
        <div class="mb-3">
            <input type="text" name="kelas" class="form-control" required>
            <label>Jabatan</label>
 
            <input type="text" name="jabatan" class="form-control" value="<?= htmlspecialchars($siswa['jabatan']); ?>" required>
        <nowiki></div></nowiki>
        </div>
 
        <div class="mb-3">
        <nowiki><div class="mb-3"></nowiki>
            <label>Tahun Ajaran</label>
 
            <input type="text" name="tahun_ajaran" class="form-control" value="<?= htmlspecialchars($siswa['tahun_ajaran']); ?>" required>
            <label>No HP</label>
        </div>
 
        <button type="submit" class="btn btn-primary">Simpan Perubahan</button>
            <input type="text" name="no_hp" class="form-control" required>
        <a href="index.php" class="btn btn-secondary">Batal</a>
 
    </form>
        <nowiki></div></nowiki>
</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>
        <nowiki><div class="mb-3"></nowiki>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-Fy6S3B9q64WdZWQUiU+q4/2Lc9npb8tCaSX9FK7E8HnRr0Jz8D6OP9dO5Vg3Q9ct" crossorigin="anonymous"></script>
 
            <label>Riwayat Organisasi</label>
 
            <textarea name="riwayat_organisasi" class="form-control" required></textarea>
 
        <nowiki></div></nowiki>
 
        <nowiki><div class="mb-3"></nowiki>
 
            <label>Jabatan</label>
 
            <input type="text" name="jabatan" class="form-control" required>
 
        <nowiki></div></nowiki>
 
        <nowiki><div class="mb-3"></nowiki>
 
            <label>Tahun Ajaran</label>
 
            <input type="text" name="tahun_ajaran" class="form-control" required>
 
        <nowiki></div></nowiki>
 
        <button type="submit" class="btn btn-primary">Tambah Siswa</button>
 
        <a href="index.php" class="btn btn-secondary">Batal</a>
 
    </form>
 
<nowiki></div></nowiki>
 
<script src="jquery.slim.min.js"></script>
 
<script src="bootstrap.bundle.min.js"></script>
 
</body>
</body>
</html>
</html>
=Buat file edit.php=
<code><?php</code>
<code>include 'config.php';</code>
<code>// Ambil ID dari URL</code>
<code>$id = $_GET['id'];</code>
<code>// Ambil data siswa dari database</code>
<code>$stmt = $pdo->prepare("SELECT * FROM siswa WHERE id = ?");</code>
<code>$stmt->execute([$id]);</code>
<code>$siswa = $stmt->fetch();</code>
<code>// Jika form disubmit, update data siswa</code>
<code>if ($_SERVER['REQUEST_METHOD'] == 'POST') {</code>
<code>    $nama = $_POST['nama'];</code>
<code>    $kelas = $_POST['kelas'];</code>
<code>    $no_hp = $_POST['no_hp'];</code>
<code>    $riwayat_organisasi = $_POST['riwayat_organisasi'];</code>
<code>    $jabatan = $_POST['jabatan'];</code>
<code>    $tahun_ajaran = $_POST['tahun_ajaran'];</code>
<code>    // Update data siswa</code>
<code>    $stmt = $pdo->prepare("UPDATE siswa SET nama = ?, kelas = ?, no_hp = ?, riwayat_organisasi = ?, jabatan = ?, tahun_ajaran = ? WHERE id = ?");</code>
<code>    $stmt->execute([$nama, $kelas, $no_hp, $riwayat_organisasi, $jabatan, $tahun_ajaran, $id]);</code>
<code>    // Redirect ke halaman utama setelah update</code>
<code>    header("Location: index.php");</code>
<code>}</code>
<code>?></code>
<code><!DOCTYPE html></code>
<code><html lang="id"></code>
<code><head></code>
<code>    <meta charset="UTF-8"></code>
<code>    <meta name="viewport" content="width=device-width, initial-scale=1.0"></code>
<code>    <title>Edit Data Siswa</title></code>
<code>    <link rel="stylesheet" href="bootstrap.min.css"></code>
<code></head></code>
<code><body></code>
<code><nowiki><div class="container mt-5"></nowiki></code>
<code>    <nowiki><h2 class="mb-4">Edit Data Siswa</h2></nowiki></code>
<code>    <form method="POST"></code>
<code>        <nowiki><div class="mb-3"></nowiki></code>
<code>            <label>Nama</label></code>
<code>            <input type="text" name="nama" class="form-control" value="<?= htmlspecialchars($siswa['nama']); ?>" required></code>
<code>        <nowiki></div></nowiki></code>
<code>        <nowiki><div class="mb-3"></nowiki></code>
<code>            <label>Kelas</label></code>
<code>            <input type="text" name="kelas" class="form-control" value="<?= htmlspecialchars($siswa['kelas']); ?>" required></code>
<code>        <nowiki></div></nowiki></code>
<code>        <nowiki><div class="mb-3"></nowiki></code>
<code>            <label>No HP</label></code>
<code>            <input type="text" name="no_hp" class="form-control" value="<?= htmlspecialchars($siswa['no_hp']); ?>" required></code>
<code>        <nowiki></div></nowiki></code>
<code>        <nowiki><div class="mb-3"></nowiki></code>
<code>            <label>Riwayat Organisasi</label></code>
<code>            <nowiki><textarea name="riwayat_organisasi" class="form-control" required><?=htmlspecialchars($siswa['riwayat_organisasi']); ?></textarea></nowiki></code>
<code>        <nowiki></div></nowiki></code>
<code>        <nowiki><div class="mb-3"></nowiki></code>
<code>            <label>Jabatan</label></code>
<code>            <input type="text" name="jabatan" class="form-control" value="<?= htmlspecialchars($siswa['jabatan']); ?>" required></code>
<code>        <nowiki></div></nowiki></code>
<code>        <nowiki><div class="mb-3"></nowiki></code>
<code>            <label>Tahun Ajaran</label></code>
<code>            <input type="text" name="tahun_ajaran" class="form-control" value="<?= htmlspecialchars($siswa['tahun_ajaran']); ?>" required></code>
<code>        <nowiki></div></nowiki></code>
<code>        <button type="submit" class="btn btn-primary">Simpan Perubahan</button></code>
<code>        <a href="index.php" class="btn btn-secondary">Batal</a></code>
<code>    </form></code>
<code><nowiki></div></nowiki></code>
<code><script src="jquery.slim.min.js"></script></code>
<code><script src="bootstrap.bundle.min.js"></script></code>
<code></body></code>
<code></html></code>




=Buat file hapus.php=
=Buat file hapus.php=
<?php
<?php
include 'config.php';
include 'config.php';
$id = $_GET['id'];
$stmt = $pdo->prepare("DELETE FROM siswa WHERE id = ?");
$stmt->execute([$id]);
header("Location: index.php");
?>
 
= Download file css dan js =
masih di folder xitkj1.web1
 
download file css js dengan mengetikkan perintah
 
<code>wget https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css</code> enter
 
file js
 
<code>wget https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.slim.min.js</code> enter
 
<code>wget https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js</code> enter
 
= Menambahkan Data baru ke Database =
masuk ke mariadb lalu isi data ke dalam tabel siswa dengan ketikkan perintah berikut
 
USE organisasi_siswa;
INSERT INTO siswa (nama, kelas, no_hp, riwayat_organisasi, jabatan, tahun_ajaran) VALUES
('Andi Pratama', 'X TKJ 1', '081234567890', 'OSIS, Pramuka', 'Ketua', '2023/2024'),
('Budi Santoso', 'XI TKJ 2', '081234567891', 'Basket, OSIS', 'Anggota', '2022/2023'),
('Citra Dewi', 'XII TKJ 1', '081234567892', 'Paskibra, OSIS', 'Wakil Ketua', '2021/2022'),
('Dewi Sartika', 'X TKR 2', '081234567893', 'Pramuka', 'Anggota', '2023/2024'),
('Eko Wibowo', 'XI TBO 1', '081234567894', 'Basket, OSIS', 'Sekretaris', '2022/2023'),
('Fitri Nurjanah', 'XII TPL 2', '081234567895', 'Karate, OSIS', 'Anggota', '2021/2022'),
('Gilang Saputra', 'X TPL 3', '081234567896', 'Karate, Pramuka', 'Ketua', '2023/2024'),
('Hana Pertiwi', 'XI TPL 1', '081234567897', 'Paskibra, OSIS', 'Bendahara', '2022/2023'),
('Irfan Maulana', 'XII APAT 1', '081234567898', 'Basket, OSIS', 'Anggota', '2021/2022'),
('Joko Sugiarto', 'X PROFI 3', '081234567899', 'Karate', 'Anggota', '2023/2024'),
('Kartika Dewi', 'XI PROFI 3', '081234567800', 'Paskibra, OSIS', 'Sekretaris', '2022/2023'),
('Lina Suharti', 'XII TPL 2', '081234567801', 'Pramuka, OSIS', 'Bendahara', '2021/2022'),
('Maman Firmansyah', 'X TKR 2', '081234567802', 'Basket', 'Anggota', '2023/2024'),
('Nina Kusuma', 'XI TBO 2', '081234567803', 'Pramuka, Karate', 'Wakil Ketua', '2022/2023'),
('Oki Satria', 'XII TKJ 3', '081234567804', 'OSIS, Paskibra', 'Ketua', '2021/2022');
lalu tekan enter


$id = $_GET['id'];
$stmt = $pdo->prepare("DELETE FROM siswa WHERE id = ?");
$stmt->execute([$id]);


header("Location: index.php");
Jika sudah sampai tahap ini silakan akses '''ip_address_ct/aplikasi'''
?>

Revisi terkini sejak 14 November 2024 07.34

Sebelum memulai pastikan

apache2 apt install apache2

mariadb apt install mariadb-server

dns server apt install bind9

dan

php apt install php php-{fpm,common,mbstring,xmlrpc,soap,gd,xml,intl,mysql,cli,mcrypt,ldap,zip,curl} -y

, dan virtualhost sudah terinstall dengan baik

Siapkan Database

masuk ke mariadb

lalu ketikkan perintah berikut

mariadb (enter)
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(25) NOT NULL,
    no_hp VARCHAR(15) NOT NULL,
    riwayat_organisasi TEXT NOT NULL,
    jabatan VARCHAR(50) NOT NULL,
    tahun_ajaran VARCHAR(9) NOT NULL
);

masuk ke folder var/www/html/xitkj1.web1 lalu,

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';

// Mendapatkan kata kunci dari form pencarian jika ada

$search = isset($_GET['search']) ? $_GET['search'] : '';

// Tentukan berapa banyak data yang ditampilkan per halaman

$limit = 5;

// Dapatkan halaman saat ini dari URL, jika tidak ada, default ke 1

$page = isset($_GET['page']) ? (int)$_GET['page'] : 1;

$offset = ($page - 1) * $limit;

// Query untuk menghitung total data

$totalQuery = $pdo->query("SELECT COUNT(*) FROM siswa" . ($search ? " WHERE nama LIKE '%$search%' OR kelas LIKE '%$search%'" : ""));

$totalData = $totalQuery->fetchColumn();

$totalPages = ceil($totalData / $limit);

// Query untuk mengambil data siswa dengan paginasi

if ($search) {

    $query = $pdo->prepare("SELECT * FROM siswa WHERE nama LIKE ? OR kelas LIKE ? LIMIT :limit OFFSET :offset");

    $query->bindValue(1, "%$search%");

    $query->bindValue(2, "%$search%");

    $query->bindValue(':limit', $limit, PDO::PARAM_INT);

    $query->bindValue(':offset', $offset, PDO::PARAM_INT);

    $query->execute();

} else {

    $query = $pdo->prepare("SELECT * FROM siswa LIMIT :limit OFFSET :offset");

    $query->bindValue(':limit', $limit, PDO::PARAM_INT);

    $query->bindValue(':offset', $offset, PDO::PARAM_INT);

    $query->execute();

}

$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="bootstrap.min.css">

</head>

<body>

<div class="container mt-5">

    <h2 class="mb-4">Data Siswa Organisasi</h2>

   

   

    <?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>

    <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>

   

    <nav>

        <ul class="pagination">

            <?php for ($i = 1; $i <= $totalPages; $i++): ?>

                <li class="page-item <?= $i === $page ? 'active' : ''; ?>">

                    <a class="page-link" href="?page=<?= $i; ?>&search=<?= urlencode($search); ?>"><?= $i; ?></a>

                </li>

            <?php endfor; ?>

        </ul>

    </nav>

</div>

<script src="jquery.slim.min.js"></script>

<script src="bootstrap.bundle.min.js"></script>

</body>

</html>

Buat file tambah.php

<?php

include 'config.php';

// Jika form disubmit, tambahkan data siswa baru

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'];

    // Insert data siswa baru

    $stmt = $pdo->prepare("INSERT INTO siswa (nama, kelas, no_hp, riwayat_organisasi, jabatan, tahun_ajaran) VALUES (?, ?, ?, ?, ?, ?)");

    $stmt->execute([$nama, $kelas, $no_hp, $riwayat_organisasi, $jabatan, $tahun_ajaran]);

    // Redirect ke halaman utama setelah penambahan

    header("Location: index.php");

    exit();

}

?>

<!DOCTYPE html>

<html lang="id">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Tambah Data Siswa</title>

    <link rel="stylesheet" href="bootstrap.min.css">

</head>

<body>

<div class="container mt-5">

    <h2 class="mb-4">Tambah Data Siswa</h2>

    <form method="POST">

        <div class="mb-3">

            <label>Nama</label>

            <input type="text" name="nama" class="form-control" required>

        </div>

        <div class="mb-3">

            <label>Kelas</label>

            <input type="text" name="kelas" class="form-control" required>

        </div>

        <div class="mb-3">

            <label>No HP</label>

            <input type="text" name="no_hp" class="form-control" required>

        </div>

        <div class="mb-3">

            <label>Riwayat Organisasi</label>

            <textarea name="riwayat_organisasi" class="form-control" required></textarea>

        </div>

        <div class="mb-3">

            <label>Jabatan</label>

            <input type="text" name="jabatan" class="form-control" required>

        </div>

        <div class="mb-3">

            <label>Tahun Ajaran</label>

            <input type="text" name="tahun_ajaran" class="form-control" required>

        </div>

        <button type="submit" class="btn btn-primary">Tambah Siswa</button>

        <a href="index.php" class="btn btn-secondary">Batal</a>

    </form>

</div>

<script src="jquery.slim.min.js"></script>

<script src="bootstrap.bundle.min.js"></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="bootstrap.min.css">

</head>

<body>

<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>

    </form>

</div>

<script src="jquery.slim.min.js"></script>

<script src="bootstrap.bundle.min.js"></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");
?>

Download file css dan js

masih di folder xitkj1.web1

download file css js dengan mengetikkan perintah

wget https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css enter

file js

wget https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.slim.min.js enter

wget https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js enter

Menambahkan Data baru ke Database

masuk ke mariadb lalu isi data ke dalam tabel siswa dengan ketikkan perintah berikut

USE organisasi_siswa;

INSERT INTO siswa (nama, kelas, no_hp, riwayat_organisasi, jabatan, tahun_ajaran) VALUES
('Andi Pratama', 'X TKJ 1', '081234567890', 'OSIS, Pramuka', 'Ketua', '2023/2024'),
('Budi Santoso', 'XI TKJ 2', '081234567891', 'Basket, OSIS', 'Anggota', '2022/2023'),
('Citra Dewi', 'XII TKJ 1', '081234567892', 'Paskibra, OSIS', 'Wakil Ketua', '2021/2022'),
('Dewi Sartika', 'X TKR 2', '081234567893', 'Pramuka', 'Anggota', '2023/2024'),
('Eko Wibowo', 'XI TBO 1', '081234567894', 'Basket, OSIS', 'Sekretaris', '2022/2023'),
('Fitri Nurjanah', 'XII TPL 2', '081234567895', 'Karate, OSIS', 'Anggota', '2021/2022'),
('Gilang Saputra', 'X TPL 3', '081234567896', 'Karate, Pramuka', 'Ketua', '2023/2024'),
('Hana Pertiwi', 'XI TPL 1', '081234567897', 'Paskibra, OSIS', 'Bendahara', '2022/2023'),
('Irfan Maulana', 'XII APAT 1', '081234567898', 'Basket, OSIS', 'Anggota', '2021/2022'),
('Joko Sugiarto', 'X PROFI 3', '081234567899', 'Karate', 'Anggota', '2023/2024'),
('Kartika Dewi', 'XI PROFI 3', '081234567800', 'Paskibra, OSIS', 'Sekretaris', '2022/2023'),
('Lina Suharti', 'XII TPL 2', '081234567801', 'Pramuka, OSIS', 'Bendahara', '2021/2022'),
('Maman Firmansyah', 'X TKR 2', '081234567802', 'Basket', 'Anggota', '2023/2024'),
('Nina Kusuma', 'XI TBO 2', '081234567803', 'Pramuka, Karate', 'Wakil Ketua', '2022/2023'),
('Oki Satria', 'XII TKJ 3', '081234567804', 'OSIS, Paskibra', 'Ketua', '2021/2022');

lalu tekan enter


Jika sudah sampai tahap ini silakan akses ip_address_ct/aplikasi