Cara Membuat CRUD PHP & MYSQL Dengan validasi Huruf Dan Spasi
Selamat siang para pembaca yang budiman.
Tak terasa hari telah siang. Ditemani segelas es teh manis, kali ini saya akan membagikan sedikit artikel tentang membuat CRUD menggunakan PHP MySql dan dengan validasi input fieldnya.
Oke langsung saja kita ke pembahasannya.
CRUD (Create Read Update Delete) merupakan suatu metode untuk menginput membaca dan menghapus suatu data. Data itu berasal dari inputan user.
Dalam tutorial kali ini data yang diinputkan ada Nama, Username, Password, dan Email.
Oke, kali ini ada beberapa file yang akan kita buat diantaranya :
Oke, kali ini ada beberapa file yang akan kita buat diantaranya :
- index.php
- config.php
- add.php
- edit.php
- delete.php
Langsung saja kita ke pokok pembahasan. Cekibroot....
- Pertama kita akan membuat database terlebih dahulu
Beri nama database "crud_db" dan tabelnya namanya user...
- Setelah itu kita buat file dengan nama "config.php"
<?php
/**
* using mysqli_connect for database connection
*/
$databaseHost = 'localhost';
$databaseName = 'crud_db';
$databaseUsername = 'root';
$databasePassword = '';
$mysqli = mysqli_connect($databaseHost, $databaseUsername, $databasePassword, $databaseName);
?>
- Kemudian buat file index.php
File ini merupakan file yang pertamakali dieksekusi saat menjalankan aplikasi dan untuk menampilkan hasil yang telah diinputkan sebelumnya.
Berikut sourcecode nya ;
Berikut sourcecode nya ;
<?php
// Create database connection using config file
include_once("config.php");
// Fetch all users data from database
$result = mysqli_query($mysqli, "SELECT * FROM users ORDER BY id DESC");
?>
<html>
<head>
<title>Homepage</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<a href="add.php"><button class="button">Add New User</button></a>
<br/><br/>
<table class="table1">
<tr>
<th>Name</th> <th>Password</th> <th>Username</th> <th>Email</th> <th>Update</th>
</tr>
<?php
while($user_data = mysqli_fetch_array($result)) {
echo "<tr>";
echo "<td>".$user_data['name']."</td>";
echo "<td>".$user_data['password']."</td>";
echo "<td>".$user_data['username']."</td>";
echo "<td>".$user_data['email']."</td>";
echo "<td><a href='edit.php?id=$user_data[id]'>Edit</a> | <a href='delete.php?id=$user_data[id]'>Delete</a></td></tr>";
}
?>
</table>
</body>
</html>
ini hasil tampilannya dengan css :
- Setelah itu kita buat file dengan nama "add.php"
<html>
<head>
<title>Add Users</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<a href="index.php"><button class="button">Go to Home</button></a>
<br/><br/>
<form action="add.php" method="post" name="form1">
<table class="table1">
<tr>
<td>Name</td>
<td><input type="text" name="name"></td>
</tr>
<tr>
<td>Username</td>
<td><input type="text" name="username"></td>
</tr>
<tr>
<td>Password</td>
<td><input type="text" name="password"></td>
</tr>
<tr>
<td>Email</td>
<td><input type="text" name="email"></td>
</tr>
<tr>
<td></td>
<td><input type="submit" name="Submit" value="Add"></td>
</tr>
</table>
</form>
<?php
// Check If form submitted, insert form data into users table.
if(isset($_POST['Submit'])) {
$name = $_POST['name'];
$username = $_POST['username'];
$password = $_POST['password'];
$email = $_POST['email'];
// include database connection file
include_once("config.php");
// Insert user data into table
$result = mysqli_query($mysqli, "INSERT INTO users(name,username,password,email) VALUES('$name','$username','$password','$email')");
// Show message when user added
echo "User added successfully. <a href='index.php'>View Users</a>";
}
?>
</body>
</html>
ini hasil tampilannya dengan css :
- Setelah itu kita buat file dengan nama "edit.php"
<?php
// include database connection file
include_once("config.php");
// Check if form is submitted for user update, then redirect to homepage after update
if(isset($_POST['update']))
{
$id = $_POST['id'];
$name=$_POST['name'];
$password=$_POST['password'];
$username=$_POST['username'];
$email=$_POST['email'];
// update user data
$result = mysqli_query($mysqli, "UPDATE users SET name='$name',username='$username',password='$password',email='$email' WHERE id=$id");
// Redirect to homepage to display updated user in list
header("Location: index.php");
}
?>
<?php
// Display selected user data based on id
// Getting id from url
$id = $_GET['id'];
// Fetech user data based on id
$result = mysqli_query($mysqli, "SELECT * FROM users WHERE id=$id");
while($user_data = mysqli_fetch_array($result))
{
$name = $user_data['name'];
$username = $user_data['username'];
$password = $user_data['password'];
$email = $user_data['email'];
}
?>
<html>
<head>
<title>Edit User Data</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<a href="index.php"><button class="button">Home</button></a>
<br/><br/>
<form name="update_user" method="post" action="edit.php">
<table class="table1">
<tr>
<td>Name</td>
<td><input type="text" name="name" value=<?php echo $name;?>></td>
</tr>
<tr>
<td>Username</td>
<td><input type="text" name="username" value=<?php echo $username;?>></td>
</tr>
<tr>
<td>Password</td>
<td><input type="text" name="password" value=<?php echo $password;?>></td>
</tr>
<tr>
<td>Email</td>
<td><input type="text" name="email" value=<?php echo $email;?>></td>
</tr>
<tr>
<td><input type="hidden" name="id" value=<?php echo $_GET['id'];?>></td>
<td><input type="submit" name="update" value="Update"></td>
</tr>
</table>
</form>
</body>
</html>
ini hasil tampilannya dengan css :
- Setelah itu kita buat file dengan nama "delete.php"
<?php
// include database connection file
include_once("config.php");
// Get id from URL to delete that user
$id = $_GET['id'];
// Delete user row from table based on given id
$result = mysqli_query($mysqli, "DELETE FROM users WHERE id=$id");
// After delete redirect to Home, so that latest user list will be displayed.
header("Location:index.php");
?>
- ini file untuk tampilan "style.css"
.table1 {
font-family: sans-serif;
color: #444;
border-collapse: collapse;
width: 50%;
border: 1px solid #f2f5f7;
}
.table1 tr th{
background: #35A9DB;
color: #fff;
font-weight: normal;
}
.table1, th, td {
padding: 8px 20px;
text-align: center;
}
.table1 tr:hover {
background-color: #f5f5f5;
}
.table1 tr:nth-child(even) {
background-color: #f2f2f2;
}
.button {
display: inline-block;
padding: 5px 15px;
font-size: 15px;
cursor: pointer;
text-align: center;
text-decoration: none;
outline: none;
color: #fff;
background-color: #35A9DB;
border: none;
border-radius: 5px;
}
.button:hover {background-color: #35A9DB}
.button:active {
background-color: #35A9DB;
transform: translateY(4px);
}
Sekian yang dapat saya sampaikan. Bagaimana? mudahkan?.....
Terimakasih atas perhatiannya. Mohon maaf jika ada kekurangan, maklum masih newbie hehehe... :)
Bye...
by : riyan meidy prayoga
0 comments: