CRUD (Create, Read, Update, Delete) Dengan Ajax Tanpa Loading PHP – Part 4 Hapus Data

CRUD (Create, Read, Update, Delete) Dengan Ajax Tanpa Loading PHP – Part 4 Hapus Data – Ini merupakan postingan terakhir pada CRUD ini yaitu tentang cara hapus data tanpa loading menggunakan Ajax. Bagian ini merupakan bagian paling mudah dan paling cepat karena cuman hapus data saja. Jika sobat belum melihat postingan saya sebelumnya maka sobat bisa klik link dibawah

CRUD (Create, Read, Update, Delete) Dengan Ajax Tanpa Loading PHP – Part 1 Menampilkan Data

CRUD (Create, Read, Update, Delete) Dengan Ajax Tanpa Loading PHP – Part 2 Insert Data dan Validasinya

CRUD (Create, Read, Update, Delete) Dengan Ajax Tanpa Loading PHP – Part 3 Update Data

 

Berikut adalah langkah-langkah untuk menambahkan hapus data :

1. Buat tombolnya tentunya untuk memanggil action Hapus Data. Pada part 1 sudah kita buat seperti ini pada data.php di dalam tabel

yang penting dalam kode diatas adalah pada id dan classnya yaitu id=”<?php echo $id; ?>” dan pada class terdapat hapus_data. Kedua code ini nanti akan dipakai pada ajax/javascriptnya.

 

2. Pada tag <script>…</script> di file data.php tambahkan kode dibawah ini

Seperti yang terlihat kode diatas berarti bisa dibaca

“Jika ada attribut/tombol yang mempunyai class seperti hapus_data diklik maka akan menjalankan fungsi mengambil nilai dari id yang mempunyau class hapus_data tersebut untuk kemudian menjalankan fungsi Ajax. Jika Ajax sukses maka yang mempunyai class data (dalam contoh <div class=’data’> pada index.php) akan merefresh apa yang ada pada data.php (dalam contoh ini adalah seluruh tabel dan isinya). ”

Berdasarkan penjelasan diatas berarti kita perlu membuat file hapus_data untuk membuat kode hapus datanya.

 

3. https://dewankomputer.com/2019/01/26/crud-create-read-update-delete-dengan-ajax-tanpa-loading-php-part-4-hapus-data/Buat file hapus_data.php pada project sobat dan ketikkan script dibawah

Pada baris include ‘csrf.php’ merupakan script untuk mengamankan dalam pertukaran data saat menggunakan Ajax. Jika tidak ada header maka siapapun dan dimanapun baik menggunakan local ataupun menggunakan server online dapat menginsert data melalui url pada Ajax. File csrf.php ini kita include-kan ke setiap file yang merupakan file action yang menggunakan Ajax dalam pertukaran datanya. Jika sobat mengalami ERROR pada baris ini berarti sobat perlu kembali ke part 1.

 

Jika sudah selesai semuanya maka tinggal sobat jalankan project sobat pada localhost dan lihat hasilnya.Jika berhasil maka data akan terhapus tanpa loading halaman. Dengan demikian selesai sudah postingan saya tentang CRUD menggunakan Ajax. Untuk selanjutnya mungkin saya akan memposting tentang CRUD juga tapi lebih kompleks lagi karena nanti saya akan memposting tentang CRUD Menggunakan Ajax, Modal, dan SweetAlert dimana nanti formnya kita buat pada modalnya dan nanti akan ada pemberitahuan/peringatan saat akan menghapus data menggunakan sweetalert2. Untuk itu tunggu saja atau bisa sobat cari pada kolom pencarian siapa tahu saya sudah mempostingnya.

Demikian postingan saya tentang CRUD (Create, Read, Update, Delete) Dengan Ajax Tanpa Loading PHP – Part 4 Hapus Data. Jika ada salah kata saya mohon maaf dan apabila ada eror atau ada yang masih kurang bisa sobat beritahukan pada kolom komentar dibawah. Untuk menambahkan file upload dan menyimpannya menggunakan Ajax sobat bisa kunjungi postingan saya yang lainnya karena itu tidak saya bahas pada CRUD ini.

Baca juga :

CRUD (Create, Read, Update, Delete) Dengan Ajax Tanpa Loading PHP – Part 1 Menampilkan Data Ajax

CRUD (Create, Read, Update, Delete) Dengan Ajax Tanpa Loading PHP – Part 2 Insert Data dan Validasinya

CRUD (Create, Read, Update, Delete) Dengan Ajax Tanpa Loading PHP – Part 3 Update Data

CRUD (Create, Read, Update, Delete) Dengan Ajax Tanpa Loading PHP – Part 4 Hapus Data

Cara Mengupload Gambar dengan Ajax dan Menyimpan ke Database PHP

Membuat CRUD Expert, Upload & Pencarian dengan JQuery, Ajax, Bootstrap Modal, SweetAlert dan WYSIHTML5 pada PHP

 

Jika sobat ingin mendownload tutorial diatas maka sobat bisa klik link dibawah ini :
Demo