Contoh "Aplikasi Tamu" Dengan CodeIgniter 3, Mysql, Dan Ajax

          Oke.. Kali Ini Saya Ingin Share Aplikasi Buku Tamu Sederhana Dengan Codeigniter 3 Dan Ajax.. Disini Kita Memakai Mysql... 

       

         Oiya.. Untuk Agan Belum Tau Apa itu CodeIgniter Dan Bagaimana Cara Instalasinya.. Agan Bisa Lihat Di Codeigneter 3 Official Website .. Atau Membaca Pada Tutorial Dibawah Ini...

1. https://tutorialcodeigniter.wordpress.com/tag/cara-install-codeigniter/
2. https://supono.wordpress.com/2013/01/22/cara-install-codeigniter/
3. https://tutorialcodeigniter.wordpress.com/2012/04/15/belajar-codeigniter-cara-penggunaan-dan-instalasi/

Dan Masih banyak lagi Jika kita Search Di Google...

Penjelasan Fungsi Ajax:

pada file Views/home,php,

Untuk Menampilkan Form Tambah Data:
     $("#tambah").click(function(){
        $("#cruddata").hide().load("<?php echo site_url(); ?>/main/tambahdata").fadeIn(1000);
      });

Untuk Mengirim Value Ke Controller:
   $("#cruddata").on("click", "#simpandata", function(){
        var nama = $("#nama").val();
        var email = $("#email").val();
        var pesan = $("#pesan").val();
        var url1 = base_url;
        $.ajax({
          url : '<?php echo site_url(); ?>/main/simpandata',
          type: 'post',
          data: 'nama='+nama+'&email='+email+'&pesan='+pesan,
          url1: '<?php echo site_url(); ?>',
          success : function(msg){
            $("#cruddata").hide().fadeOut(1000);
            $("#data").hide().load("#data").fadeIn(1000);
          }
        });
      });

Untuk Mengambil Data Yang Akan Di Edit:
  $(".edit").click(function(){
        var id = $(this).attr("id");
        $.ajax({
          url : '<?php echo site_url(); ?>/main/updatedata/',
          type : 'post',
          data : 'id='+id,
          success : function(msg){
            $("#cruddata").hide().load("<?php echo site_url(); ?>/main/updatedata/"+id).fadeIn(1000);
         
          }
        });
      });


Untuk Mengirim value Pada Proses Edit:
      $("#cruddata").on("click", "#editdata", function(){
        var id = $("#id").val();
        var nama = $("#nama").val();
        var email = $("#email").val();
        var pesan = $("#pesan").val();
        $.ajax({
          url : '<?php echo site_url(); ?>/main/prosesedit/',
          type: 'post',
          data: 'id='+id+'&nama='+nama+'&email='+email+'&pesan='+pesan,
          success : function(msg){
            $("#cruddata").hide().fadeOut(1000);
            $("#data").load("#data");
          }
        });
      });


Untuk Mengirim Id pada proses Hapus:
      $(".hapus").click(function(){
        var id = $(this).attr("id");
        $.ajax({
          url : '<?php echo site_url(); ?>/main/proseshapus/',
          type: 'post',
          data: 'id='+id,
          success : function(msg){
            $("#cruddata").hide().fadeOut(1000);
            $("#data").load("<?php echo site_url(); ?>/main/proseshapus/"+id);
          }
        });
      });



ok.. langsung Saja Kita Kasih Link Download Source Code nya + Databasenya..

Silahkan Klik Disini

Jika Ada tidak Mengerti.. Kalian Bisa Bertanya Via Facebook.

Terima Kasih.