├── .ftpquota
├── add.js
├── style.js
├── img
    ├── bg
    │   ├── bck.png
    │   └── memphis-colorful.png
    ├── 60433cda76cf5.png
    ├── 60433ff651b20.png
    ├── 6241a9866640c.jpg
    ├── 6241b3ab2eb06.png
    ├── 6241d36de4efc.png
    └── IMG-20211017-WA0205.jpg
├── logout.php
├── css
    ├── style.css
    └── login.css
├── README.md
├── hapus.php
├── export.php
├── detail.php
├── db
    └── data_siswa.sql
├── registrasi.php
├── login.php
├── function.php
├── addData.php
├── index.php
└── ubah.php


/.ftpquota:
--------------------------------------------------------------------------------
1 | 0 0
2 | 


--------------------------------------------------------------------------------
/add.js:
--------------------------------------------------------------------------------
1 | console.log("Hello, World!");
2 | 


--------------------------------------------------------------------------------
/style.js:
--------------------------------------------------------------------------------
1 | console.log("Hello, World!");
2 | 


--------------------------------------------------------------------------------
/img/bg/bck.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/farhanadeata/Website-CRUD/HEAD/img/bg/bck.png


--------------------------------------------------------------------------------
/img/60433cda76cf5.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/farhanadeata/Website-CRUD/HEAD/img/60433cda76cf5.png


--------------------------------------------------------------------------------
/img/60433ff651b20.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/farhanadeata/Website-CRUD/HEAD/img/60433ff651b20.png


--------------------------------------------------------------------------------
/img/6241a9866640c.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/farhanadeata/Website-CRUD/HEAD/img/6241a9866640c.jpg


--------------------------------------------------------------------------------
/img/6241b3ab2eb06.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/farhanadeata/Website-CRUD/HEAD/img/6241b3ab2eb06.png


--------------------------------------------------------------------------------
/img/6241d36de4efc.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/farhanadeata/Website-CRUD/HEAD/img/6241d36de4efc.png


--------------------------------------------------------------------------------
/img/IMG-20211017-WA0205.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/farhanadeata/Website-CRUD/HEAD/img/IMG-20211017-WA0205.jpg


--------------------------------------------------------------------------------
/img/bg/memphis-colorful.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/farhanadeata/Website-CRUD/HEAD/img/bg/memphis-colorful.png


--------------------------------------------------------------------------------
/logout.php:
--------------------------------------------------------------------------------
1 | <?php
2 | session_start();
3 | $_SESSION = [];
4 | session_unset();
5 | session_destroy();
6 | // Session dihapus dan logout
7 | 
8 | header('location: index.php');
9 |     // kembali ke index.php


--------------------------------------------------------------------------------
/css/style.css:
--------------------------------------------------------------------------------
 1 | body{
 2 |     font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
 3 | }
 4 | 
 5 | .navbar-brand{
 6 |     font-family: 'Righteous', cursive;
 7 | }
 8 | 
 9 | .link a{
10 |     display: inline-block;
11 |     margin-top: 20px;
12 |     margin-right: 10px;
13 |     color: #fff;
14 | }
15 | 
16 | .link a:hover .bi-facebook{
17 |     color: #3b5998;
18 | }
19 | 
20 | .link a:hover .bi-github{
21 |     color: #ccc;
22 | }
23 | 
24 | .link a:hover .bi-instagram{
25 |     color: #C13584;
26 | }
27 | 
28 | .link a:hover .bi-twitter{
29 |     color: #1DA1F2;
30 | }


--------------------------------------------------------------------------------
/css/login.css:
--------------------------------------------------------------------------------
 1 | body {
 2 |     font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
 3 |     background-color: #00adb5;
 4 |     text-transform: uppercase;
 5 | }
 6 | 
 7 | .warnanavbar {
 8 |     background-color: gray;
 9 | }
10 | 
11 | .navbar-brand {
12 |     font-family: 'Righteous', cursive;
13 | }
14 | 
15 | .login {
16 |     border: 0;
17 |     height: 500px;
18 |     margin: auto;
19 | }
20 | 
21 | .login h4 {
22 |     margin-top: 100px;
23 | }
24 | 
25 | form .form-group input {
26 |     margin: auto;
27 | }
28 | 
29 | form .user input {
30 |     margin: auto;
31 |     margin-top: 70px;
32 | }


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | <img align="right" src="https://visitor-badge.laobi.icu/badge?page_id=Farhanadeata.Website-CRUD" />
 2 | # WebCRUD
 3 | silahkan di ATM (AMATI,TIRU,MODIFIKASI)
 4 | 
 5 | TAMPILAN WEBSITE
 6 | ![gambar](https://user-images.githubusercontent.com/100106630/162618264-44bcdab9-7a52-4587-84d4-e4f3c4f0930a.png)
 7 | ![gambar](https://user-images.githubusercontent.com/100106630/162618268-0a9a58a8-3ebf-40ed-ab61-367999d0e839.png)
 8 | ![gambar](https://user-images.githubusercontent.com/100106630/162618296-f795d63d-b945-444d-87ee-e419efb3a075.png)
 9 | ![gambar](https://user-images.githubusercontent.com/100106630/162618348-9e8a5b09-c24c-4a51-83e5-567c1e829c94.png)
10 | 


--------------------------------------------------------------------------------
/hapus.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | session_start();
 3 | // // Jika tidak bisa login maka balik ke login.php
 4 | // jika masuk ke halaman ini melalui url, maka langsung menuju halaman login
 5 | if (!isset($_SESSION['login'])) {
 6 |     header('location:login.php');
 7 |     exit;
 8 | }
 9 | // Memanggil atau membutuhkan file function.php
10 | require 'function.php';
11 | 
12 | // Mengambil data dari nis dengan fungsi get
13 | $nis = $_GET['nis'];
14 | 
15 | // Jika fungsi hapus lebih dari 0/data terhapus, maka munculkan alert dibawah
16 | if (hapus($nis) > 0) {
17 |     echo "<script>
18 |                 alert('Data siswa berhasil dihapus!');
19 |                 document.location.href = 'index.php';
20 |             </script>";
21 | } else {
22 |     // Jika fungsi hapus dibawah dari 0/data tidak terhapus, maka munculkan alert dibawah
23 |     echo "<script>
24 |             alert('Data siswa gagal dihapus!');
25 |         </script>";
26 | }
27 | 


--------------------------------------------------------------------------------
/export.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | // Memanggil atau membutuhkan file function.php
 3 | require 'function.php';
 4 | 
 5 | // Menampilkan semua data dari table siswa berdasarkan nis secara Descending
 6 | $siswa = query("SELECT * FROM siswa ORDER BY nis DESC");
 7 | 
 8 | // Membuat nama file
 9 | $filename = "data siswa-" . date('Ymd') . ".xls";
10 | 
11 | // Kodingam untuk export ke excel
12 | header("Content-type: application/vnd-ms-excel");
13 | header("Content-Disposition: attachment; filename=Data Siswa.xls");
14 | 
15 | ?>
16 | <table class="text-center" border="1">
17 |     <thead class="text-center">
18 |         <tr>
19 |             <th>No.</th>
20 |             <th>NIS</th>
21 |             <th>Nama</th>
22 |             <th>Tempat dan Tanggal Lahir</th>
23 |             <th>Umur</th>
24 |             <th>Jenis Kelamin</th>
25 |             <th>Jurusan</th>
26 |             <th>E-Mail</th>
27 |             <th>Alamat</th>
28 |         </tr>
29 |     </thead>
30 |     <tbody class="text-center">
31 |         <?php $no = 1; ?>
32 |         <?php foreach ($siswa as $row) : ?>
33 |             <tr>
34 |                 <td><?= $no++; ?></td>
35 |                 <td><?= $row['nis']; ?></td>
36 |                 <td><?= $row['nama']; ?></td>
37 |                 <td><?= $row['tmpt_Lahir']; ?>, <?= $row['tgl_Lahir']; ?></td>
38 |                 <?php
39 |                 $now = time();
40 |                 $timeTahun = strtotime($row['tgl_Lahir']);
41 |                 $setahun = 31536000;
42 |                 $hitung = ($now - $timeTahun) / $setahun;
43 |                 ?>
44 |                 <td><?= floor($hitung); ?> Tahun</td>
45 |                 <td><?= $row['jekel']; ?></td>
46 |                 <td><?= $row['jurusan']; ?></td>
47 |                 <td><?= $row['email']; ?></td>
48 |                 <td><?= $row['alamat']; ?></td>
49 |             </tr>
50 |         <?php endforeach; ?>
51 |     </tbody>
52 | </table>


--------------------------------------------------------------------------------
/detail.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | // Memanggil atau membutuhkan file function.php
 3 | require 'function.php';
 4 | 
 5 | // Jika dataSiswa diklik maka
 6 | if (isset($_POST['dataSiswa'])) {
 7 |     $output = '';
 8 | 
 9 |     // mengambil data siswa dari nis yang berasal dari dataSiswa
10 |     $sql = "SELECT * FROM siswa WHERE nis = '" . $_POST['dataSiswa'] . "'";
11 |     $result = mysqli_query($koneksi, $sql);
12 | 
13 |     $output .= '<div class="table-responsive">
14 |                         <table class="table table-bordered">';
15 |     foreach ($result as $row) {
16 |         $output .= '<tr align="center">
17 |                             <td colspan="2"><img src="img/' . $row['gambar'] . '" width="50%"></td>
18 |                         </tr>
19 |                         <tr>
20 |                             <th width="40%">NIS</th>
21 |                             <td width="60%">' . $row['nis'] . '</td>
22 |                         </tr>
23 |                         <tr>
24 |                             <th width="40%">Nama</th>
25 |                             <td width="60%">' . $row['nama'] . '</td>
26 |                         </tr>
27 |                         <tr>
28 |                             <th width="40%">Tempat dan Tanggal Lahir</th>
29 |                             <td width="60%">' . $row['tmpt_Lahir'] . ', ' . date("d M Y", strtotime($row['tgl_Lahir'])) . '</td>
30 |                         </tr>
31 |                         <tr>
32 |                             <th width="40%">Jenis Kelamin</th>
33 |                             <td width="60%">' . $row['jekel'] . '</td>
34 |                         </tr>
35 |                         <tr>
36 |                             <th width="40%">Jurusan</th>
37 |                             <td width="60%">' . $row['jurusan'] . '</td>
38 |                         </tr>
39 |                         <tr>
40 |                             <th width="40%">E-Mail</th>
41 |                             <td width="60%">' . $row['email'] . '</td>
42 |                         </tr>
43 |                         <tr>
44 |                             <th width="40%">Alamat</th>
45 |                             <td width="60%">' . $row['alamat'] . '</td>
46 |                         </tr>
47 |                         ';
48 |     }
49 |     $output .= '</table></div>';
50 |     // Tampilkan $output
51 |     echo $output;
52 | }
53 | 


--------------------------------------------------------------------------------
/db/data_siswa.sql:
--------------------------------------------------------------------------------
 1 | -- phpMyAdmin SQL Dump
 2 | -- version 5.1.1
 3 | -- https://www.phpmyadmin.net/
 4 | --
 5 | -- Host: 127.0.0.1
 6 | -- Waktu pembuatan: 28 Mar 2022 pada 18.27
 7 | -- Versi server: 10.4.21-MariaDB
 8 | -- Versi PHP: 8.0.10
 9 | 
10 | SET SQL_MODE = "NO_AUTO_VALUE_ON_ZERO";
11 | START TRANSACTION;
12 | SET time_zone = "+00:00";
13 | 
14 | 
15 | /*!40101 SET @OLD_CHARACTER_SET_CLIENT=@@CHARACTER_SET_CLIENT */;
16 | /*!40101 SET @OLD_CHARACTER_SET_RESULTS=@@CHARACTER_SET_RESULTS */;
17 | /*!40101 SET @OLD_COLLATION_CONNECTION=@@COLLATION_CONNECTION */;
18 | /*!40101 SET NAMES utf8mb4 */;
19 | 
20 | --
21 | -- Database: `data_siswa`
22 | --
23 | 
24 | -- --------------------------------------------------------
25 | 
26 | --
27 | -- Struktur dari tabel `siswa`
28 | --
29 | 
30 | CREATE TABLE `siswa` (
31 |   `nis` varchar(50) NOT NULL,
32 |   `nama` varchar(255) NOT NULL,
33 |   `tmpt_Lahir` varchar(50) NOT NULL,
34 |   `tgl_Lahir` date NOT NULL,
35 |   `jekel` enum('Laki - Laki','Perempuan') NOT NULL,
36 |   `jurusan` enum('Teknik Listrik','Teknik Komputer dan Jaringan','Multimedia','Rekayasa Perangkat Lunak','Geomatika','Mesin') NOT NULL,
37 |   `email` varchar(255) NOT NULL,
38 |   `gambar` varchar(255) NOT NULL,
39 |   `alamat` text NOT NULL
40 | ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
41 | 
42 | --
43 | -- Dumping data untuk tabel `siswa`
44 | --
45 | 
46 | INSERT INTO `siswa` (`nis`, `nama`, `tmpt_Lahir`, `tgl_Lahir`, `jekel`, `jurusan`, `email`, `gambar`, `alamat`) VALUES
47 | ('1121', 'Farhan Ade Atalarik', 'Baturaja', '2003-08-27', 'Laki - Laki', 'Geomatika', 'fadeatalarik@gmail.com', '6241a9866640c.jpg', 'mars'),
48 | ('1', 'f', 'a', '2022-03-22', 'Laki - Laki', 'Multimedia', 'aa@gmail.com', '6241b3ab2eb06.png', 'aa'),
49 | ('11', 'WAW', 'BTA', '2022-04-05', 'Laki - Laki', '', 'A@Gmail.com', '6241d36de4efc.png', '1');
50 | 
51 | -- --------------------------------------------------------
52 | 
53 | --
54 | -- Struktur dari tabel `user`
55 | --
56 | 
57 | CREATE TABLE `user` (
58 |   `id` int(11) NOT NULL,
59 |   `username` varchar(50) NOT NULL,
60 |   `password` varchar(255) NOT NULL
61 | ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
62 | 
63 | --
64 | -- Dumping data untuk tabel `user`
65 | --
66 | 
67 | INSERT INTO `user` (`id`, `username`, `password`) VALUES
68 | (1, 'Admin', 'admin');
69 | 
70 | --
71 | -- Indexes for dumped tables
72 | --
73 | 
74 | --
75 | -- Indeks untuk tabel `user`
76 | --
77 | ALTER TABLE `user`
78 |   ADD PRIMARY KEY (`id`);
79 | 
80 | --
81 | -- AUTO_INCREMENT untuk tabel yang dibuang
82 | --
83 | 
84 | --
85 | -- AUTO_INCREMENT untuk tabel `user`
86 | --
87 | ALTER TABLE `user`
88 |   MODIFY `id` int(11) NOT NULL AUTO_INCREMENT, AUTO_INCREMENT=2;
89 | COMMIT;
90 | 
91 | /*!40101 SET CHARACTER_SET_CLIENT=@OLD_CHARACTER_SET_CLIENT */;
92 | /*!40101 SET CHARACTER_SET_RESULTS=@OLD_CHARACTER_SET_RESULTS */;
93 | /*!40101 SET COLLATION_CONNECTION=@OLD_COLLATION_CONNECTION */;
94 | 


--------------------------------------------------------------------------------
/registrasi.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | 
 3 | require 'function.php';
 4 | 
 5 | if (isset($_POST["register"])) {
 6 |     if (registrasi($_POST) > 0) {
 7 |         echo " <script>
 8 |             alert('user baru berhasil ditambahkan');
 9 |         </script> ";
10 |     } else {
11 |         echo mysqli_error($koneksi);
12 |     }
13 | }
14 | 
15 | ?>
16 | 
17 | <!DOCTYPE html>
18 | <html lang="en">
19 | 
20 | <head>
21 |      <meta charset="UTF-8">
22 |      <meta http-equiv="X-UA-Compatible" content="IE=edge">
23 |      <meta name="viewport" content="width=device-width, initial-scale=1.0">
24 |      <!-- Bootstrap -->
25 |      <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/css/bootstrap.min.css" rel="stylesheet"
26 |           integrity="sha384-BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl" crossorigin="anonymous">
27 |      <!-- Font Google -->
28 |      <link rel="preconnect" href="https://fonts.gstatic.com">
29 |      <link href="https://fonts.googleapis.com/css2?family=Righteous&display=swap" rel="stylesheet">
30 |      <!-- My CSS -->
31 |      <link rel="stylesheet" href="css/login.css">
32 | 
33 |      <title>From register</title>
34 | </head>
35 | 
36 | <body background="img/bg/bck.png">
37 | 
38 |      <div class="container">
39 |           <div class="row my-5">
40 |                <div class="col-md-6 text-center login bg-dark">
41 |                     <h4 class="fw-bold" style="color: white;">register</h4>
42 |                     <form action="" method="post">
43 |                          <div class="form-group my-3">
44 |                               <label for="username" class="text-light">username :</label>
45 |                               <input type="text" class="form-control w-50" name="username" id="username"
46 |                                    autocomplete="off">
47 |                          </div>
48 |                          <div class="form-group my-3">
49 |                               <label for="username" class="text-light">Password :</label>
50 |                               <input type="password" class="form-control w-50" name="password" id="password"
51 |                                    autocomplete="off">
52 |                          </div>
53 |                          <div class="form-group my-3">
54 |                               <label for="username" class="text-light"> Konfirmasi Password :</label>
55 |                               <input type="password" class="form-control w-50" name="password2" id="password2"
56 |                                    autocomplete="off">
57 |                          </div>
58 |                          <button class="btn btn-info btn-sm text-uppercase text-light" style="font-weight: 600;"
59 |                               type="submit" name="register">REGISTER</button>|
60 |                          <a href="login.php" class="btn btn-info btn-sm text-light" style="font-weight: 600;"><i
61 |                                    class="bi bi-pencil-square"></i>LOGIN</a> |
62 | 
63 |                     </form>
64 |                </div>
65 |           </div>
66 |      </div>
67 | 
68 | 
69 | 
70 |      <!-- Bootstrap -->
71 |      <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/js/bootstrap.bundle.min.js"
72 |           integrity="sha384-b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0" crossorigin="anonymous">
73 |      </script>
74 | </body>
75 | 
76 | </html>
77 | </body>
78 | 
79 | </html>


--------------------------------------------------------------------------------
/login.php:
--------------------------------------------------------------------------------
  1 | <?php
  2 | session_start();
  3 | // Jika bisa login maka ke index.php
  4 | if (isset($_SESSION['login'])) {
  5 |     header('location:index.php');
  6 |     exit;
  7 | }
  8 | 
  9 | // Memanggil atau membutuhkan file function.php
 10 | require 'function.php';
 11 | 
 12 | // jika tombol yang bernama login diklik
 13 | if (isset($_POST['login'])) {
 14 |     $username = $_POST['username'];
 15 |     $password = md5($_POST['password']);
 16 |     // password menggunakan md5
 17 | 
 18 |     // mengambil data dari user dimana username yg diambil
 19 |     $result = mysqli_query($koneksi, "SELECT * FROM user WHERE username = '$username'");
 20 | 
 21 |     $cek = mysqli_num_rows($result);
 22 | 
 23 |     // jika $cek lebih dari 0, maka berhasil login dan masuk ke index.php
 24 |     if ($cek > 0) {
 25 |         $_SESSION['login'] = true;
 26 | 
 27 |         // cek remember me
 28 |         if (isset($_POST['remember'])) {
 29 |             // buat cookie dan acak cookie
 30 | 
 31 |             setcookie('id', $row['id'], time() + 60);
 32 | 
 33 |             // mengacak $row dengan algoritma 'sha256'
 34 |             setcookie('key', hash('sha256', $row['username']), time() + 60);
 35 |         }
 36 | 
 37 |         header('location:index.php');
 38 |         exit;
 39 |     }
 40 |     // jika $cek adalah 0 maka tampilkan error
 41 |     $error = true;  
 42 | }
 43 | 
 44 | ?>
 45 | 
 46 | <!DOCTYPE html>
 47 | <html lang="en">
 48 | 
 49 | <head>
 50 |      <meta charset="UTF-8">
 51 |      <meta http-equiv="X-UA-Compatible" content="IE=edge">
 52 |      <meta name="viewport" content="width=device-width, initial-scale=1.0">
 53 |      <!-- Bootstrap -->
 54 |      <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/css/bootstrap.min.css" rel="stylesheet"
 55 |           integrity="sha384-BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl" crossorigin="anonymous">
 56 |      <!-- Font Google -->
 57 |      <link rel="preconnect" href="https://fonts.gstatic.com">
 58 |      <link href="https://fonts.googleapis.com/css2?family=Righteous&display=swap" rel="stylesheet">
 59 |      <!-- My CSS -->
 60 |      <link rel="stylesheet" href="css/login.css">
 61 | 
 62 |      <title>From Login</title>
 63 | </head>
 64 | 
 65 | <body background="img/bg/bck.png">
 66 | 
 67 |      <div class="container">
 68 |           <div class="row my-5">
 69 |                <div class="col-md-6 text-center login bg-dark">
 70 |                     <h4 class="fw-bold" style="color: white;">Login Dulu Banh:)</h4>
 71 |                     <!-- Ini Error jika tidak bisa login -->
 72 |                     <?php if (isset($error)) : ?>
 73 |                     <?php echo '<script>alert("Username atau Password Salah!");</script>'; ?>
 74 |                     <?php endif; ?>
 75 |                     <form action="" method="post">
 76 |                          <div class="form-group user">
 77 |                               <input type="text" class="form-control w-50" placeholder="Masukkan Username"
 78 |                                    name="username" autocomplete="off" required>
 79 |                          </div>
 80 |                          <div class="form-group my-5">
 81 |                               <input type="password" class="form-control w-50" placeholder="Masukkan Password"
 82 |                                    name="password" autocomplete="off" required>
 83 |                          </div>
 84 |                          <div class="btn-group" role="group" aria-label="Basic checkbox toggle button group">
 85 |                               <input type="checkbox" class="btn-check" name="remember" id="remember" autocomplete="off">
 86 |                               <label class="btn btn-outline-primary" for="remember">Remember Me</label>
 87 | 
 88 |                          </div>
 89 |                          <button class="btn btn-primary text-uppercase" type="submit" name="login">Login</button>
 90 |                          <a href="registrasi.php" class="btn btn-danger text-uppercase"><i
 91 |                                    class="bi bi-pencil-square"></i>SIGN UP</a> |
 92 | 
 93 |                     </form>
 94 |                </div>
 95 |           </div>
 96 |      </div>
 97 | 
 98 | 
 99 | 
100 |      <!-- Bootstrap -->
101 |      <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/js/bootstrap.bundle.min.js"
102 |           integrity="sha384-b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0" crossorigin="anonymous">
103 |      </script>
104 | </body>
105 | 
106 | </html>


--------------------------------------------------------------------------------
/function.php:
--------------------------------------------------------------------------------
  1 | <?php
  2 | // Koneksi Database
  3 | $koneksi = mysqli_connect("localhost", "root", "", "Data_siswa");
  4 | 
  5 | // membuat fungsi query dalam bentuk array
  6 | function query($query)
  7 | {
  8 |     // Koneksi database
  9 |     global $koneksi;
 10 | 
 11 |     $result = mysqli_query($koneksi, $query);
 12 | 
 13 |     // membuat varibale array
 14 |     $rows = [];
 15 | 
 16 |     // mengambil semua data dalam bentuk array
 17 |     while ($row = mysqli_fetch_assoc($result)) {
 18 |         $rows[] = $row;
 19 |     }
 20 | 
 21 |     return $rows;
 22 | }
 23 | 
 24 | // Membuat fungsi tambah
 25 | function tambah($data)
 26 | {
 27 |     global $koneksi;
 28 | 
 29 |     $nis = htmlspecialchars($data['nis']);
 30 |     $nama = htmlspecialchars($data['nama']);
 31 |     $tmpt_Lahir = htmlspecialchars($data['tmpt_Lahir']);
 32 |     $tgl_Lahir = $data['tgl_Lahir'];
 33 |     $jekel = $data['jekel'];
 34 |     $jurusan = $data['jurusan'];
 35 |     $email = htmlspecialchars($data['email']);
 36 |     $gambar = upload();
 37 |     $alamat = htmlspecialchars($data['alamat']);
 38 | 
 39 |     if (!$gambar) {
 40 |         return false;
 41 |     }
 42 | 
 43 |     $sql = "INSERT INTO siswa VALUES ('$nis','$nama','$tmpt_Lahir','$tgl_Lahir','$jekel','$jurusan','$email','$gambar','$alamat')";
 44 | 
 45 |     mysqli_query($koneksi, $sql);
 46 | 
 47 |     return mysqli_affected_rows($koneksi);
 48 | }
 49 | 
 50 | // Membuat fungsi hapus
 51 | function hapus($nis)
 52 | {
 53 |     global $koneksi;
 54 | 
 55 |     mysqli_query($koneksi, "DELETE FROM siswa WHERE nis = $nis");
 56 |     return mysqli_affected_rows($koneksi);
 57 | }
 58 | 
 59 | // Membuat fungsi ubah
 60 | function ubah($data)
 61 | {
 62 |     global $koneksi;
 63 | 
 64 |     $nis = $data['nis'];
 65 |     $nama = htmlspecialchars($data['nama']);
 66 |     $tmpt_Lahir = htmlspecialchars($data['tmpt_Lahir']);
 67 |     $tgl_Lahir = $data['tgl_Lahir'];
 68 |     $jekel = $data['jekel'];
 69 |     $jurusan = $data['jurusan'];
 70 |     $email = htmlspecialchars($data['email']);
 71 |     $alamat = htmlspecialchars($data['alamat']);
 72 | 
 73 |     $gambarLama = $data['gambarLama'];
 74 | 
 75 |     if ($_FILES['gambar']['error'] === 4) {
 76 |         $gambar = $gambarLama;
 77 |     } else {
 78 |         $gambar = upload();
 79 |     }
 80 | 
 81 |     $sql = "UPDATE siswa SET nama = '$nama', tmpt_Lahir = '$tmpt_Lahir', tgl_Lahir = '$tgl_Lahir', jekel = '$jekel', jurusan = '$jurusan', email = '$email', gambar = '$gambar', alamat = '$alamat' WHERE nis = $nis";
 82 | 
 83 |     mysqli_query($koneksi, $sql);
 84 | 
 85 |     return mysqli_affected_rows($koneksi);
 86 | }
 87 | 
 88 | // Membuat fungsi upload gambar
 89 | function upload()
 90 | {
 91 |     // Syarat
 92 |     $namaFile = $_FILES['gambar']['name'];
 93 |     $ukuranFile = $_FILES['gambar']['size'];
 94 |     $error = $_FILES['gambar']['error'];
 95 |     $tmpName = $_FILES['gambar']['tmp_name'];
 96 | 
 97 |     // Jika tidak mengupload gambar atau tidak memenuhi persyaratan diatas maka akan menampilkan alert dibawah
 98 |     if ($error === 4) {
 99 |         echo "<script>alert('Pilih gambar terlebih dahulu!');</script>";
100 |         return false;
101 |     }
102 | 
103 |     // format atau ekstensi yang diperbolehkan untuk upload gambar adalah
104 |     $extValid = ['jpg', 'jpeg', 'png'];
105 |     $ext = explode('.', $namaFile);
106 |     $ext = strtolower(end($ext));
107 | 
108 |     // Jika format atau ekstensi bukan gambar maka akan menampilkan alert dibawah
109 |     if (!in_array($ext, $extValid)) {
110 |         echo "<script>alert('Yang anda upload bukanlah gambar!');</script>";
111 |         return false;
112 |     }
113 | 
114 |     // Jika ukuran gambar lebih dari 3.000.000 byte maka akan menampilkan alert dibawah
115 |     if ($ukuranFile > 3000000) {
116 |         echo "<script>alert('Ukuran gambar anda terlalu besar!');</script>";
117 |         return false;
118 |     }
119 | 
120 |     // nama gambar akan berubah angka acak/unik jika sudah berhasil tersimpan
121 |     $namaFileBaru = uniqid();
122 |     $namaFileBaru .= '.';
123 |     $namaFileBaru .= $ext;
124 | 
125 |     // memindahkan file ke dalam folde img dengan nama baru
126 |     move_uploaded_file($tmpName, 'img/' . $namaFileBaru);
127 | 
128 |     return $namaFileBaru;
129 | }
130 | 
131 | function registrasi($data)
132 | {
133 |     global $koneksi;
134 | 
135 |     $username = strtolower(stripslashes($data["username"]));
136 |     $password = mysqli_real_escape_string($koneksi, $data["password"]);
137 |     $password2 = mysqli_real_escape_string($koneksi, $data["password2"]);
138 | 
139 |     // cek username sudah ada atau belum
140 |     $result = mysqli_query($koneksi, "SELECT username FROM user WHERE username = '$username'");
141 | 
142 |     if (mysqli_fetch_assoc($result)) {
143 |         echo "<script>
144 |                 alert('username sudah terdaftar');
145 |         </script>";
146 |         return false;
147 |     }
148 | 
149 |     // cek konfirmasi password
150 | 
151 |     if ($password !== $password2) {
152 |         echo "<script>
153 |                 alert('konfirmasi password tidak sesuai');
154 |         </script>";
155 |         return false;
156 |     }
157 | 
158 |     // enkripsi password
159 |     $password = password_hash($password, PASSWORD_DEFAULT);
160 | 
161 |     // tambahkan user baru ke database
162 |     mysqli_query($koneksi, "INSERT INTO user VALUES('', '$username', '$password')
163 |     ");
164 | 
165 |     return mysqli_affected_rows($koneksi);
166 | }


--------------------------------------------------------------------------------
/addData.php:
--------------------------------------------------------------------------------
  1 | <?php
  2 | session_start();
  3 | // Jika tidak bisa login maka balik ke login.php
  4 | // jika masuk ke halaman ini melalui url, maka langsung menuju halaman login
  5 | if (!isset($_SESSION['login'])) {
  6 |     header('location:login.php');
  7 |     exit;
  8 | }
  9 | 
 10 | // Memanggil atau membutuhkan file function.php
 11 | require 'function.php';
 12 | 
 13 | // Jika fungsi tambah lebih dari 0/data tersimpan, maka munculkan alert dibawah
 14 | if (isset($_POST['simpan'])) {
 15 |     if (tambah($_POST) > 0) {
 16 |         echo "<script>
 17 |                 alert('Data siswa berhasil ditambahkan!');
 18 |                 document.location.href = 'index.php';
 19 |             </script>";
 20 |     } else {
 21 |         // Jika fungsi tambah dari 0/data tidak tersimpan, maka munculkan alert dibawah
 22 |         echo "<script>
 23 |                 alert('Data siswa gagal ditambahkan!');
 24 |             </script>";
 25 |     }
 26 | }
 27 | 
 28 | 
 29 | ?>
 30 | <!DOCTYPE html>
 31 | <html lang="en">
 32 | 
 33 | <head>
 34 |      <meta charset="UTF-8">
 35 |      <meta http-equiv="X-UA-Compatible" content="IE=edge">
 36 |      <meta name="viewport" content="width=device-width, initial-scale=1.0">
 37 | 
 38 |      <!-- Bootstrap -->
 39 |      <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/css/bootstrap.min.css" rel="stylesheet"
 40 |           integrity="sha384-BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl" crossorigin="anonymous">
 41 |      <!-- Bootstrap Icons -->
 42 |      <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.4.0/font/bootstrap-icons.css">
 43 |      <!-- Font Google -->
 44 |      <link rel="preconnect" href="https://fonts.gstatic.com">
 45 |      <link href="https://fonts.googleapis.com/css2?family=Righteous&display=swap" rel="stylesheet">
 46 |      <!-- animasi Css Aos -->
 47 |      <link rel="stylesheet" href="https://unpkg.com/aos@next/dist/aos.css" />
 48 |      <!-- My CSS -->
 49 |      <link rel="stylesheet" href="css/style.css">
 50 | 
 51 |      <title>Tambah Data</title>
 52 | </head>
 53 | 
 54 | <body background="img/bg/bck.png">
 55 |      <!-- Navbar -->
 56 |      <nav class="navbar navbar-expand-lg navbar-dark bg-dark text-uppercase">
 57 |           <div class="container">
 58 |                <a class="navbar-brand" href="index.php">Sistem Admin Data Siswa</a>
 59 |                <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
 60 |                     aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
 61 |                     <span class="navbar-toggler-icon"></span>
 62 |                </button>
 63 |                <div class="collapse navbar-collapse" id="navbarNav">
 64 |                     <ul class="navbar-nav ms-auto">
 65 |                          <li class="nav-item">
 66 |                               <a class="nav-link" aria-current="page" href="index.php">Home</a>
 67 |                          </li>
 68 |                          <li class="nav-item">
 69 |                               <a class="nav-link" href="#about">About</a>
 70 |                          </li>
 71 |                          <li class="nav-item">
 72 |                               <a class="nav-link" href="logout.php">Logout</a>
 73 |                          </li>
 74 |                     </ul>
 75 |                </div>
 76 |           </div>
 77 |      </nav>
 78 |      <!-- Close Navbar -->
 79 | 
 80 |      <!-- Container -->
 81 |      <div class="container">
 82 |           <div class="row my-2">
 83 |                <div class="col-md text-light">
 84 |                     <h3 class="fw-bold text-uppercase Tambah_data"></h3>
 85 |                </div>
 86 |                <hr>
 87 |           </div>
 88 |           <div class="row my-2 text-light">
 89 |                <div class="col-md">
 90 |                     <form action="" method="post" enctype="multipart/form-data">
 91 |                          <div class="mb-3">
 92 |                               <label for="nis" class="form-label">NIS</label>
 93 |                               <input type="number" class="form-control w-50" id="nis" placeholder="Masukkan NIS" min="1"
 94 |                                    name="nis" autocomplete="off" required>
 95 |                          </div>
 96 |                          <div class="mb-3">
 97 |                               <label for="nama" class="form-label">Nama</label>
 98 |                               <input type="text" class="form-control form-control-md w-50" id="nama"
 99 |                                    placeholder="Masukkan Nama" name="nama" autocomplete="off" required>
100 |                          </div>
101 |                          <div class="mb-3">
102 |                               <label for="tmpt_Lahir" class="form-label">Tempat Lahir</label>
103 |                               <input type="text" class="form-control w-50" id="tmpt_Lahir"
104 |                                    placeholder="Masukkan Tempat Lahir" name="tmpt_Lahir" autocomplete="off" required>
105 |                          </div>
106 |                          <div class="mb-3">
107 |                               <label for="tgl_Lahir" class="form-label">Tanggal Lahir</label>
108 |                               <input type="date" class="form-control w-50" id="tgl_Lahir" name="tgl_Lahir"
109 |                                    max="01-01-2006" required>
110 |                          </div>
111 |                          <div class="mb-3">
112 |                               <label>Jenis Kelamin</label>
113 |                               <div class="form-check">
114 |                                    <input class="form-check-input" type="radio" name="jekel" id="Laki - Laki"
115 |                                         value="Laki - Laki">
116 |                                    <label class="form-check-label" for="Laki - Laki">Laki - Laki</label>
117 |                               </div>
118 |                               <div class="form-check">
119 |                                    <input class="form-check-input" type="radio" name="jekel" id="Perempuan"
120 |                                         value="Perempuan">
121 |                                    <label class="form-check-label" for="Perempuan">Perempuan</label>
122 |                               </div>
123 |                          </div>
124 |                          <div class="mb-3">
125 |                               <label for="jurusan" class="form-label">Jurusan</label>
126 |                               <select class="form-select w-50" id="jurusan" name="jurusan">
127 |                                    <option disabled selected value>--------------------------------------------Pilih
128 |                                         Jurusan--------------------------------------------</option>
129 |                                    <option value="Teknik Jaringan Akses">Teknik Listrik</option>
130 |                                    <option value="Teknik Komputer dan Jaringan">Teknik Komputer dan Jaringan</option>
131 |                                    <option value="Multimedia">Multimedia</option>
132 |                                    <option value="Rekayasa Perangkat Lunak">Rekayasa Perangkat Lunak</option>
133 |                                    <option value="Rekayasa Perangkat Lunak">Geomatika</option>
134 |                                    <option value="Rekayasa Perangkat Lunak">Mesin</option>
135 |                               </select>
136 |                          </div>
137 |                          <div class="mb-3">
138 |                               <label for="email" class="form-label">E-Mail</label>
139 |                               <input type="email" class="form-control w-50" id="email" placeholder="Masukkan E-Mail"
140 |                                    name="email" autocomplete="off" required>
141 |                          </div>
142 |                          <div class="mb-3">
143 |                               <label for="gambar" class="form-label">Gambar</label>
144 |                               <input class="form-control form-control-sm w-50" id="gambar" name="gambar" type="file">
145 |                          </div>
146 |                          <div class="mb-3">
147 |                               <label for="alamat" class="form-label">Alamat</label>
148 |                               <textarea class="form-control w-50" id="alamat" rows="5" name="alamat"
149 |                                    placeholder="Masukkan Alamat" autocomplete="off" required></textarea>
150 |                          </div>
151 |                          <hr>
152 |                          <a href="index.php" class="btn btn-secondary">Kembali</a>
153 |                          <button type="submit" class="btn btn-primary" name="simpan">Simpan</button>
154 |                     </form>
155 |                </div>
156 |           </div>
157 |      </div>
158 |      <!-- Close Container -->
159 | 
160 | 
161 | 
162 |      <!-- Footer -->
163 |      <div class="container-fluid">
164 |           <div class="row bg-dark text-white text-center">
165 |                <div class="col my-2" id="about">
166 |                     <br><br><br>
167 |                     <h4 class="fw-bold text-uppercase">About</h4>
168 | 
169 |                     <p>
170 |                          Pembuat:
171 |                          1. Farhan Ade Atalarik (2135038)
172 |                     </p>
173 |                </div>
174 |           </div>
175 |      </div>
176 |      <!-- Close Footer -->
177 | 
178 |      <!-- Bootstrap -->
179 |      <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/js/bootstrap.bundle.min.js"
180 |           integrity="sha384-b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0" crossorigin="anonymous">
181 |      </script>
182 | 
183 |      <!-- animasi  gsap-->
184 |      <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.9.1/gsap.min.js"> </script>
185 |      <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.9.1/TextPlugin.min.js"></script>
186 |      <script>
187 |      gsap.registerPlugin(TextPlugin);
188 |      gsap.to('.Tambah_data', {
189 |           duration: 2,
190 |           delay: 1,
191 |           text: '<i class="bi bi-person-plus-fill"></i>Tambah Data Siswa :)'
192 |      })
193 |      gsap.from('.navbar', {
194 |           duration: 1,
195 |           y: '-100%',
196 |           opacity: 0,
197 |           ease: 'bounce',
198 |      })
199 |      </script>
200 | </body>
201 | 
202 | </html>


--------------------------------------------------------------------------------
/index.php:
--------------------------------------------------------------------------------
  1 | <?php
  2 | session_start();
  3 | // Jika tidak bisa login maka balik ke login.php
  4 | // jika masuk ke halaman ini melalui url, maka langsung menuju halaman login
  5 | if (!isset($_SESSION['login'])) {
  6 |     header('location:login.php');
  7 |     exit;
  8 | }
  9 | 
 10 | // Memanggil atau membutuhkan file function.php
 11 | require 'function.php';
 12 | 
 13 | // Menampilkan semua data dari table siswa berdasarkan nis secara Descending
 14 | $siswa = query("SELECT * FROM siswa ORDER BY nis DESC");
 15 | ?>
 16 | <!DOCTYPE html>
 17 | <html lang="en">
 18 | 
 19 | <head>
 20 |      <meta charset="UTF-8">
 21 |      <meta http-equiv="X-UA-Compatible" content="IE=edge">
 22 |      <meta name="viewport" content="width=device-width, initial-scale=1.0">
 23 | 
 24 |      <!-- Bootstrap -->
 25 |      <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/css/bootstrap.min.css" rel="stylesheet"
 26 |           integrity="sha384-BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl" crossorigin="anonymous">
 27 |      <!-- Bootstrap Icons -->
 28 |      <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.4.0/font/bootstrap-icons.css">
 29 |      <!-- Data Tables -->
 30 |      <link rel="stylesheet" href="https://cdn.datatables.net/1.10.23/css/dataTables.bootstrap5.min.css">
 31 |      <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta1/dist/css/bootstrap.min.css">
 32 |      <!-- Font Google -->
 33 |      <link rel="preconnect" href="https://fonts.gstatic.com">
 34 |      <link href="https://fonts.googleapis.com/css2?family=Righteous&display=swap" rel="stylesheet">
 35 |      <!-- animasi Css Aos -->
 36 |      <link rel="stylesheet" href="https://unpkg.com/aos@next/dist/aos.css" />
 37 |      <!--My CSS -->
 38 |      <link rel="stylesheet" href="css/style.css">
 39 | 
 40 |      <title>Home</title>
 41 | </head>
 42 | 
 43 | <body background="img/bg/bck.png">
 44 |      <!-- Navbar -->
 45 |      <nav class="navbar navbar-expand-lg navbar-dark bg-dark text-uppercase">
 46 |           <div class="container">
 47 |                <a class="navbar-brand" href="index.php">Sistem Admin Data Siswa</a>
 48 |                <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
 49 |                     aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
 50 |                     <span class="navbar-toggler-icon"></span>
 51 |                </button>
 52 |                <div class="collapse navbar-collapse" id="navbarNav">
 53 |                     <ul class="navbar-nav ms-auto">
 54 |                          <li class="nav-item">
 55 |                               <a class="nav-link" aria-current="page" href="#">Home</a>
 56 |                          </li>
 57 |                          <li class="nav-item">
 58 |                               <a class="nav-link" href="#about">About</a>
 59 |                          </li>
 60 |                          <li class="nav-item">
 61 |                               <a class="nav-link" href="logout.php">Logout</a>
 62 |                          </li>
 63 |                     </ul>
 64 |                </div>
 65 |           </div>
 66 |      </nav>
 67 |      <!-- Close Navbar -->
 68 | 
 69 |      <!-- Container -->
 70 |      <div class="container">
 71 |           <div class="row my-2">
 72 |                <div class="col-md">
 73 |                     <h3 class="text-center fw-bold text-uppercase text-light data_siswa"></h3>
 74 |                     <hr>
 75 |                </div>
 76 |           </div>
 77 |           <div class="row my-2">
 78 |                <div class="col-md">
 79 |                     <a href="addData.php" class="btn btn-primary" data-aos="fade-right" data-aos-duration="800"
 80 |                          data-aos-delay="1200"><i class="bi bi-person-plus-fill"></i>Tambah Data</a>
 81 |                     <a href="export.php" target="_blank" class="btn btn-success ms-1" data-aos="fade-left"
 82 |                          data-aos-duration="1000" data-aos-delay="1600"><i
 83 |                               class="bi bi-file-earmark-spreadsheet-fill"></i>Ekspor ke Excel</a>
 84 |                </div>
 85 |           </div>
 86 |           <div class="row my-3" data-aos="fade" data-aos-duration="1000" data-aos-delay="2000">
 87 |                <div class="col-md">
 88 |                     <table id="data" class="table table-striped table-responsive table-hover text-center"
 89 |                          style="width:100%">
 90 |                          <thead class="table-dark">
 91 |                               <tr>
 92 |                                    <th>No.</th>
 93 |                                    <th>Nama</th>
 94 |                                    <th>Jenis Kelamin</th>
 95 |                                    <th>Umur</th>
 96 |                                    <th>Jurusan</th>
 97 |                                    <th>Aksi</th>
 98 |                               </tr>
 99 |                          </thead>
100 |                          <tbody>
101 |                               <?php $no = 1; ?>
102 |                               <?php foreach ($siswa as $row) : ?>
103 |                               <tr class="table-secondary text-dark">
104 |                                    <td><?= $no++; ?></td>
105 |                                    <td><?= $row['nama']; ?></td>
106 |                                    <td><?= $row['jekel']; ?></td>
107 |                                    <?php
108 |                                 $now = time();
109 |                                 $timeTahun = strtotime($row['tgl_Lahir']);
110 |                                 $setahun = 31536000;
111 |                                 $hitung = ($now - $timeTahun) / $setahun;
112 |                                 ?>
113 |                                    <td><?= floor($hitung); ?> Tahun</td>
114 |                                    <td><?= $row['jurusan']; ?></td>
115 |                                    <td>
116 |                                         <button class="btn btn-success btn-sm text-white detail"
117 |                                              data-id="<?= $row['nis']; ?>" style="font-weight: 600;"><i
118 |                                                   class="bi bi-info-circle-fill" data-aos="fade-right"
119 |                                                   data-aos-duration="800"></i>Detail</button> |
120 | 
121 |                                         <a href="ubah.php?nis=<?= $row['nis']; ?>" class="btn btn-warning btn-sm"
122 |                                              style="font-weight: 600;"><i class="bi bi-pencil-square"></i>Ubah</a> |
123 | 
124 |                                         <a href="hapus.php?nis=<?= $row['nis']; ?>" class="btn btn-danger btn-sm"
125 |                                              style="font-weight: 600;"
126 |                                              onclick="return confirm('Apakah anda yakin ingin menghapus data <?= $row['nama']; ?> ?');"><i
127 |                                                   class="bi bi-trash-fill"></i>Hapus</a>
128 |                                    </td>
129 |                               </tr>
130 |                               <?php endforeach; ?>
131 |                          </tbody>
132 |                     </table>
133 |                </div>
134 |           </div>
135 |      </div>
136 |      <!-- Close Container -->
137 | 
138 |      <!-- Modal Detail Data -->
139 |      <div class="modal fade" id="detail" tabindex="-1" aria-labelledby="detail" aria-hidden="true">
140 |           <div class="modal-dialog modal-dialog-scrollable modal-lg">
141 |                <div class="modal-content">
142 |                     <div class="modal-header">
143 |                          <h5 class="modal-title fw-bold text-uppercase" id="detail"></h5>
144 |                          <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
145 |                     </div>
146 |                     <div class="modal-body text-center" id="detail-siswa">
147 |                     </div>
148 |                </div>
149 |           </div>
150 |      </div>
151 |      <!-- Close Modal Detail Data -->
152 | 
153 |      <!-- Footer -->
154 |      <div class="container-fluid">
155 |           <div class="row bg-dark text-white text-center">
156 |                <div class="col my-2" id="about">
157 |                     <h4 class="fw-bold text-uppercase">About</h4>
158 |                     <br><br><br>
159 |                     <p>
160 |                          Pembuat:
161 |                          1. Farhan Ade Atalarik (2135038)
162 |                     </p>
163 |                </div>
164 |           </div>
165 |      </div>
166 | 
167 |      <!-- Close Footer -->
168 | 
169 |      <!-- Bootstrap -->
170 |      <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/js/bootstrap.bundle.min.js"
171 |           integrity="sha384-b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0" crossorigin="anonymous">
172 |      </script>
173 | 
174 |      <!-- Data Tables -->
175 |      <script src="https://code.jquery.com/jquery-3.5.1.js"></script>
176 |      <script src="https://cdn.datatables.net/1.10.23/js/jquery.dataTables.min.js"></script>
177 |      <script src="https://cdn.datatables.net/1.10.23/js/dataTables.bootstrap5.min.js"></script>
178 | 
179 |      <script>
180 |      $(document).ready(function() {
181 |           // Fungsi Table
182 |           $('#data').DataTable();
183 |           // Fungsi Table
184 | 
185 |           // Fungsi Detail
186 |           $('.detail').click(function() {
187 |                var dataSiswa = $(this).attr("data-id");
188 |                $.ajax({
189 |                     url: "detail.php",
190 |                     method: "post",
191 |                     data: {
192 |                          dataSiswa,
193 |                          dataSiswa
194 |                     },
195 |                     success: function(data) {
196 |                          $('#detail-siswa').html(data);
197 |                          $('#detail').modal("show");
198 |                     }
199 |                });
200 |           });
201 |           // Fungsi Detail
202 |      });
203 |      </script>
204 | 
205 |      <script src="https://unpkg.com/aos@next/dist/aos.js"></script>
206 |      <script>
207 |      AOS.init({
208 |           once: true,
209 | 
210 |      });
211 |      </script>
212 | 
213 |      <!-- animasi  gsap-->
214 |      <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.9.1/gsap.min.js"> </script>
215 |      <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.9.1/TextPlugin.min.js"></script>
216 |      <script>
217 |      gsap.registerPlugin(TextPlugin);
218 |      gsap.to('.data_siswa', {
219 |           duration: 1,
220 |           delay: 0.6,
221 |           text: 'Data Siswa :)'
222 |      })
223 |      gsap.from('.navbar', {
224 |           duration: 1,
225 |           y: '-100%',
226 |           opacity: 0,
227 |           ease: 'bounce',
228 |      })
229 |      </script>
230 | </body>
231 | 
232 | </html>


--------------------------------------------------------------------------------
/ubah.php:
--------------------------------------------------------------------------------
  1 | <?php
  2 | session_start();
  3 | // Jika tidak bisa login maka balik ke login.php
  4 | // jika masuk ke halaman ini melalui url, maka langsung menuju halaman login
  5 | if (!isset($_SESSION['login'])) {
  6 |     header('location:login.php');
  7 |     exit;
  8 | }
  9 | 
 10 | // Memanggil atau membutuhkan file function.php
 11 | require 'function.php';
 12 | 
 13 | // Mengambil data dari nis dengan fungsi get
 14 | $nis = $_GET['nis'];
 15 | 
 16 | // Mengambil data dari table siswa dari nis yang tidak sama dengan 0
 17 | $siswa = query("SELECT * FROM siswa WHERE nis = $nis")[0];
 18 | 
 19 | // Jika fungsi ubah lebih dari 0/data terubah, maka munculkan alert dibawah
 20 | if (isset($_POST['ubah'])) {
 21 |     if (ubah($_POST) > 0) {
 22 |         echo "<script>
 23 |                 alert('Data siswa berhasil diubah!');
 24 |                 document.location.href = 'index.php';
 25 |             </script>";
 26 |     } else {
 27 |         // Jika fungsi ubah dibawah dari 0/data tidak terubah, maka munculkan alert dibawah
 28 |         echo "<script>
 29 |                 alert('Data siswa gagal diubah!');
 30 |             </script>";
 31 |     }
 32 | }
 33 | 
 34 | 
 35 | ?>
 36 | <!DOCTYPE html>
 37 | <html lang="en">
 38 | 
 39 | <head>
 40 |      <meta charset="UTF-8">
 41 |      <meta http-equiv="X-UA-Compatible" content="IE=edge">
 42 |      <meta name="viewport" content="width=device-width, initial-scale=1.0">
 43 | 
 44 |      <!-- Bootstrap -->
 45 |      <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/css/bootstrap.min.css" rel="stylesheet"
 46 |           integrity="sha384-BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl" crossorigin="anonymous">
 47 |      <!-- Bootstrap Icons -->
 48 |      <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.4.0/font/bootstrap-icons.css">
 49 |      <!-- Font Google -->
 50 |      <link rel="preconnect" href="https://fonts.gstatic.com">
 51 |      <link href="https://fonts.googleapis.com/css2?family=Righteous&display=swap" rel="stylesheet">
 52 |      <!-- animasi CSS Aos -->
 53 |      <link rel="stylesheet" href="https://unpkg.com/aos@next/dist/aos.css" />
 54 |      <!-- My CSS -->
 55 |      <link rel="stylesheet" href="css/style.css">
 56 | 
 57 |      <title>Update Data</title>
 58 | </head>
 59 | 
 60 | <body background="img/bg/bck.png">
 61 |      <!-- Navbar -->
 62 |      <nav class="navbar navbar-expand-lg navbar-dark bg-dark text-uppercase">
 63 |           <div class="container">
 64 |                <a class="navbar-brand" href="index.php">Sistem Admin Data Siswa</a>
 65 |                <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
 66 |                     aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
 67 |                     <span class="navbar-toggler-icon"></span>
 68 |                </button>
 69 |                <div class="collapse navbar-collapse" id="navbarNav">
 70 |                     <ul class="navbar-nav ms-auto">
 71 |                          <li class="nav-item">
 72 |                               <a class="nav-link" aria-current="page" href="index.php">Home</a>
 73 |                          </li>
 74 |                          <li class="nav-item">
 75 |                               <a class="nav-link" href="#about">About</a>
 76 |                          </li>
 77 |                          <li class="nav-item">
 78 |                               <a class="nav-link" href="logout.php">Logout</a>
 79 |                          </li>
 80 |                     </ul>
 81 |                </div>
 82 |           </div>
 83 |      </nav>
 84 |      <!-- Close Navbar -->
 85 | 
 86 |      <!-- Container -->
 87 |      <div class="container">
 88 |           <div class="row my-2 text-light">
 89 |                <div class="col-md">
 90 |                     <h3 class="fw-bold text-uppercase ubah_data"></h3>
 91 |                </div>
 92 |                <hr>
 93 |           </div>
 94 |           <div class="row my-2 text-light">
 95 |                <div class="col-md">
 96 |                     <form action="" method="post" enctype="multipart/form-data">
 97 |                          <input type="hidden" name="gambarLama" value="<?= $siswa['gambar']; ?>">
 98 |                          <div class="mb-3">
 99 |                               <label for="nis" class="form-label">NIS</label>
100 |                               <input type="number" class="form-control w-50" id="nis" value="<?= $siswa['nis']; ?>"
101 |                                    name="nis" readonly>
102 |                          </div>
103 |                          <div class="mb-3">
104 |                               <label for="nama" class="form-label">Nama</label>
105 |                               <input type="text" class="form-control w-50" id="nama" value="<?= $siswa['nama']; ?>"
106 |                                    name="nama" autocomplete="off" required>
107 |                          </div>
108 |                          <div class="mb-3">
109 |                               <label for="tmpt_Lahir" class="form-label">Tempat Lahir</label>
110 |                               <input type="text" class="form-control w-50" id="tmpt_Lahir"
111 |                                    value="<?= $siswa['tmpt_Lahir']; ?>" name="tmpt_Lahir" autocomplete="off" required>
112 |                          </div>
113 |                          <div class="mb-3">
114 |                               <label for="tgl_Lahir" class="form-label">Tanggal Lahir</label>
115 |                               <input type="date" class="form-control w-50" id="tgl_Lahir"
116 |                                    value="<?= $siswa['tgl_Lahir']; ?>" name="tgl_Lahir" autocomplete="off" required>
117 |                          </div>
118 |                          <div class="mb-3">
119 |                               <label>Jenis Kelamin</label>
120 |                               <div class="form-check">
121 |                                    <input class="form-check-input" type="radio" name="jekel" id="Laki - Laki"
122 |                                         value="Laki - Laki" <?php if ($siswa['jekel'] == 'Laki - Laki') { ?> checked=''
123 |                                         <?php } ?>>
124 |                                    <label class="form-check-label" for="Laki - Laki">Laki - Laki</label>
125 |                               </div>
126 |                               <div class="form-check">
127 |                                    <input class="form-check-input" type="radio" name="jekel" id="Perempuan"
128 |                                         value="Perempuan" <?php if ($siswa['jekel'] == 'Perempuan') { ?> checked=''
129 |                                         <?php } ?>>
130 |                                    <label class="form-check-label" for="Perempuan">Perempuan</label>
131 |                               </div>
132 |                          </div>
133 |                          <div class="mb-3">
134 |                               <label for="jurusan" class="form-label">Jurusan</label>
135 |                               <select class="form-select w-50" id="jurusan" name="jurusan">
136 |                                    <option disabled selected value>--------------------------------------------Pilih
137 |                                         Jurusan--------------------------------------------</option>
138 |                                    <option value="Teknik Listrik" <?php if ($siswa['jurusan'] == 'Teknik Listrik') { ?>
139 |                                         selected='' <?php } ?>>Teknik Listrik</option>
140 |                                    <option value="Teknik Komputer dan Jaringan"
141 |                                         <?php if ($siswa['jurusan'] == 'Teknik Komputer dan Jaringan') { ?> selected=''
142 |                                         <?php } ?>>Teknik Komputer dan Jaringan</option>
143 |                                    <option value="Multimedia" <?php if ($siswa['jurusan'] == 'Multimedia') { ?>
144 |                                         selected='' <?php } ?>>Multimedia</option>
145 |                                    <option value="Rekayasa Perangkat Lunak"
146 |                                         <?php if ($siswa['jurusan'] == 'Rekayasa Perangkat Lunak') { ?> selected=''
147 |                                         <?php } ?>>Rekayasa Perangkat Lunak</option>
148 |                                    <option value="Geomatika" <?php if ($siswa['jurusan'] == 'Geomatika') { ?>
149 |                                         selected='' <?php } ?>>Geomatika</option>
150 |                                    <option value="Mesin" <?php if ($siswa['jurusan'] == 'Mesin') { ?> selected=''
151 |                                         <?php } ?>>Mesin</option>
152 |                               </select>
153 |                          </div>
154 |                          <div class="mb-3">
155 |                               <label for="email" class="form-label">E-Mail</label>
156 |                               <input type="email" class="form-control w-50" id="email" value="<?= $siswa['email']; ?>"
157 |                                    name="email" autocomplete="off" required>
158 |                          </div>
159 |                          <div class="mb-3">
160 |                               <label for="gambar" class="form-label">Gambar <i>(Saat ini)</i></label> <br>
161 |                               <img src="img/<?= $siswa['gambar']; ?>" width="50%" style="margin-bottom: 10px;">
162 |                               <input class="form-control form-control-sm w-50" id="gambar" name="gambar" type="file">
163 |                          </div>
164 |                          <div class="mb-3">
165 |                               <label for="alamat" class="form-label">Alamat</label>
166 |                               <textarea class="form-control w-50" id="alamat" rows="5" name="alamat"
167 |                                    autocomplete="off"><?= $siswa['alamat']; ?></textarea>
168 |                          </div>
169 |                          <hr>
170 |                          <a href="index.php" class="btn btn-secondary">Kembali</a>
171 |                          <button type="submit" class="btn btn-warning" name="ubah">Ubah</button>
172 |                     </form>
173 |                </div>
174 |           </div>
175 |      </div>
176 |      <!-- Close Container -->
177 | 
178 | 
179 | 
180 |      <!-- Footer -->
181 |      <div class="container-fluid">
182 |           <div class="row bg-dark text-white text-center">
183 |                <div class="col my-2" id="about">
184 |                     <br><br><br>
185 |                     <h4 class="fw-bold text-uppercase">About</h4>
186 | 
187 |                     <p>
188 |                          Pembuat:
189 |                          1. Farhan Ade Atalarik (2135038)
190 |                     </p>
191 |                </div>
192 |           </div>
193 |      </div>
194 |      <!-- Close Footer -->
195 | 
196 |      <!-- Bootstrap -->
197 |      <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/js/bootstrap.bundle.min.js"
198 |           integrity="sha384-b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0" crossorigin="anonymous">
199 |      </script>
200 | 
201 |      <!-- animasi  gsap-->
202 |      <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.9.1/gsap.min.js"> </script>
203 |      <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.9.1/TextPlugin.min.js"></script>
204 |      <script>
205 |      gsap.registerPlugin(TextPlugin);
206 |      gsap.to('.ubah_data', {
207 |           duration: 2,
208 |           delay: 1,
209 |           text: '<i class="bi bi-pencil-square"></i>Ubah Data Siswa'
210 |      })
211 |      gsap.from('.navbar', {
212 |           duration: 1,
213 |           y: '-100%',
214 |           opacity: 0,
215 |           ease: 'bounce',
216 |      })
217 |      </script>
218 | </body>
219 | 
220 | </html>


--------------------------------------------------------------------------------