Kita akan melanjutkan tutorial tentang pembahasan CRUD berikutnya. Pada tutorial edisi sebelumnya "PHP CRUD Bootstrap part 1", kita telah membuat database MySQL yang terdiri dari empat atribut/field, yaitu : No, Fname, Lname, Age dan Gender. Serta kita juga telah membuat file index.php dan insert.php. (We will continue the tutorial about the next explanation of CRUD. In the previous tutorial :"PHP CRUD Bootstrap part 1", we have create database MySQL that consist of four attribute / field : No, Fname,Lname, Age and Gender. We also created file index.php and insert.php).
Step-4:
Sekarang kita akan membuat file untuk dapat menampilkan data berdasarkan urutan nomor yang dipilih. File ini kita berinama read.php (Right now, we weill create file to display data based on the sequence number chosen. We named it read.php).
<?php
require 'connection.php';
$No = null;
if(!empty($_GET['No']))
{
$No = $_GET['No'];
}
if($No == null)
{
header("Location: index.php");
}
else
{
// read data
$query = "SELECT * FROM users where No = $No";
$res = mysqli_query($con,$query);
$data=mysqli_fetch_array($res);
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="tutorial-boostrap-merubaha-warna">
<meta name="author" content="ilmu-detil.blogspot.com">
<title>Tutorial Boostrap </title>
<link rel="stylesheet" href="assets/css/bootstrap.min.css">
<script src="assets/js/bootstrap.min.js"></script>
<style type="text/css">
.navbar-default {
background-color: #3b5998;
font-size:18px;
color:#ffffff;
}
</style>
</head>
<body>
<nav class="navbar navbar-default">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<h4>Detailed Technology Center</h4>
</div>
<div class="collapse navbar-collapse" id="myNavbar">
</div>
</div>
</nav>
<!-- /.navbar -->
<div class="container">
<div class="col-sm-12">
<div class="row">
<h3>Read a User</h3>
</div>
<div class="form-group col-sm-12">
<label class="col-sm-2 control-label">First Name</label>
<div class="col-sm-10">
<p class="form-control-status-bar"><?php echo $data['FName'];?></p>
</div>
</div>
<div class="form-group col-sm-12">
<label class="col-sm-2 control-label">Last Name</label>
<div class="col-sm-10">
<p class="form-control-status-bar"><?php echo $data['LName'];?></p>
</div>
</div>
<div class="form-group col-sm-12">
<label class="col-sm-2 control-label">Age</label>
<div class="col-sm-10">
<p class="form-control-status-bar"><?php echo $data['Age'];?></p>
</div>
</div>
<div class="form-group col-sm-12">
<label class="col-sm-2 control-label">Gender</label>
<div class="col-sm-10">
<p class="form-control-status-bar"><?php echo $data['Gender'];?></p>
</div>
</div>
<div class="form-group col-sm-12">
<a class="btn btn btn-default" href="index.php">Back</a>
</div>
</div>
</div>
</body>
</html>
Step-5:
Pada tahap ini kita akan membuat file update.php untuk merubah data yang telah disimpan pada database (On this step, we'll create file update.php to change data that has been stored in the database).
<?php
require 'connection.php';
$No = null;
if(!empty($_GET['No']))
{
$No = $_GET['No'];
}
if($No == null)
{
header("Location: index.php");
}
if ( !empty($_POST))
{
// post values
$fname = $_POST['fname'];
$lname = $_POST['lname'];
$age = $_POST['age'];
$gender = $_POST['gender'];
// Update data
$query = "Update users set Fname='$fname',Lname='$lname',Age='$age',Gender='$gender' where No='$No'";
mysqli_query($con,$query);
header("Location: index.php");
}
else
{
$query = "SELECT * FROM users where No = $No";
$res = mysqli_query($con,$query);
$data=mysqli_fetch_array($res);
$fname = $data['FName'];
$lname = $data['LName'];
$age = $data['Age'];
$gender = $data['Gender'];
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="tutorial-boostrap-merubaha-warna">
<meta name="author" content="ilmu-detil.blogspot.com">
<title>Tutorial Boostrap </title>
<link rel="stylesheet" href="assets/css/bootstrap.min.css">
<style type="text/css">
.navbar-default {
background-color: #3b5998;
font-size:18px;
color:#ffffff;
}
</style>
</head>
<body>
<nav class="navbar navbar-default">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<h4>Detailed Technology Center</h4>
</div>
<div class="collapse navbar-collapse" id="myNavbar">
</div>
</div>
</nav>
<!-- /.navbar -->
<div class="container">
<div class="row">
<div class="row">
<h3>Update a User</h3>
</div>
<form method="POST" action="update.php?No=<?php echo $No;?>">
<div class="col-md-6">
<div class="form-group">
<label for="inputFName">First Name</label>
<input type="text" class="form-control" required="required" id="inputFName" value="<?php echo !empty($fname)?$fname:'';?>" name="fname" placeholder="First Name">
<span class="help-block"></span>
</div>
<div class="form-group">
<label for="inputLName">Last Name</label>
<input type="text" class="form-control" required="required" id="inputLName" value="<?php echo !empty($lname)?$lname:'';?>" name="lname" placeholder="Last Name">
<span class="help-block"></span>
</div>
<div class="form-group">
<label for="inputAge">Age</label>
<input type="number" required="required" class="form-control" id="inputAge" value="<?php echo !empty($age)?$age:'';?>"
name="age" placeholder="Age">
<span class="help-block"></span>
</div>
<div class="form-group">
<label for="inputGender">Gender</label>
<select class="form-control" required="required" id="inputGender" name="gender" >
<option>Please Select</option>
<option value="male" <?php echo $gender == 'Male'?'selected':'';?>>Male</option>
<option value="female" <?php echo $gender == 'Female'?'selected':'';?>>Female</option>
</select>
<span class="help-block"></span>
</div>
<div class="form-actions">
<button type="submit" class="btn btn-primary">Update</button>
<a class="btn btn btn-default" href="index.php">Back</a>
</div>
</form>
</div>
</div> <!-- /row -->
</div> <!-- /container -->
</body>
</html>
Anda dapat mengdownload keseluruhan file dilink bawah ini ( You can downloan all source code on the link below):
Untuk databasenya, anda dapat mengdownload dilink berikut (For database, you can download at the following link):
