Pada artikel tentang Cara Membuat Keranjang Belanja Dengan AngularJs Part4 kita akan membuat hapus item atau hapus produk di  dalam keranjang belanja yang sudah kita buat sebelumnya pada artikel Cara Membuat Keranjang Belanja Dengan AngularJs Part3.
Langkah pertama untuk Cara Membuat Keranjang Belanja Dengan AngularJs Part4 teman-teman perhatikan tombol hapus di dalam table keranjang belanja yang sudah dibuat sebelumnya. Disini saya memberikan ng-click=”hapusItem(cart.produk_id) untuk menghapus item yang berada di dalam keranjang dengan menggunakan fungsi hapusItem() yang didalamnya terdapat satu parameter untuk menyimpan id yang kita klik. Karena data produk yang akan dihapus nanti berdasarkan id yang kita pilih dengan melakukan klik pada tombol hapus.
|
1 |
<button type="button" name="hps_produk" class="btn btn-xs btn-danger" ng-click="hapusItem(cart.produk_id)">Hapus</button> |
Jika sudah sesuai semua kita lanjutkan untuk membuat fungsi hapusItem() di dalam controller dengan method POST untuk mengirim data id ke dalam file hapus_item.php.
|
1 2 3 4 5 6 7 8 9 10 |
//hapus item $scope.hapusItem = function(id){ $http({ method:"POST", url:"hapus_item.php", data:id }).then(function(data){ $scope.krBelanja(); }); }; |
Lalu saya kirim data id ke dalam file hapus_item.php untuk melakukan unset pada session. Dimana unset ini akan menghapus session berdasarkan id yang kita klik. Dan kita buat callback untuk menjalankan fungsi $scope.krBelanja(); agar data selalu update atau berubah ketika ada perubahan data session.
Dan berikut ini isi dari file hapus_item.php
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
<?php session_start(); $produk_data = json_decode(file_get_contents("php://input")); $produk_id = $produk_data; foreach($_SESSION["keranjang_belanja"] as $keys => $values) { if($values["produk_id"] == $produk_id) { unset($_SESSION["keranjang_belanja"][$keys]); } } ?> |
Diatas saya membuat looping data session dimana didalamnya terdapat kondisi untuk mengecek data id yang dikirim sama dengan values dari produk_id yang ada di session keranjang belanja maka akan melakukan unset terhadapt session keranjang belanja berdasarkan keysnya yang di dapat dari $values[“produk_idâ€].
Jika sudah selesai maka teman-teman bisa buka di browser masing-masing. Maka tampilan kejanjang belanja akan seperti pada gambar di bawah ini. Dimana di atasnya adalah tampilan produk dan di bawah adalah list produk yang dipilih.
Demikian artikel tentang Cara Membuat Keranjang Belanja Dengan AngularJs Part4. Semoga dapat bermanfaat dan sampai ketemu lagi di pembahasan berikutnya. Selamat mencoba.