Rabu, 22 Maret 2017

Membuat CRUD Sederhana Dengan PHP Dan MySQL - Edit Data Pada Database

  4 komentar

SERI CRUD - Pada tutorial PHP seri CRUD kita telah membahas bagaimana cara menampilkan data pada database dan menambah data pada database . Pada tutorial part 3 ini kita akan mempelajari bagaimana cara edit data pada database. untuk edit data ini lebih susah daripada menambah dan menampilkan data.

Logika dari edit adalah dengan cara membuat hyperlink dan hyperlink itu redirect ke halaman edit. Di url halaman edit itu ditambahkan id dari data tersebut. Lalu kita tampilkan data yang akan di edit tersebut dimasukkan pada value berdasarkan url menggunakan $_GET. Pasti bingung ? oke santai saja akan saya jelaskan sedetail mungkin. Simak tutorial berikut ini.

MEMBUAT CRUD EDIT DATA
Coba sobat perhatikan pada file index.php terdapat link untuk mengarahkan ke file edit.php sekaligus mengirimkan id data yang mau diedit
<a href="edit.php?id=<?php echo $data[id] ?>">Edit</a>
Dapat sobat lihat pada syntax di atas. hyperlink tersebut mengarahkan ke file edit.php. File edit.php ini kita isi dengan form yang memiliki value sesuai dengan data berdasarkan id data yang ingin kita edit.

<!DOCTYPE html>
<html>
<head>
    <title>Membuat CRUD Sederhana</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>

<div class="title">
    <h1>Membuat CRUD Sederhana</h1>
    <h3>www.script-kiddies.org</h3>
</div>
<br>
<center>
<a href="index.php" class="btn-tambah">Lihat Semua Data</a><br><br>
<?php 
include"koneksi.php";
$query = mysqli_query($koneksi,"SELECT * FROM siswa WHERE id = $_GET[id]");
while ($data = mysqli_fetch_array($query)) {
?>
<form method="POST" action="a_edit.php">
    <table style="width: 20%;">
        <tr>
            <td>Nama </td>
            <td><input type="text" name="nama" value="<?php echo $data['nama']?>"></td>
        </tr>
        <tr>
            <td>Alamat </td>
            <td><input type="text" name="alamat" value="<?php echo $data['alamat']?>"></td>
        </tr>
        <tr>
            <td>Kelas </td>
            <td><input type="text" name="kelas" value="<?php echo $data['kelas']?>"></td>
        </tr>
        <tr>
            <td></td>
            <td><input type="submit" name="submit" value="Submit"></td>
        </tr>
    </table>
</form>
<?php } ?>
</center>
</body>
</html>

Coba salah satu hyerplink Edit kamu klik maka akan muncul seperti ini


Coba perhatikan pada syntax berikut akan saya jelaskan kegunaan dari masing - masing syntax tersebut
include"koneksi.php";
$query = mysqli_query($koneksi,"SELECT * FROM siswa WHERE id = $_GET[id]");
while ($data = mysqli_fetch_array($query)) {
Pertama kita include kan file koneksi.php agar file dapat terhubung dengan database.
include"koneksi.php";
Kemudian kita tangkap data id yang dikirimkan melalui URL
$id = $_GET['id'];
Dan kemudian kita tampilkan data tersebut berdasarkan id yang ditangkap
$query = mysqli_query($koneksi,"SELECT * FROM siswa WHERE id = $id");
Perhatikan pada fungsi mysqli_query tersebut. Seperti yang sudah saya jelaskan fungsi mysqli_query berfungsi untuk menjalankan query / perintah MySQL. Jadi saya menampilkan data berdasarkan siswa yang ber id sesuai dengan url yang dikirimkan tadi. di URL terdapat ?id=1 . Jadi angka siswa yang ber ID 1 itu yang ditampilkan. Jadi jika di terjemahkan syntax tersebut seperti ini SELECT * FROM siswa WHERE id = 1 . Siswa yang ber id adalah Yogi.
<form method="POST" action="a_edit.php">
    <table style="width: 20%;">
        <tr>
            <td>Nama </td>
            <input type="hidden" name="id" value="<?php echo $data['id']?>">
            <td><input type="text" name="nama" value="<?php echo $data['nama']?>"></td>
        </tr>
        <tr>
            <td>Alamat </td>
            <td><input type="text" name="alamat" value="<?php echo $data['alamat']?>"></td>
        </tr>
        <tr>
            <td>Kelas </td>
            <td><input type="text" name="kelas" value="<?php echo $data['kelas']?>"></td>
        </tr>
        <tr>
            <td></td>
            <td><input type="submit" name="submit" value="Submit"></td>
        </tr>
    </table>
</form>
Action dari edit tersebut saya arahkan ke file a_edit.php dan memiliki method POST. Kita juga mengirimkan data id yang sedang di edit ini. agar nanti di file update.php jadi ketauan data yang ber id mana yg akan di ubah. Karena input tersebut tidaklah terlalu penting ditampilkan jadi type dari input tersebut saya beri hidden agar dia tidak ditampilkan pada web browser.
<input type="hidden" name="id" value="<?php echo $data['id']?>">
Karena proses form tersebut kita arahkan pada file a_edit.php jadi buatlah file bernama a_edit.php yang berisi query untuk update.

<?php 
include"koneksi.php";
$id = $_POST['id'];
$nama = $_POST['nama'];
$alamat = $_POST['alamat'];
$kelas = $_POST['kelas'];

mysqli_query($koneksi,"UPDATE siswa SET nama = '$nama', alamat = '$alamat', kelas = '$kelas' WHERE id = $id");
header("location: index.php?pesan=edit");
?>

Hampir sama dengan proses input yaitu kita menangkap hasil inputan sesuai dengan nama input pada form edit tadi

$id = $_POST['id'];
$nama = $_POST['nama'];
$alamat = $_POST['alamat'];
$kelas = $_POST['kelas'];

Perbedaan dari input dan update terletak pada parameter mysqli_query, dimana untuk mengedit data kita menggunakan query UPDATE SET ~
mysqli_query($koneksi,"UPDATE siswa SET nama = '$nama', alamat = '$alamat', kelas = '$kelas' WHERE id = $id");
Terakhir setelah proses edit selesai halaman akan redirect ke index.php?pesan=edit
header("location: index.php?pesan=edit");
Jadi keseluruhan dari syntax tersebut seperti ini

edit.php
<!DOCTYPE html>
<html>
<head>
    <title>Membuat CRUD Sederhana</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>

<div class="title">
    <h1>Membuat CRUD Sederhana</h1>
    <h3>www.script-kiddies.org</h3>
</div>
<br>
<center>
<a href="index.php" class="btn-tambah">Lihat Semua Data</a><br><br>
<?php 
include"koneksi.php";
$id = $_GET['id'];
$query = mysqli_query($koneksi,"SELECT * FROM siswa WHERE id = $id");
while ($data = mysqli_fetch_array($query)) {
?>
<form method="POST" action="a_edit.php">
    <table style="width: 20%;">
        <tr>
            <td>Nama </td>
            <input type="hidden" name="id" value="<?php echo $data['id']?>">
            <td><input type="text" name="nama" value="<?php echo $data['nama']?>"></td>
        </tr>
        <tr>
            <td>Alamat </td>
            <td><input type="text" name="alamat" value="<?php echo $data['alamat']?>"></td>
        </tr>
        <tr>
            <td>Kelas </td>
            <td><input type="text" name="kelas" value="<?php echo $data['kelas']?>"></td>
        </tr>
        <tr>
            <td></td>
            <td><input type="submit" name="submit" value="Submit"></td>
        </tr>
    </table>
</form>
<?php } ?>
</center>
</body>
</html>

a_edit.php
<?php 
include"koneksi.php";
$id = $_POST['id'];
$nama = $_POST['nama'];
$alamat = $_POST['alamat'];
$kelas = $_POST['kelas'];

mysqli_query($koneksi,"UPDATE siswa SET nama = '$nama', alamat = '$alamat', kelas = '$kelas' WHERE id = $id");
header("location: index.php?pesan=edit");
?>

Sekarang kita coba merubah data dan klik simpan


Saya mencoba merubah nama Yogi menjadi Yogi pras dan alhasil seperti ini


KESIMPULAN
Dapat dilihat pada gambar di atas, nama Yogi berubah menjadi Yogi Pras dan muncul kata "Data Berhasil Diedit", jadi kita sudah menguasai teknik CRUD pada bagian update. Setelah kita berhasil menampilkan,menambah,dan mengedit waktunya kita menginjak seri CRUD terakhir yaitu hapus data. Oke jika ada yang ditanyakan silahkan ditanyakan, Sekian Terima Kasih

4 komentar :

  1. Warning: mysqli_fetch_array() expects parameter 1 to be mysqli_result, boolean given in C:\xampp\htdocs\naufal\edit.php on line 20

    itu kenapa masalahnya dimana, min?

    BalasHapus
    Balasan
    1. Ada masalah dalam querynya mas..

      Hapus
    2. Komentar ini telah dihapus oleh pengarang.

      Hapus
    3. Komentar ini telah dihapus oleh pengarang.

      Hapus