Cara Membuat CRUD pada php dan MySQLi – Part 2 Menambahkan/Memasukkan data ke dalam database MySQL – Seperti yang telah tertulis pada judulnya, pada postingan ini akan melanjutkan part 1 tentang CRUD dan postingan ini hanya membahas tentang insert data dan pastinya nanti akan ada part 3. Untuk tampilan saya masih sama seperti part 1 yaitu menggunakan bostrap, jquery, dan datatables yang semuanya online karena untuk keperluan demo. Jika sobat belum melihat postingan saya sebelumnya maka sobat bisa kunjungi link dibawah
CRUD (Create, Read, Update, Delete) pada PHP dan MySQLi – Part 1 Menampilkan Data
Tanpa basa basi lagi saya akan menjelaskan cara menambahkan datanya :
1. Tentunya pertama adalah menambahkan tombol untuk memanggil menu atau form isian contohnya adalah seperti script dibawah dan pada contoh saya tuliskan pada file index.php pada bagian atas
<a href="tambah_data.php"> <button style="margin-bottom: 20px;" class="btn btn-primary"> <i class="fa fa-plus"></i> Tambah Data </button> </a>
2. Pada contoh terlihat tag <a> memanggil tambah_data.php dengan kata lain sobat harus membuat file baru dan beri nama tambah_data.php. Kemudian pada file tambah_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>Crud PHP & MySQLi Tambah 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;">Tambah Data</h2>
<form method="POST" action="tambah_data_action.php">
<div class="row">
<div class="col-sm-6 offset-sm-3">
<div class="form-group">
<label>Nama Mahasiswa</label>
<input type="text" name="nama_mahasiswa" id="nama_mahasiswa" class="form-control" required="true">
</div>
<div class="form-group">
<label>Jenis Kelamin</label><br>
<input type="radio" name="jenkel" id="jenkel" value="Laki-laki" required="true"> Laki-laki
<input type="radio" name="jenkel" id="jenkel" value="Perempuan"> Perempuan
</div>
<div class="form-group">
<label>Alamat</label>
<textarea name="alamat" id="alamat" class="form-control" required="true"></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">Sistem Informasi</option>
<option value="Teknik Informatika">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" 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>
<!-- JQuery -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
</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="tambah_data_action.php"> .... </form>
Diatas terlihat kita menggunakan method POST dan action menuju ke tambah_data_action.php itu artinya sobat harus membuat file tambah_data_action.php terlebih dahulu. Karena setelah user submit atau klik tombol simpan maka akan menuju ke halaman tambah_data_action.php dan disanalah kita akan menuliskan code untuk menyimpan data ke database 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 tambah_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
<button type="submit" name="simpan" id="simpan" class="btn btn-primary"> <i class="fa fa-save"></i> Simpan </button>
Atau menggunakan input type submit seperti dibawah
<input type="submit" name="simpan" id="simpan" value="Simpan" 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">
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“. 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 tambah_data_action.php yang berfungsi sebagai file action yang menghubungkan dengan database kemudian memasukkan data ke databasenya. Isikan tambah_data_action.php dengan script dibawah ini
<?php
include 'koneksi.php';
if (isset($_POST['simpan'])) {
$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 = "INSERT into tbl_mahasiswa (nama_mahasiswa, alamat, jurusan, jenis_kelamin, tgl_masuk) VALUES (?, ?, ?, ?, ?)";
$dewan1 = $db1->prepare($query);
$dewan1->bind_param("sssss", $nama_mahasiswa, $alamat, $jurusan, $jenkel, $tanggal_masuk);
if ($dewan1->execute()) {
echo "<script>alert('Data Berhasil Disimpan');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 = "INSERT into tbl_mahasiswa (nama_mahasiswa, alamat, jurusan, jenis_kelamin, tgl_masuk) VALUES (?, ?, ?, ?, ?)";
$dewan1 = $db1->prepare($query);
$dewan1->bind_param("sssss", $nama_mahasiswa, $alamat, $jurusan, $jenkel, $tanggal_masuk);
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 “sssss” disesuaikan dengan banyaknya kolom yang ingin dimasukkan. Karena pada contoh hanya 5 maka “s” juga ada 5. “s” disini adalah string dan jika nilainya berupa angka/integer maka sobat bisa tuliskan “i”.
Untuk code $db1->close(); berfungsi untuk menutup koneksi terhadap database. Hal ini juga tentunya sangat diperlukan.
Jika sobat ingin mengkoneksikan dua atau lebih database dalam satu aplikasi maka sobat bisa mengunjungi
4. Jika sudah selesai maka hasilnya akan terlihat form seperti ini jika sobat klik tombol Tambah 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 Edit Data. 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 :
sekarang pada pake mysqli ya kak, gimana yang masih pada pakai mysql?
mau ngga mau ya harus diubah mas soalnya mysql kan udah lama deprecated jadi harusnya kalo aplikasi baru buatnya pakai mysqli/pdo bukan mysql lagi..
berdasarkan pengalaman saya, saya ubah semua querynya yg masih menggunakan mysql walaupun aplikasinya adalah aplikasi yg sudah jadi 100%