Scribd
Upload
73 views11 pages

Yudha Julio - 2021230026 - UAS Prak - PemrogramanInternet

This document contains PHP code for a login and registration form. The login form code validates the username and password against a database and redirects to another page or displays an error on invalid credentials. The registration form code collects user details like name, username, password and gender and likely inserts it into the database. Both forms utilize Bootstrap for styling and layout.

Uploaded by

Yudha Julio
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
73 views11 pages

Yudha Julio - 2021230026 - UAS Prak - PemrogramanInternet

This document contains PHP code for a login and registration form. The login form code validates the username and password against a database and redirects to another page or displays an error on invalid credentials. The registration form code collects user details like name, username, password and gender and likely inserts it into the database. Both forms utilize Bootstrap for styling and layout.

Uploaded by

Yudha Julio
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 11

Nama : Yudha Julio Pratama

Nim : 2021230026
Matkul :Prak.Pemrograman Internet
LOGIN

Kode Program

<?php
session_start();
include("config/connection.php");
?>

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Login</title>
<link rel="icon" type="image/x-icon" href="assets/icons/Logo PMI.png">
<link
href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
rel="stylesheet" integrity="sha384-
Zenh87qX5JnK2Jl0vWa8Ck2rdkQ2Bzep5IDxbcnCeuOxjzrPF/et3URy9Bv1WTRi"
crossorigin="anonymous">
<link rel="stylesheet" href="css/login.css">
<!-- Fonts -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link
href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;700&displa
y=swap" rel="stylesheet">
<!-- Font Awesome -->
<link rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-
awesome.min.css" integrity="sha512-
SfTiTlX6kk+qitfevl/7LibUOeJWlt9rbyDn92a1DqWOw9vWG2MFoays0sgObmWazO5BQPiFucnnEA
jpAB+/Sw==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<!-- Sweet Alert 2 -->
<script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>
<!-- Javascript -->
<script
src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"
integrity="sha512-
3gJwYpMe3QewGELv8k/BX9vcqhryRdzRMxVfq6ngyWXwo03GFEzjsUm8Q7RZcHPHksttq7/GFoxjCV
UjkjvPdw==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
</head>
<body>
<div class="bungkus">
<div class="container">
<div class="row align-items-center justify-content-center py-
4">
<h2 class="mb-0 fw-bold text-center text-white">Login
<span style="color: #ffcf49;">Form</span></h2>
<p class="mb-3 text-center text-white">Please login
first</p>
<div class="col-lg-5 col-md-10 col-sm-10">

<form method="POST">
<!-- <h3 class="text-start fw-bold mb-2">Login</h3> --
>
<div class="mb-3">
<label for="username" class="form-
label">Username</label>
<input type="text" class="form-control-custom"
placeholder="your username" id="username" name="username" required>
</div>

<label for="password" class="form-


label">Password</label>
<div class="input-group mb-2">
<!-- shadownoe for remove outline when focus -
->
<input type="password" class="form-control
shadow-none" placeholder="your password" id="password-field" name="password"
requiredria-describedby="basic-addon2">
<div class="input-group-prepend">
<button class="show-hide-btn"
type="button">
<i toggle="#password-field" class="fa
fa-eye show-hide"></i>
</button>
</div>
</div>

<button type="submit" class="btn btn-primary py-2


px-4 fw-bold mt-3 w-100 btn-login text-white" name="login">Login</button>
<p style='font-size: 11px;' class="text-center mt-
2 mb-0">
Don't have an account yet? <a
href="register.php">Register</a>
</p>
</form>

</div>
</div>
</div>
<img src="assets/icons/Logo PMI.png" alt="" class="logo-pmi">
</div>
<!-- Jika Klik Tombol Submit -->
<?php
// Insert Query
if(isset($_POST['login'])){
$uname = $_POST['username'];
$pass = $_POST['password'];

// Query Input data


$sqlquery = $conn->query("SELECT * FROM users WHERE
username='$uname' AND password='$pass'");
$result = mysqli_num_rows($sqlquery);

// Check if there's an account with user input


if($result == 1){
$data = $sqlquery->fetch_assoc();

$_SESSION['user'] = $data;
echo '<script
type="text/javascript"> Swal.fire({
title: `Success!!!`,
text: `Login Success!`,
icon: `success`,
showConfirmButton: false,
timer: 1500,
timerProgressBar: true
})</script>
<script>setTimeout(function(){
window.location="../index.php";
}, 2000);
</script>';

} else {
echo '<script
type="text/javascript"> Swal.fire(
`Failed to Login!`,
`akun tersebut tidak terdaftar`,
`error`
)</script>';
}
}
?>
<!-- Jquery -->
<script>
$(".show-hide").click(function () {
$(this).toggleClass("fa-eye fa-eye-slash");
var input = $($(this).attr("toggle"));
if (input.attr("type") == "password") {
input.attr("type", "text");
} else {
input.attr("type", "password");
}
});
</script>
<script
src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min
.js" integrity="sha384-
OERcA2EqjJCMA+/3y+gxIOqMEjwtxJY7qPCqsdltbNJuaOe923+mo//f6V8Qbsw3"
crossorigin="anonymous"></script>
</body>
</html>
REGISTER

Kode Program

<?php
session_start();
include("config/connection.php");
?>

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Register</title>
<link rel="icon" type="image/x-icon" href="assets/icons/Logo PMI.png">
<link
href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
rel="stylesheet" integrity="sha384-
Zenh87qX5JnK2Jl0vWa8Ck2rdkQ2Bzep5IDxbcnCeuOxjzrPF/et3URy9Bv1WTRi"
crossorigin="anonymous">
<link rel="stylesheet" href="css/login.css">
<!-- Fonts -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link
href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;700&displa
y=swap" rel="stylesheet">
<!-- Font Awesome -->
<link rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-
awesome.min.css" integrity="sha512-
SfTiTlX6kk+qitfevl/7LibUOeJWlt9rbyDn92a1DqWOw9vWG2MFoays0sgObmWazO5BQPiFucnnEA
jpAB+/Sw==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<!-- Sweet Alert 2 -->
<script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>
<!-- Javascript -->
<script
src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"
integrity="sha512-
3gJwYpMe3QewGELv8k/BX9vcqhryRdzRMxVfq6ngyWXwo03GFEzjsUm8Q7RZcHPHksttq7/GFoxjCV
UjkjvPdw==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
</head>
<body>
<div class="bungkus">
<div class="container">
<div class="row align-items-center justify-content-center py-
4">
<h2 class="mb-0 fw-bold text-center text-white">Register
<span style="color: #ffcf49;">Form</span></h2>
<p class="mb-3 text-center text-white">Register your
account</h4>
<div class="col-lg-5 col-md-10 col-sm-10">

<form method="POST">
<div class="mb-2">
<label for="fullname" class="form-
label">Fullname</label>
<input type="text" class="form-control-custom"
placeholder="Fullname" id="fullname" name="fullname" required>
</div>

<div class="mb-2">
<label for="username" class="form-
label">Username</label>
<input type="text" class="form-control-custom"
placeholder="Username" id="username" name="username" required>
</div>

<label for="password" class="form-


label">Password</label>
<div class="input-group mb-2">
<!-- shadownoe for remove outline when focus -
->
<input type="password" class="form-control
shadow-none" placeholder="Password" id="password-field" name="password"
requiredria-describedby="basic-addon2">
<div class="input-group-prepend">
<button class="show-hide-btn"
type="button">
<i toggle="#password-field" class="fa
fa-eye show-hide"></i>
</button>
</div>
</div>

<div class="mb-2">
<label for="gender" class="form-
label">Gender</label>
<select class="form-select" name="gender"
id="gender" required>
<option value="" selected disabled
hidden>Choose your Gender</option>
<option value="M">Male</option>
<option value="F">Female</option>
</select>
</div>

<div class="mb-2">
<label for="phone" class="form-
label">Phone</label>
<input type="number" class="form-control-
custom" placeholder="Phone Number" id="phone" name="phone" required>
</div>

<button type="submit" class="btn btn-primary py-2


px-4 fw-bold mt-2 w-100 btn-login text-white"
name="register">Register</button>
<p style='font-size: 11px;' class="text-center mt-
2 mb-0">
Already have an account? <a
href="login.php">Login</a>
</p>
</form>

</div>
</div>
</div>
<img src="assets/icons/Logo PMI.png" alt="" class="logo-pmi">
</div>
<!-- Jika Klik Tombol Submit -->
<?php
// Duplicate Validation
function checkDuplicateEntry($connnection, $tableName, $columName,
$value)
{
$checkQuery = "SELECT COUNT(*) as count FROM $tableName WHERE
$columName = '$value'";
$checkResult = mysqli_query($connnection, $checkQuery);
$row = mysqli_fetch_assoc($checkResult);
$count = $row['count'];

// If there is duplicate entry then


if($count > 0){
return true;
} else {
return false;
}
}

// If register button clicked


if(isset($_POST['register'])){
$fullname = $_POST['fullname'];
$uname = $_POST['username'];
$pass = $_POST['password'];
$gender = $_POST['gender'];
$phone = $_POST['phone'];

// Check if request is already exist on users table


if(checkDuplicateEntry($conn, 'users', 'username', $uname)) {
echo '<script
type="text/javascript"> Swal.fire({
title: `Failed!`,
text: `Duplicate entry for username`,
icon: `error`,
showConfirmButton: false,
timer: 2000,
timerProgressBar: true
})</script>';
} else {
// Insert Query
$insertquery = "INSERT INTO users (`fullname`, `username`,
`password`, `gender`, `phone`) VALUES ('$fullname', '$uname', '$pass',
'$gender', '$phone')";
$result = $conn->query($insertquery);

if($result){
echo '<script
type="text/javascript"> Swal.fire({
title: `Success!`,
text: `Register Success! redirect to login page`,
icon: `success`,
showConfirmButton: false,
timer: 3000,
timerProgressBar: true
})</script>
<script>setTimeout(function(){
window.location="login.php";
}, 3500);
</script>';
} else {
$conn -> connect_error;
}
}
}
?>
<!-- Jquery -->
<script>
$(".show-hide").click(function () {
$(this).toggleClass("fa-eye fa-eye-slash");
var input = $($(this).attr("toggle"));
if (input.attr("type") == "password") {
input.attr("type", "text");
} else {
input.attr("type", "password");
}
});
</script>
<script
src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min
.js" integrity="sha384-
OERcA2EqjJCMA+/3y+gxIOqMEjwtxJY7qPCqsdltbNJuaOe923+mo//f6V8Qbsw3"
crossorigin="anonymous"></script>
</body>
</html>
Kode Program Connection.php

Kode Program Logout.php


Database phpMyAdmin

You might also like