EAS PWEB
- Rancangan Database
- Rancangan Interface
Log in Page
Menu dan Fitur
Tampilan
Demo Klik Disini
Source Code
config.php
<?php
$server = "localhost";
$user = "cokopist_hazimi";
$password = "cokopist_hazimi";
$nama_database = "cokopist_hazimi";
$db = mysqli_connect($server, $user, $password, $nama_database);
if( !$db ){
die("Gagal terhubung dengan database: " . mysqli_connect_error());
}
?>
data-list-siswa.php
<?php include("config.php"); ?>
<!DOCTYPE html>
<html>
<head>
<title>List Siswa PPDB</title>
<link rel="stylesheet" type="text/css" href="css/bootstrap.css">
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/bootstrap.js"></script>
<style type="text/css">
body {
text-align: center;
}
</style>
</head>
<body>
<table class="table table-hover table-dark">
<thead>
<tr>
<th scope="col">No</th>
<th scope="col">Nama</th>
<th scope="col">Alamat</th>
<th scope="col">Jenis Kelamin</th>
<th scope="col">Agama</th>
<th scope="col">Sekolah Asal</th>
<th scope="col">Sekolah Pilihan</th>
<th scope="col">Tindakan</th>
</tr>
</thead>
<tbody>
<?php
$sql = "SELECT * FROM calon_siswa";
$query = mysqli_query($db, $sql);
$no = 0;
while($siswa = mysqli_fetch_array($query)){
echo "<tr>";
$no++;
echo "<th scope='row'>".$no."</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>".$siswa['sekolah_pilihan']."</td>";
echo "<td>";
echo "<a href='form-edit.php?id=".$siswa['id']."'><input class='btn btn-light' type='button' value='Edit'/></a>  ";
echo "<input class='btn btn-light' type='button' onclick=hapus('".$siswa['id']."') value='Hapus'>";
echo "</td>";
echo "</tr>";
}
echo "<tr>";
echo "<td colspan='8'>";
echo "<a href='index.php'><button class='btn btn-light' type='button'>Menu Utama</button></a>  ";
echo "<a href='form-daftar.php'><button class='btn btn-light' type='button'>Tambah Data</button></a>";
echo "<a href='view.php'><button class='btn btn-light' type='button'>View Formulir</button></a>";
echo "<form method='post' action='download.php'>
<input type='submit' name='download' class='btn btn-light value='Download' />";
?>
</tbody>
</table>
</body>
</html>
download.php
<?php
//export.php
$connect = mysqli_connect("localhost", "cokopist_hazimi", "cokopist_hazimi", "cokopist_hazimi");
$output = '';
if(isset($_POST["download"]))
{
$query = "SELECT * FROM calon_siswa";
$result = mysqli_query($connect, $query);
if(mysqli_num_rows($result) > 0)
{
$output .= '
<table class="table" bordered="1">
<tr>
<th>ID</th>
<th>Nama</th>
<th>Alamat</th>
<th>Jenis_Kelamin</th>
<th>Agama</th>
<th>Sekolah_asal</th>
<th>Sekolah_pilihan</th>
</tr>
';
while($row = mysqli_fetch_array($result))
{
$output .= '
<tr>
<td>'.$row["id"].'</td>
<td>'.$row["nama"].'</td>
<td>'.$row["alamat"].'</td>
<td>'.$row["jenis_kelamin"].'</td>
<td>'.$row["agama"].'</td>
<td>'.$row["sekolah_asal"].'</td>
<td>'.$row["sekolah_pilihan"].'</td>
</tr>
';
}
$output .= '</table>';
header('Content-Type: application/xls');
header('Content-Disposition: attachment; filename=download.xls');
echo $output;
}
}
?>
errors.php
<?php if (count($errors) > 0) : ?>
<div class="error">
<?php foreach ($errors as $error) : ?>
<p><?php echo $error ?></p>
<?php endforeach ?>
</div>
<?php endif ?>
form-daftar.php
<!DOCTYPE HTML>
<html>
<head>
<title>Pendaftaran Peserta Didik Baru Kota Surabaya</title>
<link rel="stylesheet" type="text/css" href="css/bootstrap.css">
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/bootstrap.js"></script>
<style type="text/css">
body {
text-align: center;
background-color: royalblue;
}
</style>
</head>
<body class="p-3 mb-2 text-white">
<script type="text/javascript">
function insertData(){
var name = document.getElementById("nama").value;
var address = document.getElementById("alamat").value;
var gender = document.getElementById("jenis_kelamin").value;
var religion = document.getElementById("agama").value;
var school1 = document.getElementById("sekolah_asal").value;
var school2 = document.getElementById("sekolah_pilihan").value;
if(window.XMLHttpRequest)
{
xmlhttp = new XMLHttpRequest();
}
else
{
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function(){
if(this.readyState==4 && this.status==200)
{
alert(this.responseText);
if(this.responseText == "sukses")
{
alert('Data berhasil disimpan');
}
}
}
xmlhttp.open("GET","proses-pendaftaran.php?name=" + name + "&address=" + address + "&gender=" + gender + "&religion=" + religion + "&school1=" + school1 + "&school2=" + school2, true);
xmlhttp.send();
}
</script>
<header>
<h3 align="center">Formulir Pendaftaran Peserta Didik Baru</h3>
</header>
<br>
<div class="p-3 mb-2 bg-dark text-white">
<form action="proses-pendaftaran.php">
<ul class="list-group">
<div class="p-3 mb-2 bg-light text-dark">
<div class="form-group">
<label for="nama">Nama </label>
<input type="text" class="form-control" id="nama" placeholder="Nama Lengkap" />
</div>
<div class="form-group">
<label for="alamat">Alamat </label>
<textarea class="form-control" id="alamat" rows="3"></textarea>
</div>
<!-- Jenis Kelamin -->
<div class="form-group">
<label>Jenis Kelamin </label>
<select class="form-control" id="jenis_kelamin">
<option>Laki-laki</option>
<option>Perempuan</option>
</select>
</div>
<!-- Agama -->
<div class="form-group">
<label for="agama">Agama </label>
<select class="form-control" id="agama">
<option>Islam</option>
<option>Kristen</option>
<option>Hindu</option>
<option>Budha</option>
<option>Katolik</option>
</select>
</div>
<div class="form-group">
<label for="sekolah_asal">Sekolah Asal </label>
<input type="text" class="form-control" id="sekolah_asal" placeholder="Nama Sekolah Asal" />
</div>
<div class="form-group">
<label for="sekolah_pilihan">Sekolah Pilihan </label>
<input type="text" class="form-control" id="sekolah_pilihan" placeholder="Nama Sekolah Pilihan" />
<br/>
<input class="btn btn-primary" type="button" value="Daftar" name="Daftar" onclick="insertData()" />
 
<a href="index.php"><input class="btn btn-primary" type="button" value="Menu Utama"/></a></input>
 
<a href="list-siswa.php"><input class="btn btn-primary" type="button" value="Pendaftar"/></a></input>
</div>
</ul>
</div>
</div>
</form>
</div>
</body>
</html>
form-edit.php
<?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'];
// untuk mengambil data dari database
$sql = "SELECT * FROM calon_siswa WHERE id=$id";
?>
<link rel="stylesheet" type="text/css" href="css/bootstrap.css">
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/bootstrap.js"></script>
<script type="text/javascript">
function updateData(){
var name = document.getElementById("nama").value;
var address = document.getElementById("alamat").value;
var gender = document.getElementById("jenis_kelamin").value;
var religion = document.getElementById("agama").value;
var school1 = document.getElementById("sekolah_asal").value;
var school2 = document.getElementById("sekolah_pilihan").value;
if(window.XMLHttpRequest)
{
xmlhttp = new XMLHttpRequest();
}
else
{
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if(this.readyState==4 && this.status==200)
{
alert(this.responseText);
if(this.responseText == "sukses")
{
alert('Perubahan berhasil disimpan');
}
else {
alert('Perubahan gagal disimpan');
}
}
}
xmlhttp.open("GET","proses-edit.php?id=" + <?php echo $id;?> + "&name=" + name + "&address=" + address + "&gender=" + gender + "&religion=" + religion + "&school1=" + school1 + "&school2=" + school2, true);
xmlhttp.send();
}
</script>
<!DOCTYPE html>
<html>
<head>
<title>Pendaftaran Peserta Didik Baru Kota Surabaya</title>
<style type="text/css">
body {
text-align: center;
}
</style>
</head>
<body class="p-3 mb-2 bg-dark text-white">
<header>
<h3 align="center">Edit Formulir Pendaftaran Peserta Didik Baru Kota Surabaya</h3>
</header>
<div class="p-3 mb-2 bg-secondary text-white">
<form action="proses-edit.php">
<ul class="list-group">
<input type="hidden" name="id" value="<?php echo $siswa['id'] ?>" />
<div class="p-3 mb-2 bg-light text-dark">
<div class="form-group">
<li class="list-group-item">
<label for="nama">Nama </label>
<input type="text" class="form-control" id="nama" placeholder="Nama Lengkap.." />
</li>
</div>
<div class="form-group">
<li class="list-group-item">
<label for="alamat">Alamat </label>
<textarea class="form-control" id="alamat" rows="3"></textarea>
</li>
</div>
<!-- Jenis Kelamin -->
<div class="form-group">
<li class="list-group-item">
<label for="jenis_kelamin">Jenis Kelamin </label>
<select class="form-control" id="jenis_kelamin">
<option>Laki-laki</option>
<option>Perempuan</option>
</select>
</li>
</div>
<!-- Agama -->
<div class="form-group">
<li class="list-group-item">
<label for="agama">Agama </label>
<select class="form-control" id="agama">
<option>Islam</option>
<option>Kristen</option>
<option>Hindu</option>
<option>Budha</option>
<option>Katolik</option>
</select>
</li>
</div>
<div class="form-group">
<li class="list-group-item">
<label for="sekolah_asal">Sekolah Asal </label>
<input type="text" class="form-control" id="sekolah_asal" placeholder="nama sekolah" />
</li>
</div>
<div class="form-group">
<li class="list-group-item">
<label for="sekolah_pilihan">Sekolah Pilihan </label>
<input type="text" class="form-control" id="sekolah_pilihan" placeholder="nama sekolah" />
</li>
<br/>
<input class="btn btn-secondary" type="button" value="Update" name="update" onclick="updateData()" />
 
<a href="index.php"><input class="btn btn-secondary" type="button" name="home" value="Menu Utama"/></a>
 
<a href="list-siswa.php"><input class="btn btn-primary" type="button" value="Pendaftar"/></a></input>
</div>
</ul>
</div>
</form>
</body>
</html>
hapus.php
<?php
include("config.php");
if( isset($_GET['id']) )
{
// mengambil ID dari query
$id = $_GET['id'];
// menghapus data dari database
$sql = "DELETE FROM calon_siswa WHERE id=$id";
$query = mysqli_query($db, $sql);
//jika query berhasil
if( $query )
{
alert('Data berhasil dihapus');
header('Location: list-siswa.php');
}
else
{
alert('gagal menghapus data');
}
}
else
{
alert('akses dilarang...');
}
?>
index.php
<?php
session_start();
if (!isset($_SESSION['username'])) {
$_SESSION['msg'] = "You must log in first";
header('location: login.php');
}
if (isset($_GET['logout'])) {
session_destroy();
unset($_SESSION['username']);
header("location: login.php");
}
?>
<!DOCTYPE HTML>
<html>
<head>
<title>Pendaftaran Peserta Didik Baru Kota Surabaya</title>
<link rel="stylesheet" type="text/css" href="css/bootstrap.css">
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/bootstrap.js"></script>
<style type="text/css">
body {
text-align: center;
background-color: darkblue;
}
</style>
</head>
<body class="p-3 mb-2 text-white">
<header>
<br>
<h3 align="center">Pendaftaran Peserta Didik Baru</h3>
<h1 align="center">Kota Surabaya</h1>
</header>
<br>
<br>
<div class="p-3 mb-2 bg-dark text-white">
<h4 align="center">Menu</h4>
<div class="p-3 mb-2 bg-light text-dark">
<a href="form-daftar.php"><button class="btn btn-light" type="button">Daftar Baru</button></a>
<a href="list-siswa.php"><button class="btn btn-light" type="button">Pendaftar</button></a>
</div>
</div>
</body>
</html>
list-siswa.php
<?php include("config.php"); ?>
<!DOCTYPE html>
<html>
<head>
<title>Pendaftaran Peserta Didik Baru Kota Surabaya</title>
<link rel="stylesheet" type="text/css" href="css/bootstrap.css">
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/bootstrap.js"></script>
<style type="text/css">
body {
text-align: center;
}
</style>
</head>
<body class="p-3 mb-2" style="background-color: rgba(13, 75, 156, 1); color: black;">
<header>
<h2 align="center">List Pendaftaran Peserta Didik Baru</h2>
<h2 align="center">Kota Surabaya</h2>
</header>
<br>
<div class="p-3 mb-2 text-white" style="background-color: lightblue;">
<div id='data_siswa'></div>
</div>
</body>
</html>
<script type="text/javascript">
function hapus(id)
{
if(window.XMLHttpRequest)
{ xmlhttp = new XMLHttpRequest(); }
else
{ xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); }
xmlhttp.onreadystatechange=function(){
if(this.readyState==4 && this.status==200)
{
alert(this.responseText);
listData();
}
}
xmlhttp.open("GET","proses-hapus.php?id=" + id, true);
xmlhttp.send();
}
function listData()
{
if(window.XMLHttpRequest)
{ xmlhttp = new XMLHttpRequest(); }
else
{ xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); }
xmlhttp.onreadystatechange=function()
{
if(this.readyState==4 && this.status==200)
{
document.getElementById('data_siswa').innerHTML = this.responseText;
}
}
xmlhttp.open("GET","data-list-siswa.php", true);
xmlhttp.send();
}
listData();
</script>
login.php
<?php include('server.php') ?>
<!DOCTYPE html>
<html>
<head>
<title>Pendaftaran Peserta Didik Baru Kota Surabaya</title>
<link rel="stylesheet" type="text/css" href="css/bootstrap.css">
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/bootstrap.js"></script>
<style type="text/css">
ul{
display:table; margin:0 auto;
}
body {
text-align: center;
}
fieldset{
background-color: lightgrey;
}
</style>
</head>
<body class="p-3 mb-2 bg-dark text-white">
<header>
<h3 align="center">Pendaftaran Peserta Didik Baru</h3>
<h1 align="center">Kota Surabaya</h1>
</header>
<form method="post" action="login.php">
<div class="p-3 mb-2 bg-secondary text-white">
<h4 align="center">Login</h4>
<div class="p-3 mb-2 bg-light text-dark">
<div class="form-group">
<li class="list-group-item">
<label for="nama">Username</label>
<input type="text" name="username" class="form-control" id="username" placeholder="Username" />
</li>
</div>
<div class="form-group">
<li class="list-group-item">
<label for="password">Password </label>
<input type="password" name="password" class="form-control" id="password"></input>
</li>
<br/>
<input class="btn btn-primary" type="submit" name="login_user" value="Login"/></input>  
<a href="register.php"><input class="btn btn-primary" type="button" value="Sign Up"/></a></input>
</div>
</div>
</div>
</form>
</body>
</html>
proses-edit.php
<?php
include("config.php");
$id = $_GET['id'];
$name = $_GET['name'];
$address = $_GET['address'];
$gender = $_GET['gender'];
$religion = $_GET['religion'];
$school1 = $_GET['school1'];
$school2 = $_GET['school2'];
// buat query update
$sql = "UPDATE calon_siswa SET nama='$name', alamat='$address', jenis_kelamin='$gender', agama='$religion', sekolah_asal='$school1', sekolah_pilihan='$school2' WHERE id=$id";
$query = mysqli_query($db, $sql);
//jika query berhasil
if( $query ) {
// kalau berhasil alihkan ke halaman list-siswa.php
echo "Data berhasil diperbaharui";
}
else
{
//jika gagal
echo "Data gagal diperbaharui";
}
?>
proses-hapus.php
<?php include("config.php"); ?>
<?php
mysqli_query($db, "delete from calon_siswa where id = ".$_GET['id']);
?>
proses-pendaftaran.php
<?php
include("config.php");
$nama = $_GET['name'];
$alamat = $_GET['address'];
$jenis_kelamin = $_GET['gender'];
$agama = $_GET['religion'];
$sekolah_asal = $_GET['school1'];
$sekolah_pilihan = $_GET['school2'];
$sql = "INSERT INTO calon_siswa (nama, alamat, jenis_kelamin, agama, sekolah_asal, sekolah_pilihan) VALUE('$nama', '$alamat', '$jenis_kelamin', '$agama', '$sekolah_asal','$sekolah_pilihan')";
$query = mysqli_query($db,$sql);
if($query)
{
// jika berhasil
echo "Data berhasil dimasukkan.";
}
else
{
//jika gagal
echo "Data gagal dimasukkan.";
}
?>
register.php
<?php include('server.php') ?>
<!DOCTYPE html>
<html>
<head>
<title>Pendaftaran Peserta Didik Baru Kota Surabaya</title>
<link rel="stylesheet" type="text/css" href="css/bootstrap.css">
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/bootstrap.js"></script>
<style type="text/css">
ul{
display:table; margin:0 auto;
}
body {
text-align: center;
}
fieldset{
background-color: lightgrey;
}
</style>
</head>
<body class="p-3 mb-2 bg-dark text-white">
<form method="post" action="register.php">
<?php include('errors.php'); ?>
<header>
<h3 align="center">Pendaftaran Peserta Didik Baru</h3>
<h1 align="center">Kota Surabaya</h1>
</header>
<form method="post" action="login.php">
<div class="p-3 mb-2 bg-secondary text-white">
<div class="p-3 mb-2 bg-light text-dark">
<div class="form-group">
<li class="list-group-item">
<label for="username">Username </label>
<input type="text" name="username" value="<?php echo $username; ?>" class="form-control" id="username" placeholder="Username" />
</li>
</div>
<div class="form-group">
<li class="list-group-item">
<label for="email">Email </label>
<input type="email" name="email" class="form-control" id="email" value="<?php echo $email; ?>"></input>
</li>
</div>
<div class="form-group">
<li class="list-group-item">
<label for="password1">Password </label>
<input type="password" name="password_1" class="form-control"/>
</li>
</div>
<div class="form-group">
<li class="list-group-item">
<label for="password2">Confirm Password </label>
<input type="password" name="password_2" class="form-control"/>
</li>
</div>
<div class="form-group">
<button type="submit" class="btn" name="reg_user">Register</button> 
<a href="login.php"><input class="btn btn-primary" type="button" value="Sign In"/></a></input>
</div>
</div>
</div>
<!-- -->
<!-- <div class="input-group">
<label>Username</label>
<input type="text" name="username" value="<?php echo $username; ?>">
</div>
<div class="input-group">
<label>Email</label>
<input type="email" name="email" value="<?php echo $email; ?>">
</div>
<div class="input-group">
<label>Password</label>
<input type="password" name="password_1">
</div>
<div class="input-group">
<label>Confirm password</label>
<input type="password" name="password_2">
</div>
<div class="input-group">
<button type="submit" class="btn" name="reg_user">Register</button>
</div>
<p>
Already a member? <a href="login.php">Sign in</a>
</p> -->
<!-- -->
</form>
</body>
</html>
server.php
<?php
session_start();
// initializing variables
$username = "";
$email = "";
$errors = array();
// connect to the database
$db = mysqli_connect('localhost', 'cokopist_hazimi', 'cokopist_hazimi', 'cokopist_hazimi');
// REGISTER USER
if (isset($_POST['reg_user'])) {
// receive all input values from the form
$username = mysqli_real_escape_string($db, $_POST['username']);
$email = mysqli_real_escape_string($db, $_POST['email']);
$password_1 = mysqli_real_escape_string($db, $_POST['password_1']);
$password_2 = mysqli_real_escape_string($db, $_POST['password_2']);
// form validation: ensure that the form is correctly filled ...
// by adding (array_push()) corresponding error unto $errors array
if (empty($username)) { array_push($errors, "Username is required"); }
if (empty($email)) { array_push($errors, "Email is required"); }
if (empty($password_1)) { array_push($errors, "Password is required"); }
if ($password_1 != $password_2) {
array_push($errors, "The two passwords do not match");
}
// first check the database to make sure
// a user does not already exist with the same username and/or email
$user_check_query = "SELECT * FROM users WHERE username='$username' OR email='$email' LIMIT 1";
$result = mysqli_query($db, $user_check_query);
$user = mysqli_fetch_assoc($result);
if ($user) { // if user exists
if ($user['username'] === $username) {
array_push($errors, "Username already exists");
}
if ($user['email'] === $email) {
array_push($errors, "email already exists");
}
}
// Finally, register user if there are no errors in the form
if (count($errors) == 0) {
$password = md5($password_1);//encrypt the password before saving in the database
$query = "INSERT INTO users (username, email, password)
VALUES('$username', '$email', '$password')";
mysqli_query($db, $query);
$_SESSION['username'] = $username;
$_SESSION['success'] = "You are now logged in";
header('location: index.php');
}
}
// LOGIN USER
if (isset($_POST['login_user'])) {
$username = mysqli_real_escape_string($db, $_POST['username']);
$password = mysqli_real_escape_string($db, $_POST['password']);
if (empty($username)) {
array_push($errors, "Username is required");
}
if (empty($password)) {
array_push($errors, "Password is required");
}
if (count($errors) == 0) {
$password = md5($password);
$query = "SELECT * FROM users WHERE username='$username' AND password='$password'";
$results = mysqli_query($db, $query);
if (mysqli_num_rows($results) == 1) {
$_SESSION['username'] = $username;
$_SESSION['success'] = "You are now logged in";
header('location: index.php');
}else {
array_push($errors, "Wrong username/password combination");
}
}
}
?>
Komentar
Posting Komentar