Codeigniter Dasar – Menghapus data dengan Jquery
Untuk menghapus data menggunakan Ajax dengan Jquery, sebenarnya tidk terlalu sulit. Dengan menggunakan data yang terdahulu pernah kita buat. Kita mempunyai 2 view yaitu show.php dan input.php. Ubah show.php untuk meletakkan fungsi Jquery yang digunakan untuk mengirim data secara Ajax dan memanggil Controller untuk menghapus data. Kemudian Jquery akan menghilangkan baris dengan triger class pada barisnya dengan fungsi animate. Ah terlalu bertele-tele hahahaha bikin ribet, padahal dalam codingnya tidak terlalu banyak perubahan.
Tambahkan script berikut pada view show.php pada aplikasi ci_ku yang kita buat sebelumnya 
, sehingga show.php akan menjadi seperti berikut :
<script type="text/javascript">
$(document).ready(function() {
$(".delbutton").click(function(){
//Save the link in a variable called element
var element = $(this);
//Find the id of the link that was clicked
var del_id = element.attr("id");
//Built a url to send
var info = 'id=' + del_id;
if(confirm("Anda yakin akan menghapus?"))
{
$.ajax({
type: "POST",
url : "<?php echo site_url('daily/delete')?>",
data: info,
success: function(){
}
});
$(this).parents(".record").animate({ opacity: "hide" }, "slow");
}
return false;
});
})
</script>
<b>Daily Notes</b>
<table border="1">
<tr>
<th>No</th>
<th>Date</th>
<th>Name</th>
<th>Amount</th>
<th>Delete</th>
</tr>
<?
$i=0;
foreach ($query as $row){
$i++;
echo "<tr class=\"record\">";
echo "<td>$i</td>";
echo "<td>$row->date</td>";
echo "<td>$row->name</td>";
echo "<td>$row->amount</td>";
echo "<td><a class=\"delbutton\" id=\"$row->id\" href=\"#\" >Delete</a></td>";
echo "</tr>";
}
?>
</table>
Perhatikan pada baris ke 53 yaitu pada bagian menampilkan link delete, tampak seperti di atas
echo "<td><a class=\"delbutton\" id=\"$row->id\" href=\"#\" >Delete</a></td>";
Script javascript di ataslah (baris 133) yang digunakan Jquery untuk mengirimkan data ke controller daily dan menjalankan fungsi delete. Kemudian ubah link delete (baris 53), tambahkan id sebagai data yang akan dihapus dan class delbutton sebagai triger pada Jquery untuk menjalankan fungsi hapus ini.
Jangan lupa ubah controller daily pada fungsi delete menjadi seperti dibawah ini :
function delete()
{
$id = $this->input->post('id');
$this->db->delete('daily', array('id' => $id));
}
Selesai.. Saya ingin membuat halaman demonya, tetapi belum sempat. Kalo mau download source lengkapnya silahkan ambil di sini
saya sudah coba tutorial di ats,, tapi begitu saya jalankan di browser dan stelah klik delete dan muncul peringatan “Anda yakin akan menghapus ?” kq ga terefresh ya,,, jadi harus di refres dulu baru hilang datax,,
harusnya memang tidak refresh, karena dilakukan dengan ajax jquery. kalo baris terakhir tidak hilang, kemungkinan ada error di bagian javascript anda
mas, kok g iso di donlot tho….?
keren gan..
maff file nya sudah saya ganti
coba cari di github saya 
sama-sama… thx koreksinya
mas dudu boleh minta source buat tutor yg ini…
trims,,,,
Wah saya sudah ga punya file nya.. silahkan dicoba dulu, kalo ada masalah bisa ditanyakan
dah d coba mas..
tapi ko ga jalan ea.. delete nya…
knp ea mas…
Artikel ini adalah berkelanjutan dari artikel sebelumnya, kalo tidak mengikuti artikel sebelumnya, kemungkinan error akan terjadi.
Cek, apakah path jquery sudah benar?
Cek, apakah script untuk jquery sudah benar?
om dudu klo codeigniter bisa pake CSS gk ??
klo bsa gmn caranya bkinn tutorialnya om ,…
heu ^_^
bisa donk, css biasanya di kasih di folder rootnya, nanti di panggil di view
kang maw ganti tampilan backgroung nya gimana kang
ya di edit di view nya
ataw pake css
syuper sekali om .. eh om mau nanya nih
$(this).parents(".record").animate({ opacity: "hide" }, "slow");makusnya gimana ? mohon pencerahan … tetang success ajax jquerynya .. tanks gan ..
sakjannya itu buat ngilangin baris yang dihapus, jadi itu efek pas di klik nanti barisnya hilang, terus mengerjakan delete record, gitu kira-kira
mas kok gk bisa download filenya ??
ya, sudah saya hapus.. Maaf
Bos, gua dah coba… tapi ada yang salah nih… $(“.delbutton”) is null. jadi gua ga bisa pake… bisa minta sedikit pencerahan….
coba di cek bagian
echo “id\” href=\”#\” >Delete“;
[/echo]
harusnya ada class=”dellbutton”
wah Mas thanks ya tutorialnya..
sangat bermanfaat…khususnya saya pemula…
oh ya saya pengen tahu nih mas…kalau
[PHP](this).parents(“.record”).animate({ opacity: “hide” }, “slow”);[/PHP]
kan buat effect jquery buat delete..
nah effek jquery untuk input data /nambah record mas itu gimana kodingnya?
biar efeknya seperti effect delete punya mas…
untuk animate bisa dibaca-baca di sini http://api.jquery.com/animate/