Tutorial Codeigniter: Penggunaan AJAX dengan JQuery Pada PHP

Di Tulis Oleh : Ivan Silalahi 5 comments


Pada kali ini saya akan berbagi bagai mana cara penggunaan ajax pada framework codeigniter, dan pada tutorial kali ini, saya mengasumsikan bahwa anda sudah mengetahui codeigniter, atau yang belum anda bisa belajar dulu dari posting2 saya sebelumnya. Oke tanpa banyak basa-basi,, langsung saja ya bro ,, ke TKP ...!!!! Pada kasus ini kita akan membuat program insert kedalam database dengan menggunakan ajax dan codeigniter.
Pada input.php tambahkan script javascript yang berisi fungsi AJax menggunakan JQuery, jangan lupa pada head juga ditambahkan fungsi untuk memanggil JQuerynya. Sehingga input.php akan tampak seperti berikut :

<!DOCTYPE HTML> <html lang="en-US"> <head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<meta charset="UTF-8">
</head>
<body>
<h2 >Daily Notes</h2>
<div id="form_input">
... //kode sebelumnya
</div>
<div id="show">
<?php $this->load->view('daily/show') ?>
</div>
<script type="text/javascript">
$('#submit').click(function(){
var form_data = {
date: $('#date').val(),
name: $('#name').val(),
amount: $('#amount').val(),
ajax:1
};
$.ajax({
url : "<?php echo site_url('daily/submit')?>",
type : 'POST',
data : form_data,
success: function(msg){
$('#show').html(msg),
$('#date').val('<?php echo date('Y-m-d'); ?>'),
$('#name').val(''),
$('#amount').val('')
}
});
return false;
});
</script>
</body>
</html>

Sedangkan pada controller daily.php pada fungsi submit di ubah menjadi seperti berikut :


function submit()
{
if ($this->input->post('ajax'))
{
$this->MDaily->save();
$data['query'] = $this->MDaily->getAll();
$this->load->view('daily/show',$data);
}else{
if ($this->input->post('submit'))
{
$this->MDaily->save();
}
redirect('daily/index');
}
}

Sekarang coba untuk input data,selamat mencoba
Catatan, pada kasus ini kita memanggil jquery langsung dari web-nya, sehingga agar dapat di jalankan secara offline, atau localhost download dulu jquerynya, kemudian arahkan ke jquery tersebut, sebagai contoh file jquery saya letakkan di direktori /javascript/jquery-1.3.2.js, maka baris ke lima di ubah menjadi

<script type="text/javascript" src="<?php echo base_url(); ?>javascript/jquery-1.3.2.js"></script>




Tutorial terkait dengan Tutorial Codeigniter: Penggunaan AJAX dengan JQuery Pada PHP :

Terimakasih Atas Kunjungan Sahabat Setia Belajar Pintar PHP
Judul Pelajaran PHP : Tutorial Codeigniter: Penggunaan AJAX dengan JQuery Pada PHP
Ditulis oleh Ivan Silalahi
Rating postingan ini 5 dari 5
Semoga artikel ini bermanfaat bagi saudara. Jika ingin mengutip, baik itu sebagian atau keseluruhan dari isi artikel ini harap menyertakan link dofollow ke http://planetsphp.blogspot.com/2012/11/tutorial-codeigniter-penggunaan-ajax.html. Terima kasih sudah singgah membaca artikel ini. Jangan lupa like dan sharenya serta komentarnya
5 comments:
Ary EJFA said... Balas
This comment has been removed by the author.
Ary EJFA said... Balas

Nice share yah, sangat bermanfaat Rental Mobil Palembang Jasa Website Palembang Tutorial Programming Indonesia

Anonymous said... Balas

GAZEBO

Dian Avent said... Balas

Nice info artikelnya mitsubishi palembang
avent philips indonesia
lowongan kerja palembang

Mochamad Eka Ramadan said... Balas

makasih tutorialnya min

www.smartkiosku.com

Post a Comment

Template by Tutorial Website - Belajar Pintar PHP. Design by Ivan Silalahi | Copyright of Belajar Pintar PHP.