Skip to main content

Website Pendaftaran Siswa Baru

Postingan berikut menjelaskan dokumentasi website Pendaftaran Siswa Baru. Website di-hosting di local PC menggunakan XAMPP serta menggunakan MySQL untuk menangani database dari para pendaftarnya.

Halaman Utama


Pendaftar dapat melakukan pendaftaran pada menu Daftar Baru atau melihat list pendaftar pada bagian Pendaftar.

Formulir Pendaftaran Siswa Baru

Disini, siswa dapat mengisikan formulir pendaftaran dan men-submit.

Menu Pendaftar

Menu Pendaftar isi menyajikan tabel yang berisi siswa yang telah mendaftar. Dapat dilakukan tindakan Edit atau Hapus pada setiap baris.

Formulir Edit Siswa

Formulir Edit Siswa menyajikan formulir untuk mengedit data siswa yang telah mendaftar. Setelah melakukan edit, dapat menekan tombol Simpan untuk menyimpan data siswa yang telah diperbarui.

Source Code

Untuk source code dari website Pendaftaran Siswa Baru ini adalah sebagai berikut.


Catatan: Judul file terletak pada sudut kiri bawah setiap embedded source code.
<?php
$server = "localhost";
$user = "root";
$password = "";
$nama_database = "pendaftaran_siswa";
$db = mysqli_connect($server, $user, $password, $nama_database);
if( !$db ){
die("Gagal terhubung dengan database: " . mysqli_connect_error());
}
?>
view raw config.php hosted with ❤ by GitHub
<!DOCTYPE html>
<html>
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<title>Formulir Pendaftaran Siswa Baru | SMK Coding</title>
</head>
<body>
<div class="mx-auto" style="width: 50%; margin-top: 5%;">
<!-- Centered element -->
<header>
<h3>Formulir Pendaftaran Siswa Baru</h3>
</header>
<br>
<form action="proses-pendaftaran.php" method="POST">
<fieldset>
<div class="mb-3">
<label for="nama" class="form-label">Nama</label>
<input type="text" class="form-control" id="nama" name="nama" placeholder="Nama lengkap" />
</div>
<div class="mb-3">
<label for="alamat" class="form-label">Alamat</label>
<input type="text" class="form-control" id="alamat" name="alamat" placeholder="Alamat" />
</div>
<div class="mb-3">
<label for="jenis_kelamin" class="form-label">Jenis Kelamin</label>
<label><input type="radio" name="jenis_kelamin" value="Laki-laki">Laki-laki</label>
<label><input type="radio" name="jenis_kelamin" value="perempuan">Perempuan</label>
</div>
<div class="mb-3">
<label for="agama" class="form-label">Agama</label>
<select name="agama" class="form-control">
<option>Islam</option>
<option>Kristen</option>
<option>Hindu</option>
<option>Budha</option>
</select>
</div>
<div class="mb-3">
<label for="sekolah_asal">Sekolah Asal </label>
<input type="text" class="form-control" name="sekolah_asal" id="sekolah_asal"
placeholder="Nama sekolah" />
</div>
<div class="mb-3">
<input type="submit" class="btn btn-primary" name="daftar" />
</div>
</fieldset>
<!-- <fieldset>
<p>
<label for="nama">Nama: </label>
<input type="text" name="nama" placeholder="nama lengkap" />
</p>
<p>
<label for="alamat">Alamat: </label>
<textarea name="alamat"></textarea>
</p>
<p>
<label for="jenis_kelamin">Jenis Kelamin: </label>
<label><input type="radio" name="jenis_kelamin" value="laki-laki"> Laki-laki</label>
<label><input type="radio" name="jenis_kelamin" value="perempuan"> Perempuan</label>
</p>
<p>
<label for="agama">Agama: </label>
<select name="agama">
<option>Islam</option>
<option>Kristen</option>
<option>Hindu</option>
<option>Budha</option>
<option>Atheis</option>
</select>
</p>
<p>
<label for="sekolah_asal">Sekolah Asal: </label>
<input type="text" name="sekolah_asal" placeholder="nama sekolah" />
</p>
<p>
<input type="submit" value="Daftar" name="daftar" />
</p>
</fieldset> -->
</form>
</div>
</body>
</html>
view raw form-daftar.php hosted with ❤ by GitHub
<?php
include("config.php");
// kalau tidak ada id di query string
if( !isset($_GET['id']) ){
header('Location: list-siswa.php');
}
//ambil id dari query string
$id = $_GET['id'];
// buat query untuk ambil data dari database
$sql = "SELECT * FROM calon_siswa WHERE id=$id";
$query = mysqli_query($db, $sql);
$siswa = mysqli_fetch_assoc($query);
// jika data yang di-edit tidak ditemukan
if( mysqli_num_rows($query) < 1 ){
die("data tidak ditemukan...");
}
?>
<!DOCTYPE html>
<html>
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<title>Formulir Edit Siswa | SMK Coding</title>
</head>
<body>
<div class="mx-auto" style="width: 50%; margin-top: 5%;">
<!-- Centered element -->
<header>
<h3>Formulir Edit Siswa</h3>
</header>
<br>
<form action="proses-edit.php" method="POST">
<fieldset>
<input type="hidden" name="id" value="<?php echo $siswa['id'] ?>" />
<div class="mb-3">
<label for="nama" class="form-label">Nama </label>
<input type="text" class="form-control" id="nama" name="nama" placeholder="nama lengkap" value="<?php echo $siswa['nama'] ?>" />
</div>
<div class="mb-3">
<label for="alamat" class="form-label">Alamat </label>
<textarea name="alamat" class="form-control" id="alamat" name="alamat"><?php echo $siswa['alamat'] ?></textarea>
</div>
<div class="mb-3">
<label for="jenis_kelamin" class="form-label">Jenis Kelamin </label>
<?php $jk = $siswa['jenis_kelamin']; ?>
<label><input type="radio" name="jenis_kelamin" value="laki-laki"
<?php echo ($jk == 'laki-laki') ? "checked": "" ?>> Laki-laki</label>
<label><input type="radio" name="jenis_kelamin" value="perempuan"
<?php echo ($jk == 'perempuan') ? "checked": "" ?>> Perempuan</label>
</div>
<div class="mb-3">
<label for="agama" class="form-label">Agama </label>
<?php $agama = $siswa['agama']; ?>
<select name="agama" class="form-control">
<option <?php echo ($agama == 'Islam') ? "selected": "" ?>>Islam</option>
<option <?php echo ($agama == 'Kristen') ? "selected": "" ?>>Kristen</option>
<option <?php echo ($agama == 'Hindu') ? "selected": "" ?>>Hindu</option>
<option <?php echo ($agama == 'Budha') ? "selected": "" ?>>Budha</option>
<option <?php echo ($agama == 'Atheis') ? "selected": "" ?>>Atheis</option>
</select>
</div>
<div class="mb-3">
<label for="sekolah_asal" class="form-label">Sekolah Asal </label>
<input type="text" class="form-control" name="sekolah_asal" id="sekolah_asal" placeholder="nama sekolah"
value="<?php echo $siswa['sekolah_asal'] ?>" />
</div>
<div class="mb-3">
<input type="submit" class="btn btn-primary" value="Simpan" name="simpan" />
</div>
</fieldset>
</form>
</div>
</body>
</html>
view raw form-edit.php hosted with ❤ by GitHub
<?php
include("config.php");
if( isset($_GET['id']) ){
// ambil id dari query string
$id = $_GET['id'];
// buat query hapus
$sql = "DELETE FROM calon_siswa WHERE id=$id";
$query = mysqli_query($db, $sql);
// apakah query hapus berhasil?
if( $query ){
header('Location: list-siswa.php');
} else {
die("gagal menghapus...");
}
} else {
die("akses dilarang...");
}
?>
view raw hapus.php hosted with ❤ by GitHub
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<title>Pendaftaran Siswa Baru | Coding High School</title>
</head>
<body>
<div class="mx-auto" style="width: 50%; margin-top: 5%;">
<!-- Centered element -->
<header>
<h3>Pendaftaran Siswa Baru</h3>
<h1>Coding High School</h1>
</header>
<br>
<h4>Menu</h4>
<nav>
<ul>
<li><a href="form-daftar.php">Daftar Baru</a></li>
<li><a href="list-siswa.php">Pendaftar</a></li>
</ul>
</nav>
<br>
<?php if(isset($_GET['status'])): ?>
<p>
<?php
if($_GET['status'] == 'sukses'){
echo "Pendaftaran siswa baru berhasil!";
} else {
echo "Pendaftaran gagal!";
}
?>
</p>
<?php endif; ?>
<!-- End of Centered element -->
</div>
<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous">
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"
integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous">
</script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"
integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous">
</script>
</body>
</html>
view raw index.php hosted with ❤ by GitHub
<?php include("config.php"); ?>
<!DOCTYPE html>
<html>
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<title>Pendaftaran Siswa Baru | SMK Coding</title>
</head>
<body>
<div class="mx-auto" style="width: 75%; margin-top: 5%;">
<!-- Centered element -->
<header>
<h3>Siswa yang telah mendaftar</h3>
</header>
<nav>
<a href="form-daftar.php">
<button type="submit" class="btn btn-primary">Tambah Baru</button>
</a>
</nav>
<br>
<table border="1" class="table table-striped table-bordered">
<thead>
<tr>
<th>No</th>
<th>Nama</th>
<th>Alamat</th>
<th>Jenis Kelamin</th>
<th>Agama</th>
<th>Sekolah Asal</th>
<th>Tindakan</th>
</tr>
</thead>
<tbody>
<?php
$sql = "SELECT * FROM calon_siswa";
$query = mysqli_query($db, $sql);
while($siswa = mysqli_fetch_array($query)){
echo "<tr>";
echo "<td>".$siswa['id']."</td>";
echo "<td>".$siswa['nama']."</td>";
echo "<td>".$siswa['alamat']."</td>";
echo "<td>".$siswa['jenis_kelamin']."</td>";
echo "<td>".$siswa['agama']."</td>";
echo "<td>".$siswa['sekolah_asal']."</td>";
echo "<td>";
echo "<a href='form-edit.php?id=".$siswa['id']."'>Edit</a> | ";
echo "<a href='hapus.php?id=".$siswa['id']."'>Hapus</a>";
echo "</td>";
echo "</tr>";
}
?>
</tbody>
</table>
<p>Total: <?php echo mysqli_num_rows($query) ?></p>
</div>
</body>
</html>
view raw list-siswa.php hosted with ❤ by GitHub
<?php
include("config.php");
// cek apakah tombol simpan sudah diklik atau blum?
if(isset($_POST['simpan'])){
// ambil data dari formulir
$id = $_POST['id'];
$nama = $_POST['nama'];
$alamat = $_POST['alamat'];
$jk = $_POST['jenis_kelamin'];
$agama = $_POST['agama'];
$sekolah = $_POST['sekolah_asal'];
// buat query update
$sql = "UPDATE calon_siswa SET nama='$nama', alamat='$alamat', jenis_kelamin='$jk', agama='$agama', sekolah_asal='$sekolah' WHERE id=$id";
$query = mysqli_query($db, $sql);
// apakah query update berhasil?
if( $query ) {
// kalau berhasil alihkan ke halaman list-siswa.php
header('Location: list-siswa.php');
} else {
// kalau gagal tampilkan pesan
die("Gagal menyimpan perubahan...");
}
} else {
die("Akses dilarang...");
}
?>
view raw proses-edit.php hosted with ❤ by GitHub
<?php
include("config.php");
// cek apakah tombol daftar sudah diklik atau blum?
if(isset($_POST['daftar'])){
// ambil data dari formulir
$nama = $_POST['nama'];
$alamat = $_POST['alamat'];
$jk = $_POST['jenis_kelamin'];
$agama = $_POST['agama'];
$sekolah = $_POST['sekolah_asal'];
// buat query
$sql = "INSERT INTO calon_siswa (nama, alamat, jenis_kelamin, agama, sekolah_asal) VALUE ('$nama', '$alamat', '$jk', '$agama', '$sekolah')";
$query = mysqli_query($db, $sql);
// apakah query simpan berhasil?
if( $query ) {
// kalau berhasil alihkan ke halaman index.php dengan status=sukses
header('Location: index.php?status=sukses');
} else {
// kalau gagal alihkan ke halaman indek.php dengan status=gagal
header('Location: index.php?status=gagal');
}
} else {
die("Akses dilarang...");
}
?>
view raw proses-pendaftaran.php hosted with ❤ by GitHub

Sekian post tentang dokumentasi Pendaftaran Siswa Baru ini. Semoga bermanfaat.

Comments

  1. Nice PostDecember 13, 2021 at 5:48 PM

    Nama : Ramadhan Arif Hardijansyah
    NRP : 05111940000162
    Kelas : PWEB A
    Tahun : 2021
    Link Blogspot : Dokumentasi Blog

    ReplyDelete

Post a Comment

Popular posts from this blog

Website Registrasi Kuliah Tatap Muka

  Postingan berikut menjelaskan dokumentasi proses pembuatan website registrasi kuliah tatap muka. Website di-hosting menggunakan github pages yang dapat meng-host  static webpages . Link Website Catalog Product:  https://dani-ramadhan7.github.io/registrasi/index.html Langkah-Langkah Pembuatan Website Registrasi Kuliah Tatap Muka 1. Ikuti langkah-langkah pada website pembelajaran. Salah satu website yang cukup bagus untuk dipelajari adalah  belajarphp.net/tutorial-validasi-form-menggunakan-html-dan-javascript/ . Coba untuk menulis ulang contoh kode pada modul pembelajaran atau langsung memilih bagian-bagian kode yang diinginkan untuk digunakan. 2. Buat file html baru, buat page html dengan acuan modul pembelajaran. Lakukan modifikasi dan penambahan. HTML JavaScript 3. Untuk desain, digunakan file css sebagaimana yang digunakan pada website, yakni menggunakan  https://stackpath.boo...
Post a Comment
Read more

ETS PWEB A

ETS PW 2021 - Memprogram User Interface Nama: Ramadhan Arif Hardijansyah NRP: 05111940000162 Kelas: PWeb - A Soal 1. Jelaskan istilah-istilah berikut, kemudian berikan contohnya. - HTML Element - HTML Tag - CSS Selector - Ajax 2. Apa yang dimaksud URI, URL, dan URN, berikan contoh dan ilustrasinya.  Jawaban https://drive.google.com/file/d/1WlfDY8QcrHAxIneStOm6P4yNDriptz0O/view?usp=sharing
Post a Comment
Read more