About Me

gambar koala

Panduan membuat Live CRUD dengan Codeigniter dan Ajax



Jumpa lagi dengan artikel tutorial hari ini.

Hari ini saya akan membagikan tutorial dengan framework codeigniter cara membuat model live CRUD (create,read,update,delete) didalam table.

Kata live disini maksudnya adalah, saat kita melakukan penambahan atau perubahan data pada table atau didalam sel table,hanya dengan menekan tombol 'Enter' maka semua data yang kita tambahkan/ubah akan langsung dikirim dan diupdate ke database tanpa perlu mereload halaman. Semua request akan dilakukan dengan Ajax.



Pada proses delete, akan muncul dialog konfirmasi untuk memastikan agar tidak mengalami penghapusan data secara tidak sengaja. Dialog konfirmasi ini menggunakan plugin sweetalert



Dalam tutorial kali ini kita akan memerlukan beberapa komponen komponen. Yaitu: bootstap,codeigniter,jquery dan sweetalert.


Saya sudah menyediakan contoh yang sudah jadi,sudah lengkap beserta semua komponen yang saya sebutkan diatas.
Silahkan kamu download lalu jalankan ke localhost kamu.


File yang barusan kamu download adalah sudah merupakan final project. Silahkan kamu import database yang sudah ada disitu, jalankan project kamu di localhost dan silahkan dipelajari sendiri.

Nah berikut ini adalah tutorial project tersebut dari awal sampai selesai. Silahkan diikuti.
Untuk komponen dan assets yang akan diperlukan, silahkan copy dan gunakan komponen/assets dari final project yang barusan kamu download.

Mari kita mulai...

Pesiapan


Masuklah ke localhost kamu dan buat sebuah database baru bernama crud

Masuk pada database tersebut, lalu Import file crud.sql.
Jika berhasil import, maka database crud sudah memiliki table member dan telah berisi data.



Selanjutnya buat folder project baru pada localhost kamu yang bernama "crud" lalu masukan file file framework codeigniter didalamnya.



atur databasenya di application/config/database.php
nama databasenya gunakan crud



buka application/config/config.php
lalu atur base url menjadi
http://localhost/crud/

Buat controller baru didalam folder application/controllers/ dengan nama Crud.php

Buat model baru didalam folder application/models/ dengan nama Crud_model.php

Buat view baru didalam folder application/views/ dengan nama crud_view.php

buat folder assets lalu taru semua file file bootstrap,sweetalert dan jquery didalam folder tersebut.
Hasilnya seperti ini



Coding


Buka file controler bernama Crud.php
Lalu masukan code berikut ini




class Crud extends CI_Controller
{

function __construct(){
parent::__construct();
$this->load->model('crud_model');
$this->load->helper('url');
$this->load->database();
}


function index(){

$data["people"]=$this->crud_model->read();
$this->load->view("crud_view",$data);

}

function create(){

}

function update(){

}

function delete(){

}

}


Lalu buka juga file model bernama Crud_model.php
Lalu masukan code berikut ini




class Crud_model extends CI_Model
{

function __construct(){
parent::__construct(); 
}

function create(){

}


function read(){
$this->db->order_by("id","desc");
$query=$this->db->get("member");
return $query->result_array();
}


function update($id,$value,$modul){

}

function delete($id){

}


}


Sekaran buka file view bernama crud_view.php
Lalu masukan code berikut ini



<html>
<head>
<title>Live CRUD</title>


"> ">

Posting Komentar

0 Komentar