by 
CRUD Ajax CodeIgniter membuat aplikasi terasa jauh lebih cepat dan modern, karena data disimpan dan ditampilkan tanpa memuat ulang seluruh halaman. Panduan ini menunjukkan cara menggabungkan jQuery Ajax dengan controller CodeIgniter.
Bagaimana Cara Kerjanya?
Alih-alih submit form biasa yang me-reload halaman, JavaScript mengirim data ke controller di latar belakang. Controller memproses lalu mengembalikan respons dalam format JSON, yang kemudian ditampilkan oleh JavaScript.
Sisi Front-End (jQuery)
$('#form-produk').submit(function(e) {
e.preventDefault(); // cegah reload
$.ajax({
url: '<?= base_url("produk/simpan") ?>',
type: 'POST',
data: $(this).serialize(),
dataType: 'json',
success: function(res) {
if (res.status) {
alert('Data berhasil disimpan');
}
}
});
});
Sisi Controller
Controller memproses data dan mengembalikan JSON dengan json_encode():
<?php
public function simpan() {
$ok = $this->Produk_model->simpan($this->input->post());
echo json_encode(array('status' => $ok));
}
?>
Memperbarui Tampilan Tanpa Reload
Setelah data tersimpan, Anda bisa mengambil ulang daftar data via Ajax dan memperbarui tabel dengan JavaScript, sehingga tampilan selalu terbaru tanpa refresh.
Tetap Utamakan Keamanan
Meski memakai Ajax, validasi di sisi server tetap wajib. Jangan pernah mempercayai data dari klien; selalu validasi dan gunakan query builder.
Kesimpulan
Dengan CRUD Ajax CodeIgniter, pengalaman pengguna menjadi mulus dan responsif. Kuncinya adalah preventDefault() di sisi jQuery dan json_encode() di sisi controller.
Referensi: untuk penjelasan lebih mendalam, kunjungi dokumentasi resmi CodeIgniter.
