Cara Membuat CRUD pada php dan MySQLi – Part 3 Mengubah/Update Data – Postingan ini merupakan lanjutan dari 2 postingan sebelumnya. Dan pada postingan ini saya akan membahas tentang update data / edit data. Karena pada postingan sebelumnya akan eror jika klik edit data karena memang belum dibuat file dan fungsinya. Jika sobat belum melihat postingan saya sebelumnya maka bisa kunjungi dengan klik link dibawah
CRUD (Create, Read, Update, Delete) pada PHP dan MySQLi – Part 1 Menampilkan Data
CRUD (Create, Read, Update, Delete) pada PHP dan MySQLi – Part 2 Insert Data
Untuk template saya masih menggunakan bootsrap 4 online karena ini hanya keperluan demo saja. Jika untuk keperluan development maka sobat perlu mendownload bootstrap terlebih dahulu lalu masukkan pada folder project sobat. Itu hanya untuk menyakan dengan tutorial kali ini saja namun jika tidak ya tidak apa-apa karena aplikasi yang akan sobat buat nantinya juga akan jalan hanya saja tampilannya saja yang berbeda. Tanpa basa basi lagi saya akan menjelaskan cara mengubah datanya :
1. Tentunya pertama adalah menambahkan tombol untuk memanggil menu atau form contohnya adalah seperti script dibawah dan pada contoh saya tuliskan pada file index.php didalam tabel
<a href="edit_data.php?aa=<?php echo base64_encode($id) ?>"> <button class="btn btn-success btn-sm"> <i class="fa fa-edit"></i> Edit </button> </a>
Pada script diatas ada base64_encode($id) artinya id di enkripsi/encoding terlebih dahulu jadi nantinya pada url bukan lagi angka id dari data sobat. Jadinya seperti dibawah
http://localhost/dewan-crud/edit_data.php?aa=MQ==
2. Pada contoh terlihat tag <a> memanggil edit_data.php dengan kata lain sobat harus membuat file baru dan beri nama edit_data.php. Kemudian pada file edit_data.php isikan dengan script dibawah ini
<?php
//Menggabungkan dengan file koneksi yang telah kita buat
include 'koneksi.php';
?>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<link rel="icon" href="dk.png">
<title>Edit Data - www.dewankomputer.com</title>
<!-- Untuk Keperluan Demo Saya Menggunakan Library Css Online, Jika sobat menggunakan untuk keperluan developmen/production maka download pada situs resminya -->
<!-- Bootstrap -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.css" rel="stylesheet">
<!-- Font Awesome -->
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">
</head>
<body>
<!-- Image and text -->
<nav class="navbar navbar-dark bg-primary">
<a class="navbar-brand" href="index.php" style="color: #fff;">
Dewan Komputer
</a>
</nav>
<div class="container">
<h2 align="center" style="margin: 30px;">Edit Data</h2>
<?php
// data difilter terlebih dahulu & base64_decode berguna untuk mendeskripsi id yg sebelumnya di enkripsi/encoding
$id = stripslashes(strip_tags(htmlspecialchars(base64_decode($_GET['aa']) ,ENT_QUOTES)));
$query = "SELECT * FROM tbl_mahasiswa WHERE id=?";
$dewan1 = $db1->prepare($query);
$dewan1->bind_param("i", $id);
$dewan1->execute();
$res1 = $dewan1->get_result();
while ($row = $res1->fetch_assoc()) {
$id = $row['id'];
$nama_mahasiswa = $row['nama_mahasiswa'];
$alamat = $row['alamat'];
$jurusan = $row['jurusan'];
$jenis_kelamin = $row['jenis_kelamin'];
$tgl_masuk = $row['tgl_masuk'];
}
?>
<form method="POST" action="edit_data_action.php">
<div class="row">
<div class="col-sm-6 offset-sm-3">
<div class="form-group">
<label>Nama Mahasiswa</label>
<input type="hidden" name="id" id="id" value="<?php echo $id; ?>">
<input type="text" name="nama_mahasiswa" id="nama_mahasiswa" class="form-control" value="<?php echo $nama_mahasiswa; ?>" required="true">
</div>
<div class="form-group">
<label>Jenis Kelamin</label><br>
<input type="radio" name="jenkel" id="jenkel" value="Laki-laki" <?php if ($jenis_kelamin == "Laki-laki"){ echo "checked"; } ?>> Laki-laki
<input type="radio" name="jenkel" id="jenkel" value="Perempuan" <?php if ($jenis_kelamin == "Perempuan"){ echo "checked"; } ?>> Perempuan
</div>
<div class="form-group">
<label>Alamat</label>
<textarea name="alamat" id="alamat" class="form-control" required="true"><?php echo $alamat; ?></textarea>
</div>
<div class="form-group">
<label>Jurusan</label>
<select name="jurusan" id="jurusan" class="form-control" required="true">
<option value=""></option>
<option value="Sistem Informasi" <?php if ($jurusan == "Sistem Informasi"){ echo "selected"; } ?>>Sistem Informasi</option>
<option value="Teknik Informatika" <?php if ($jurusan == "Teknik Informatika"){ echo "selected"; } ?>>Teknik Informatika</option>
</select>
</div>
<div class="form-group">
<label>Tanggal Masuk</label>
<input type="date" name="tanggal_masuk" id="tanggal_masuk" class="form-control" value="<?php echo $tgl_masuk; ?>" required="true">
</div>
<div class="form-group">
<button type="submit" name="simpan" id="simpan" class="btn btn-primary">
<i class="fa fa-save"></i> Simpan
</button>
</div>
</div>
</div>
</form>
</div>
<div class="text-center">© <?php echo date('Y'); ?> Copyright:
<a href="https://dewankomputer.com/"> Dewan Komputer</a>
</div>
</body>
</html>
Penjelasan :
Sekedar memberitahu, jika kita ingin membuat form inputan tentunya kita membutuhkan tag <form></form> dan pada tombol sobat harus menambahkan type=’submit’. Untuk tag form yang biasa digunakan adalah method POST dan GET. Perbedaannya tentunya jika method POST bisa mengirimkan data tanpa terlihat oleh user sedangkan method GET datanya akan terlihat pada url. Oleh karena itu untuk form biasanya menggunakan method POST supaya lebih aman juga. Contoh penggunaannya bisa dilihat pada bagian dibawah
<form method="POST" action="edit_data_action.php"> .... </form>
Diatas terlihat kita menggunakan method POST dan action menuju ke edit_data_action.php itu artinya sobat harus membuat file edit_data_action.php terlebih dahulu. Karena setelah user submit atau klik tombol simpan maka akan menuju ke halaman edit_data_action.php dan disanalah kita akan menuliskan code untuk mengubah data atau sebenarnya sobat bisa mengisikan action kosong atau action=”” dan nantinya dibawah </html> sobat bisa menuliskan code phpnya untuk menyimpan ke database. Untuk codenya sama persis seperti apa yang tertulis pada edit_data_action.php. Ada lagi cara lain yaitu menggunakan Ajax. Bagaimana caranya? itu nanti akan saya bahas pada postingan saya selanjutnya.
Untuk tombolnya sobat bisa gunakan 2 cara yaitu seperti pada contoh
<a href="edit_data.php?aa=<?php echo base64_encode($id) ?>"> <button class="btn btn-success btn-sm"> <i class="fa fa-edit"></i> Edit </button> </a>
Atau menggunakan input type submit seperti dibawah
<input type="submit" name="edit" id="edit" value="Update" class="btn btn-primary">
Namun saya lebih suka dengan cara yang pertama yaitu menggunakan button karena dengan menggunakan itu sobat bisa menyisipkan icon/gambar. dan yang paling penting supaya itu menjadi tombol submit maka perlu ditambahkan type=”submit”.
<input type="text" name="nama_mahasiswa" id="nama_mahasiswa" class="form-control" required="true" value="<?php echo $nama_mahasiswa; ?>">
Pada input text yang paling penting dan akan diambil pada tambah_data-action.php adalah nama dari input text tersebut seperti yang terlihat pada code diatas yang mempunyai nama “nama_mahasiswa” dengan isi $nama_mahasiswa value=”<?php echo $nama_mahasiswa; ?>” di bagian akhir tertulis required=”true” yang berarti inputan tersebut wajib diisi atau bisa juga sobat hanya menuliskan “required”. Namun jika inputan tersebut tidak wajib maka bisa menuliskan required=”false” atau tidak udah menuliskan required. untuk class=”form-control” itu hanya untuk mengubah tampilan seperti yang telah bootstrap tentunkan pada cssnya jadi kita hanya menggunakannya saja.
3. Buat file edit_data_action.php yang berfungsi sebagai file action yang menghubungkan dengan database kemudian memasukkan data ke databasenya. Isikan edit_data_action.php dengan script dibawah ini
<?php
include 'koneksi.php';
if (isset($_POST['simpan'])) {
$id = stripslashes(strip_tags(htmlspecialchars($_POST['id'] ,ENT_QUOTES)));
$nama_mahasiswa = stripslashes(strip_tags(htmlspecialchars($_POST['nama_mahasiswa'] ,ENT_QUOTES)));
$jenkel = stripslashes(strip_tags(htmlspecialchars($_POST['jenkel'] ,ENT_QUOTES)));
$alamat = stripslashes(strip_tags(htmlspecialchars($_POST['alamat'] ,ENT_QUOTES)));
$jurusan = stripslashes(strip_tags(htmlspecialchars($_POST['jurusan'] ,ENT_QUOTES)));
$tanggal_masuk = stripslashes(strip_tags(htmlspecialchars($_POST['tanggal_masuk'] ,ENT_QUOTES)));
$query = "UPDATE tbl_mahasiswa SET nama_mahasiswa=?, alamat=?, jurusan=?, jenis_kelamin=?, tgl_masuk=? WHERE id=?";
$dewan1 = $db1->prepare($query);
$dewan1->bind_param("sssssi", $nama_mahasiswa, $alamat, $jurusan, $jenkel, $tanggal_masuk, $id);
if ($dewan1->execute()) {
echo "<script>alert('Data Berhasil Diubah');location='index.php';</script>";
} else {
echo "<script>alert('Error');window.history.go(-1);</script>";
}
}
$db1->close();
?>
Penjelasan :
$nama_mahasiswa = stripslashes(strip_tags(htmlspecialchars($_POST['nama_mahasiswa'] ,ENT_QUOTES)));
Pada code diatas berfungsi untuk menyaring hasil inputan dari user sebelum di simpan ke dalam database. Code tersebut sangat-sangat perlu karena untuk menghindari sql-injection atau XSS attack. Code tersebut juga bisa dibuat menjadi sebuah fungsi jadi sobat nanti hanya perlu memanggil nama fungsinya saja tanpa perlu menuliskan panjang-panjang seperti itu berkali-kali. Itu akan saya bahas pada postingan saya lainnya tentang cara menghindari sql-injection dan xss attack. Jika pada tutorial lainnya mungkin hanya akan menjadi
$nama_mahasiswa = $_POST[‘nama_mahasiswa’]
dan itu bisa saja memang tidak ada bedanya namun itu akan menjadikan aplikasi sobat rentan akan hack. Dan saya ingin membiasakan sobat mulai dari awal untuk tidak hanya menyimpan data ke database secara mentah-mentah karena nanti bisa terbawa sampai sobat menyesal nantinya. Namun tentunya pada blog ini saya berikan yang mudah terlebih dahulu baru setelah itu akan saya berikan bagian yang susahnya yang tentunya berbeda postingan. Oleh karena itu rajin-rajinlah sobat untuk mencari postingan pada blog ini.
Untuk memasukkan data ke database terdapat 4 langkah yaitu query, prepare statement, bind param kemudian execute seperti contoh dibawah
$query = "UPDATE tbl_mahasiswa SET nama_mahasiswa=?, alamat=?, jurusan=?, jenis_kelamin=?, tgl_masuk=? WHERE id=?";
$dewan1 = $db1->prepare($query);
$dewan1->bind_param("sssssi", $nama_mahasiswa, $alamat, $jurusan, $jenkel, $tanggal_masuk, $id);
dewan1->execute();
Cara dibawah menggunakan metode Object Oriented dimana cara ini merupakan cara yang paling amat jika ingin menyimpan data ke database. Dan sangat direkomendasikan sobat untuk menggunakan cara ini walaupun memang caranya lebih panjang dari sebelumnya. Untuk nilai pada query diisi dengan tanda tanya (?) dan nilainya ada pada bind param. untuk “sssssi” disesuaikan dengan banyaknya kolom yang ingin dimasukkan. Karena pada contoh hanya 6 maka “s” juga ada 6. “s” disini adalah string dan jika nilainya berupa angka/integer maka sobat bisa tuliskan “i” karena pada id itu int dan autoincrement jadi pastinya nailainya berupa angka dan jika diisi dengan huruf maka data tidak akan masuk.
Untuk code $db1->close(); berfungsi untuk menutup koneksi terhadap database. Hal ini juga tentunya sangat diperlukan.
4. Jika sudah selesai maka hasilnya akan terlihat form seperti ini jika sobat klik tombol Edit Data
5. Jika sobat mengisi maka akan muncul alert box dan setelah di klik ok akan kembali pada menu awal yaitu index.php
Sekian postingan kali ini yang membahas tentang memasukkan data ke dalam database. Untuk postingan saya selanjutnya akan membahas tentang Hapus Data dan dengan itu postingan saya tentang CRUD telah selesai dan sobat bisa untuk melangkah ke step yang lebih susah yaitu CRUD menggunakan Ajax No Loading. Jika ada masih bingung maka sobat bisa tuliskan pada kolom komentar dibawah. Untuk menambahkan file upload sobat bisa kunjungi postingan saya yang lainnya karena itu tidak saya bahas pada CRUD ini.
Baca juga :
CRUD (Create, Read, Update, Delete) pada PHP dan MySQLi – Part 1 Menampilkan Data
CRUD (Create, Read, Update, Delete) pada PHP dan MySQLi – Part 2 Insert Data
CRUD (Create, Read, Update, Delete) pada PHP dan MySQLi – Part 3 Update Data
CRUD (Create, Read, Update, Delete) pada PHP dan MySQLi – Part 4 Delete Data
Cara Membuat Upload File pada PHP dengan Mudah
Jika sobat ingin mendownload tutorial diatas maka sobat bisa klik link dibawah ini :
halo kak,
kok saya saat klik edit data error ini ya :
Notice: Undefined index: aa in C:\xampp\htdocs\Crud2\edit_data.php on line 33
Nama Mahasiswa
Notice: Undefined variable: nama_mahasiswa in C:\xampp\htdocs\Crud2\edit_data.php on line 55
Jenis Kelamin
Notice: Undefined variable: jenis_kelamin in C:\xampp\htdocs\Crud2\edit_data.php on line 59
> Laki-laki Notice: Undefined variable: jenis_kelamin in C:\xampp\htdocs\Crud2\edit_data.php on line 60
> Perempuan
Alamat
Notice: Undefined variable: alamat in C:\xampp\htdocs\Crud2\edit_data.php on line 64
Jurusan
knp ya?
itu ngga ada variable aa,
urlnya gmn haruanya edit_data.php?aa=7
pas ambilnya $id=$_GET[‘aa’]
kalo pake base64 ya tinggal ikutin aja sesuai postingan
Fatal error: Uncaught Error: Call to a member function bind_param() on bool in C:\xampp\htdocs\dewan-crud\tambah_data_action.php:19 Stack trace: #0 {main} thrown in C:\xampp\htdocs\dewan-crud\tambah_data_action.php on line 19
nambah 1 inputan lagi gabi sa ka kenapa ya ka
pada kode ini jg jgn lupa ditambah pada ‘sssssi’
$dewan1->bind_param(“sssssi”, $nama_mahasiswa, $alamat, $jurusan, $jenkel, $tanggal_masuk, $id);