Membangun Aplikasi SMS dengan Gammu dan PHP Framework CodeIgniter

15,750 views

Published on

Published in: Technology
4 Comments
19 Likes
Statistics
Notes
No Downloads
Views
Total views
15,750
On SlideShare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
2,875
Comments
4
Likes
19
Embeds 0
No embeds

No notes for slide

Membangun Aplikasi SMS dengan Gammu dan PHP Framework CodeIgniter

  1. 1. Framework CI (codeigniter)o Pengertian FrameworkFramework adalah sekumpulan perintah atau fungsi dasar yang dapat membantu dalammenyelesaikan proses-proses yang lebih kompleks. Secara sederhana dapat diibaratkansebagai kumpulan fungsi (libraries),maka seorang programmer tidak perlu lagi membuatfungsi-fungsi (kumpulan libraries) dari awal, programmer tinggal memanggil kumpulanlibrary atau fungsi yang sudah ada didalam framework tersebut. Ibarat membangun rumahmaka anda tidak perlu membuat semen, memotong kayu menjadi papan, mengubah batumenjadi porselen dan lain-lain. Anda cukup memilih komponen-komponen yang diperlukansehingga dapat dikombinasikan dan dapat menjadi rumah yang indah. Dan perlu diingat,framework bukanlah peralatan/tools untuk memecahkan sebuah masalah, tetapi sebagaialat bantu. Framework hanya menjadi sebuah konstruksi dasar yang menopang sebuahkonsep atau sistem yang bersifat “essential support” atau penting tapi bukan komponenutama.Beberapa keuntungan jika kita menggunakan framework: 1. Menghemat waktu pengembangan, dengan struktur dan library yang telah disediakan oleh framework maka tidak perlu untuk memikirkan hal tersebut, jadi langsung fokus ke proses inti yang sedang dikerjakan. 2. Reuse of code, dengan menggunakan framework maka pekerjaan kita akan memiliki struktur yang baku, sehingga kita dapat menggunakanya kembali di proyek-proyek lainya. 3. Bantuan Komunitas, intinya ada komunitas framework yang siap untuk membantu. Banyak sekali referensi forum untuk beberapa framework. contoh: forum.framework.web.id. 4. Kumpulan best Practice, sebuah framework merupakan kumpulan best practice yang sudah teruji. Jadi dapat meningkatkan kualitas kode kita.Saat ini telah banyak framework yang berbasis PHP, diantaranya Codeigniter, ZendFramework, Cake PHP dan lain-lain. Namun menurut berbagai sumber Codeigniter adalahsalah satu framework yang memiliki banyak keunggulan dibanding yang lainya. Sampaipembuat php Rasmus Ledorf mengatakan dia menyukai codeigniter karena lebih ringan dancepat dibandingkan framework lainya (“Because it is faster, lighter and least like aframework”). Codeigniter termasuk framework yang mudah untuk dipelajari karenakesederhanaan strukturnya dan kelengkapan dokumentasinya yang baik. Selain itu,kerapian kode dan ukuranya yang ramping membuatnya lebih cepat diakses dibandingkandengan yang lainya.Secara umum framework menggunakan struktur MVC (Model View Controller),tujuandengan menggunakan MVC ini, struktur kode yang dihasilkan menjadi lebih terstruktur danmemiliki standar yang jelas. Intinya MVC itu memisahkan bisnis logic(alur piker), data logic(penyimpanan data) dan presentation logic (antarmuka aplikasi) atau dengan kata yangsederhana adalah memisahkan antara desain, data, dan proses. Komponen-komponen MVCantara lain: 1. Model Model mencangkup semua proses yang terkait dengan pemanggilan struktur databaik berupa pemanggilan fungsi, input processing atau mencetak output kedalam browser. 2012| Parade Pelatihan CNC 2
  2. 2. Jadi model berhubungan dengan perintah-perintah query sql untuk managemen kedatabase sehingga dapat ditampilkan kehalaman browser. 2. Controller Controller mencakup semua proses yang terkait dengan pemanggilan database(sebenarnya kerja dari model) dan kapsulasi proses-proses utama. Jadi bisa diibaratkanbahwa controller mempunyai peranan penting untuk dapat mengontroll view dan model.atau dapat dikatakan bahwa controller adalah penghubung antara data dan view. 3. View View mencakup semua proses yang terkait dengan layout atau tampilan output keend user. Bisa dibilang view merupakan tempat menaruh template interface website.Didalam view hanya berisi variabel-variabel yang berisi data yang siap ditampilkan. Viewdapat dikatakan sebagai halaman website yang dibuat dengan menggunakan HTML danbantuan CSS atau javaScript. Didalam view jangan pernah ada kode untuk melakukankoneksi ke basisdata. View hanya dikhususkan untuk menampilkan data-data hasil darimodel dan controller.Jika digambarkan kedalam bentuk bagan. Bagan dari MVC standar sendiri seperti dibawahini: Client Controller Model View Gambar : konsep MCVJadi hubungan antara ketiganya yaitu. Ketika browser berinteraksi melalui controller, jikabrowser menginginkan untuk data maka controller akan meminta ke bagian model. Tetapijika ingin meminta template /user interface maka controller meminta ke view. Jadi kerjacontroller bisa dikatakan sebagai otak dari aplikasi.o Codeigniter Codeigniter merupakan framework PHP yang diklaim menjadi salah satu framework tercepat disbanding lainya. Codeigniter bersifat opensource (gratis) dan menggunakan model metode MVC (Model View Controller),yang merupakan model konsep modern framework dengan OOP (object oriented programming) yang banyak digunakan saat ini. Codeigniter dibuat pertamakali oleh Rick Ellis yang merupakan CEO dari Ellislab. Dapat dikunjungi pada situsnya di http://www.ellislab.com. Ellislabmerupakan sebuah perusahaan yang memproduksi CMS-CMS handal. Saat ini, framework codeigniter dikembangkan oleh ExpressionEngine Development Team. Dan sekarang codeigniter telah mencapai versi 2.1.0. 2012| Parade Pelatihan CNC 3
  3. 3. Melihat Arsip Codeigniter: CodeIgniter V 2.0.3  CodeIgniter V 1.5.4 CodeIgniter V 2.0.2  CodeIgniter V 1.5.3 CodeIgniter V 2.0.1  CodeIgniter V 1.5.2 CodeIgniter V 2.0.0  CodeIgniter V 1.5.1 CodeIgniter V 1.7.3  CodeIgniter V 1.4.1 CodeIgniter V 1.7.2  CodeIgniter V 1.3.3 CodeIgniter V 1.7.1  CodeIgniter V 1.3.2 CodeIgniter V 1.7.0  CodeIgniter V 1.3.1 CodeIgniter V 1.6.3  CodeIgniter V 1.3 CodeIgniter V 1.6.2  CodeIgniter V 1.2 CodeIgniter V 1.6.1  CodeIgniter V 1.1 CodeIgniter V 1.6.0  CodeIgniter V 1.0Perbedaan yang banyak dirasakan pengguna terhadap versi dan pengembangancodeigniter terasa sekali ketika berada di antara codeigniter versi 1 dengan versi 2.Yaitu pada script awal penulisan class.Contoh penulisan controller class untuk codeigniter 1.Controller.php<?phpClass Controller extends Controller{function index(){ echo “hello codeigniter versi1”; }}?>//pada codeigniter versi 1Contoh penulisan controller class untuk codeigniter 2 keatas.Controller.php<?phpClass Controller extends CI_Controller{function index(){ echo “hello codeigniter versi2”; }}?>//pada codeigniter versi 2Keterangan: Penulisan class diatas tidak hanya pada controller tapi penulisan di modeljuga menyesuaikan. Selain beda penulisan, masih banyak kelebihan-kelebihan lainyang diadopsi oleh codeigniter versi terbarunya. Bisa anda cek di codeigniter.com. 2012| Parade Pelatihan CNC 4
  4. 4. o Sistem kerja Codeigniter Alur kerja dari framework codeigniter meliputi: Models Routing Security Libraries Index.php Application Helpers Caching View controller Plugins Scripts Keterangan:  Index.php merupakan controller awal untuk menginisialisasikan kebutuhan untuk menjalankan Codeigniter sendiri.  Router/Routing merupakan bagian yang menentukan kegiatan yang harus dilakukan ketika ada permintaan dari client.  Caching merupakan bagian yang mengecek apakah data sudah pernah diminta atau belum. Jika chace aktif, maka akan langsung dikirimkan ke client dengan mengabaikan alur kerja normal.  Security merupkan proses pemfilteran, agar terjamin keamananya.  Controller merupakan pengendali dari jalanya aplikasi.  View merupakan bagian yang menyajikan suatu informasi ke client sesuai dengan permintaan yang diminta (dengan melewati tahap index-controller).o Struktur Folder Codeigniter Sebelum kita melangkah ke tahap instalasi dan konfigurasi codeigniter, ada baiknya kita mengenal struktur-struktur folder /direktori pada codeigniter, susunan foldernya sebagai berikut: a. Folder Application : untuk menyimpan aplikasi yang akan dibangun  Folder Cache : untuk menyimpan data chace jika cache anda aktifkan.  Folder Config : untuk menyimpan semua file konfigurasi web.  Folder Controllers : untuk menyimpan semua file controller.  Folder Errors : template halaman untuk menampilkan error.  Folder helpers : untuk menyimpan semua file helper.  Folder hooks : untuk menyimpan semua file hooks.  Folder language : untuk menyimpan file bahasa.  Folder libraries : berisi file-file library.  Folder logs : untuk menyimpan /mencatat file log error.  Folder models : berisi file-file model yang berperan sebagai presentasi database.  Folder view : untuk menyimpan file-file view guna menyajikan informasi kepada client. File view merupakan file yang terlihat pada browser. b. Folder user_guide: berisi dokumentasi Framework Codeignitero Library  Benchmark : digunakan untuk menghitung penggunaan memori.  Calender : digunakan untuk membuat kalender  Cart : digunakan untuk membuat cart pada took online.  Config : digunakan untuk menerima informasi konfigurasi  Email : digunakan untuk proses pengiriman email.  Encrypt : digunakan untuk proses enkripsi  Form_validation : digunakan untuk memvalidasi input masuk. 2012| Parade Pelatihan CNC 5
  5. 5.  Ftp : digunakan untuk proses transfer via FTP.  Image_lib : digunakan untuk manipulasi image.  Input : digunakan untuk memproses input data.  Language : digunakan untuk menggunakan (load) beberapa bahasa.  Pagination : digunakan untuk membantu proses paging.  Session : digunakan untuk mempertahankan user aktif.  Table : digunakan untuk mengegenerate table dari array.  Trackback : digunakan untuk mengirim dan menerima data trackback.  Unit_test : digunakan untuk testing  Upload : digunakan untuk membantu proses upload.  URI : digunakan membagI URL  Zip : digunakan untuk membuat arsip zip.1.6 Tools untuk meginstalasi Codeigniter. Dalam menginstalasi codeigniter, dibutuhkan beberapa tool’s dasar yang harus dipenuhi agar codeigniter dapat kita jalankan di localhost.  Webserver Untuk menguji apakah web yang kita buat telah sesuai dengan apa yang kita mau. Maka kita membutuhkan webserver. Tapi untuk webserver biasanya menggunakan localhost. Biasanya kita cukup menginstalasi xampp. Xampp telah mencangkup apache & mysql (paket komplit).  PHP Editor Editor ini berfungsi untuk kita menuliskan skrip program yang akan kita buat. Disini kita menggunakan editor komodo edit. Keunggulan dari komodo edit ini yaitu: open source. Selain itu sangat cocok untuk pembuatan web dengan framework khususnya Codeigniter.  Framework Codeigniter Codeigniter merupakan file utama dalam membangun aplikasi berbasis codeigniter, bisa didownload di http://codeigniter.com/download1.7 instalasi Codeigniter 1. Download file codeigniter kemudian extrak dan simpan ke xampp/htdocs. Misalkan kita download untuk CodeIgniter_2.0.3. Buka browser dan ketikan localhost/CodeIgniter_2.0.3. 2012| Parade Pelatihan CNC 6
  6. 6. 2. Default jika mengetikkan localhost/CodeIgniter_2.0.3 yaitu controller welcome. Untuk mengganti file controllernya Buka file application/config/routes.php. kemudian ubah untuk controller utamanya. Maksudnya halaman yang akan menjadi default, dengan artian meskipun tidak mendiskripsikan controllernya,maka kita dapat secara otomatis menuju ke controller default. Misal kita isikan crud. Ubah pada script dibawah ini. $route[default_controller] = "crud";3. Kemudian ubah file di application/config/config.php. a. Ubah pada base urlnya. Masukkan nama file dari file codeigniter yang telah kita rename namanya tadi. $config[base_url] = http://localhost/ci; b. Ubah untuk enkripsinya. Misal kita masukkan 12345. $config[encryption_key] = 12345;4. Selanjutnya, jika kita akan menggunakan database yang akan menjadi mesin penyimpanan data. Maka kita harus mengubah file untuk pendiskripsian databasenya. Buka file di application/config/database.php. kemudian ubah seperti dibawah ini. $db[default][hostname] = localhost; $db[default][username] = root; $db[default][password] = ; $db[default][database] = ci; $db[default][dbdriver] = mysql; $db[default][dbprefix] = ; $db[default][pconnect] = TRUE; $db[default][db_debug] = TRUE; $db[default][cache_on] = FALSE; $db[default][cachedir] = ; $db[default][char_set] = utf8; $db[default][dbcollat] = utf8_general_ci; $db[default][swap_pre] = ; $db[default][autoinit] = TRUE; $db[default][stricton] = FALSE; Penjelasan:  Hostname : Server yang kita gunakan.  Username :Username untuk masuk ke mysql kita masing-masing. Untuk default biasanya root. o Password : Password dari akses ke mysql kita. Untuk default biasanya kosongkan saja. 2012| Parade Pelatihan CNC 7
  7. 7.  Database : Merupakan nama database yang akan kita gunakan.  Dbdriver : jenis database yang kita akan gunakan. Untuk username dan password bila memiliki autentikasi sendiri masukkan sesuai dengan mysql anda. 5. Kemudian tambahkan library dan helper untuk di application/config/autoload.php. $autoload[libraries] = array(database,table); Keterangan:  Database : menambahkan library database jika kita akan menggunakan fungsi eksekusi script sql untuk database. Jika tidak melewati autoload untuk meload database, selain itu dapat menuliskan seperti ini . $this->load->database(); $autoload[helper] = array(url,html,form);Penanganan DatabaseSebagai pembahasan awal sebelum kita melangkah kepada operasi CRUD, alangkahbaiknya kita mengetahui hal paling mendasar pada penanganan query/ database dalamcodeigniter. Sehingga kita tidak hanya mengenal query PHP classis dan MySQL, misalnya SELECT * FROM inbox a. Pengganti SELECT Sebenarnya dalam Codeignter juga bisa menggunakan full perintah SELECT, berikut contoh penggunaanya: $this->db->query(‘SELECT * FROM inbox’); Namun dengan codeigniter, kita dapat meringkasnya menjadi demikian: $this->db->get(‘inbox’); b. Pengganti INSERT Fungsi insert berguna pada saat kita ingin menambahkan sebuah data ke dalam database. Berikut contoh penggunaan pada query SQL biasa: INSERT INTO inbox (…) values (…); Dalam codeigniter, kita dapat menggunakan kode berikut: $this->db->insert(‘inbox’,$data) 2012| Parade Pelatihan CNC 8
  8. 8. c. Pengganti UPDATE Update berfungsi apabila kita ingin mengubah suatu data, Pada query standar, salah satu bentuk contoh penggunaanya adalah sebagai berikut: UPDATE pbk set Name=’bambang’ where ID=’1’; Dalam codeigniter, kita dapat menggunakan kode berikut: $this->db->where(‘ID’,’1’); $this->db->update(‘pbk’,$data);d. Pengganti Delete Delete berfungsi utnuk menghapus suatu data Berikut contoh penggunaanya pada query biasa: DELETE from pbk where ID=’1’; Dan berikut contoh penggunaanya pada penanganan database Codeigniter: $this->db->where(‘ID’,’1’); $this->db->delete(‘pbk’);e. Pengganti Like Perintah Like biasanya digunakan untuk melakukan pencarian data. Dalam query biasa dapat dituliskan berikut: SELECT * from pbk where nama like ‘%bambang%’; Jika kita menggunakan Codeigniter, dapat dituliskan skrip sebagai berikut: $this->db->like(‘nama’,’bambang’); $this->db->get(‘pbk’);f. Pengganti Group By Dalam query biasa dapat dituliskan berikut: SELECT * from pbk GROUP BY GroupID; Jika kita menggunakan Codeigniter, dapat dituliskan skrip sebagai berikut: $this->db->groupby(‘GroupID’); $this->db->get(‘pbk’); 2012| Parade Pelatihan CNC 9
  9. 9. g. Pengganti Order By Dalam query biasa dapat dituliskan berikut: SELECT * from pbk ORDER BY Nama; Jika kita menggunakan Codeigniter, dapat dituliskan skrip sebagai berikut: $this->db->order_by(‘nama’); $this->db->get(‘pbk’); 2012| Parade Pelatihan CNC 10
  10. 10. MATERI CRUD (create,read,update,delete) 1. JQUERY- definisi dan sejarah singkat Pengertian JQuery adalah sebuah framework berbasiskan Javascript. JQuery sama dengan Javascript Library yaitu kumpulan kode atau fungsi Javascript siap pakai, sehingga mempermudah dan mempercepat kita dalam membuat kode Javascript. Hal yang menarik dari JQuery adalah penekanan interaksi antara Javascript dan HTML. JQuery pertama kali dirilis pada tahun 2006 oleh John Resig. JQuery memiliki slogan “Write less, do more” yang artinya kesederhanaan dalam penulisan code, tapi dengan hasil yang lebih banyak.- Beberapa kelebihan JQUERY Beberapa kemampuan yang dimiliki oleh JQuery sebagai berikut: 1. Kemudahan mengakses elemen-elemen HTML 2. Memanipulasi elemen HTML 3. Memanipulasi CSS 4. Penanganan event HTML 5. Efek-efek javascript dan animasi 6. Modifikasi HTML DOM 7. AJAX 8. Menyederhanakan kode javascript lainnya Beberapa Jquery yang akan digunakan pada pelatihan kali ini adalah accordion, autocomplete,dialog box dan validation. Jquery Accordion Jquery ini membuat sebuah tampilan seperti accordion. Dengan jquery ini kita dapat membuat sebuah menu ataupun tampilan utama sekalipun. Di dalam pelatihan kali ini jquery ini digunakan sebagai menu. Berikut tampilan yang ingin kita buat. Langsung saja kita ke cara pembuatan. Langkah-langkahnya adalah sebagai berikut. download Jquerynya.jquery accordion dapat di download di http://jqueryui.com/download. untuk selebihnya dapat dilihat di gambar berikut. 2012| Parade Pelatihan CNC 11
  11. 11. Centang bagian accordion lalu klik download.1. Setelah mendownload. Downloadan akan berupa file RAR. Coba buka maka isi dari file downloadan akan sebagai berikut.2. coba kita buka index.html. maka kita akan melihat tampilan.3. coba kita buka file index.html tadi dengan menggunakan text editor. Dibagian head html kita akan melihat script-script jquery yang disertakan di halaman tersebut. Jadi dalam setiap pembuatan accordion skrip-skrip tsb harus disertakan <link type="text/css" href="css/ui-lightness/jquery-ui- 1.8.19.custom.css" rel="stylesheet" /> <script type="text/javascript" src="js/jquery- 1.7.2.min.js"></script> <script type="text/javascript" src="js/jquery-ui- 1.8.19.custom.min.js"></script> <script type="text/javascript"> $(function(){ // Accordion $("#accordion").accordion({ header: "h3" }); //hover states on the static widgets $(#dialog_link, ul#icons li).hover( function() { $(this).addClass(ui-state-hover); }, function() { $(this).removeClass(ui-state-hover); } ); }); </script> 2012| Parade Pelatihan CNC 12
  12. 12. Dapat kita lihat juga disitu ada pendeklarasian fungsi akordion. Fungsi akordion berjalanapabila kita menggunakan id accordion dan pembentukan header bisa dilakukan dengan tag<h3>. Hal ini akan diperjelas pada gambar berikut. <div id="accordion"> <div> <h3><a href="#">First</a></h3> <div>Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet.</div> </div> <div> <h3><a href="#">Second</a></h3> <div>Phasellus mattis tincidunt nibh.</div> </div> <div> <h3><a href="#">Third</a></h3> <div>Nam dui erat, auctor a, dignissim quis.</div> </div> </div> Pada line 43 tag <div> menggunakan id accordion maka fungsi accordion dimulai. Lalu untuk membuat sebuah baris accordion dimulai dengan tag <div>.kemudian untuk membuat head dari accordion digunakan tag <h3>.dan isi konten dapat dibuat dengan menulis tag <div> lagi setelah tag <h3>. 4. Sekarang untuk membuat tampilan accordion seperti yang kita inginkan yang perlu kita lakukan adalah membuka halaman cssnya.mengapa? karena pengaturan tampilan jquery semua ada disitu. Kita buka jquery-ui.custom.css. langsung saja untuk membuat sudut accordion tidak melingkar lihat ke bagian misc.visual./* Corner radius */.ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl { -moz-border-radius-topleft: 4px; -webkit-border-top-left-radius: 4px;-khtml-border-top-left-radius: 4px; border-top-left-radius: 4px; }.ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr { -moz-border-radius-topright: 4px; -webkit-border-top-right-radius:4px; -khtml-border-top-right-radius: 4px; border-top-right-radius:4px; }.ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl { -moz-border-radius-bottomleft: 4px; -webkit-border-bottom-left-radius:4px; -khtml-border-bottom-left-radius: 4px; border-bottom-left-radius: 4px; }.ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br {-moz-border-radius-bottomright: 4px; -webkit-border-bottom-right-radius: 4px; -khtml-border-bottom-right-radius: 4px; border-bottom-right-radius: 4px; } 2012| Parade Pelatihan CNC 13
  13. 13. 5. Di gambar tersebut ada bagian corner radius. Di bagian inilah yang mengatur sudut accordion melengkung atau tidak. Nah sekarang rubah skrip tersebut menjadi seperti dibawah ini. /* Misc visuals ----------------------------------*/ /* Corner radius */ .ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl { } .ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr { } .ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl { } .ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner- br { }Dengan skrip diatas maka sudut accordion tidak melengkung lagi. Nah sekarang untukmengatur ukuran lebar dari accordion dapat dilihat pada gambar berikut. */ /* IE/Win - Fix animation bug - #4615 */ .ui-accordion { width: 20%; } Pada line 297 disitu ada width. Nah silahkan ganti angkanya sesuai dengan yang diinginkan. Setelah itu tampilan akan berubah menjadi seperti yang diinginkan.Integrasi Jquery Accordion ke dalam Codeigniter Untuk mengintegrasikan accordion ke dalam codeigniter kita harus mengerti dulu konsep MVC dari codeigniter (dijelaskan sebelum ini). Nah jadi langsung kita coba mengaplikasikan langsung. Berikut langkah-langkahnya :1. Pertama-tama kita masukan file tampilan accordion (misalkan seperti index.html diatas) ke dalam folder view dalam folder codeigniter.Nah kalo yang kita liat diatas file yang merupakan file tempilan accordion adalah akor.php. 2012| Parade Pelatihan CNC 14
  14. 14. 2. Selanjutnya, jquery accordion memiliki file-file js dan css yang harus disertakan nah sekarang copykan file-file tersebut ke folder sesuai base_url yang ada di config. perhatikan gambar di bawah ini. */ $config[base_url] = http://localhost/CI; /*Gambar diatas adalah base_url yang telah ditetapkan. Silahkan sesuaikan dengan namafolder masing-masing.nah sekarang copykan file-file yang diperlukan. Lihat gambar diatas, saya sudah menyimpan file saya sesuai dengan base_url yang saya gunakan.3. Nah sekarang, kita tinggal memanggil accordion kita melalui controller yang kita gunakan. Lihat gambar dibawah ini. public function index() { $this->load->view(akor); }Pada tampilan dapat kita lihat. Kita akan me-load file tampilan yaitu file akor.php. terakhirberhubung controller yang saya gunakan sudah menjadi controller default langsung sajakita ketikan url Localhost/ci Setelah itu maka akan tampilan akan muncul seperti di bawah ini. 2012| Parade Pelatihan CNC 15
  15. 15. 2. CRUDPada tahap ini, kita akan membuat tampilan inbox yang dapat kita lihat seperti gambardibawah ini. Fungsionalitasnya sendiri, inbox dapat melihat pesan masuk, melakukan deletedan melakukan replay. 1. Untuk dapat kita klik pada menunya kita menambahkan alamat link pada panel menunya <div> <h3><a href="#">Folder</a></h3> <div> <li><a href="<?php echo site_url(crud/index); ?>" style="text-decoration: none;" >Inbox</a></li><br/> <li><a href="<?php echo site_url(crud/sentitems); ?>" style="text-decoration: none;" >Sent Item</a></li> </div> </div> Keterangan: Menambahkan alamat href untuk inbox yaitu dengan menambahkan href="<?php echo site_url(crud/index); ?>" artinya jika diklik akan beralih ke controller crud dengan function index(). 2. Membuat controller crud.php dengan menambahkan function index(). function index() //untuk menampilkan form awal yaitu form tambah data cd { $this->load->database(); $this->load->library(pagination); $config= array( base_url=> site_url()./crud/index/, total_rows=>$this->db->count_all(inbox), per_page=>5, uri_segment => 3 ); $this->pagination->initialize($config); $data[pagination]=$this->pagination->create_links(); $data[inbox_row]=$this->crud_model- 2012| Parade Pelatihan CNC 16
  16. 16. >get_read_datainbox($config[per_page],$this->uri->segment(3)); $data[cd] = ; $this->load->view(crud_view, $data); } Keterangan:  $this->load->library(pagination); Script ini digunakan untuk memanggil library pagination yang nantinya kita fungsikan sebagai cara untuk membuat paging di halaman inboxnya. Karena tidak mungkin kita menampilkan semua inbox kedalam halaman web, jadi kita perlu menggunakan paging.  total_rows=>$this->db->count_all(inbox) Untuk mengitung berapa banyak jumlah inbox pada tabel database.  per_page=>5 Menampilkan 5 pesan inbox pada setiap kali halaman paging.  $data[inbox_row]=$this>crud_model>get_read_datainbox($con fig[per_page],$this->uri->segment(3)); Untuk mengambil data ke model yaitu crud_model pada function get_read_datainbox.  $this->load->view(crud_view, $data); Kemudian mengirimkanya ke view yaitu crud_view.3. Karena kita ada function yang menuju ke model yaitu di crud_model.php. Maka kita membuat function tersebut. function get_read_datainbox($limit, $uri){ $query= $this->db->get(inbox,$limit, $uri); return $query; }4. Setelah itu kita lakukan eksekusi tampilan pada folder views pada crud_view.php <div class="right_content"> <table border="0" width="100%" cellpadding="0" cellspacing="0" id="inbox-table"> <tr id="head"> <td id="no">No</td> <td id="judul" align="center">Text Message</td> <td id="kategori">Pengirim</td> <td id="harga">Date</td> <td id="action">&nbsp;</td> </tr> <?php if ( !empty($inbox_row) ) { $no = 1; foreach ($inbox_row->result() as $row) { ?> <tr id="row"> <td id="no"><?php echo $no;?></td> <td id="judul"><?php echo $row->TextDecoded;?></td> 2012| Parade Pelatihan CNC 17
  17. 17. <td id="kategori"><?php echo $row->SenderNumber;?></td> <td id="harga"><?php echo $row->ReceivingDateTime;?></td> <td id="action"> <a href="#" onclick="return confirm(Are yousure?);"><img src="<?php echo base_url();?>/images/delete_icon.gif"></a>| <a href="#"><img src="<?php echo base_url();?>/images/replay.gif"></a> </td> </tr> <?php $no++; } } else { ?> <tr id="row"> <td colspan="6" align="center">EMPTY</td> </tr> <?php } ?> </table> <?php echo $pagination; ?> </div>Keterangan:  if ( !empty($inbox_row) ) { }else { <tr id="row"> <td colspan="6" align="center">EMPTY</td> </tr>} Jika $inbox_row kosong maka akan menampilkan kata empty. Maka if else disini akan sangat penting ketika data inbox tidak ada dalam database.  foreach ($inbox_row->result() as $row) Seperti perulangan,sehingga nilai $inbox_row akan dijadikan sebuah array $row.  <td id="no"><?php echo $no;?></td> Menampilkan variabel nilainya.  <?php echo $row->TextDecoded;?> Menampilkan nilai dari $row sesuai dengan field databasenya yaitu ketika fieldnya TextDecoded. Begitu juga dengan nilai yang lain, intinya menyesuaikan database  <?php echo $pagination; ?> Menampilkan page pagingnyaJika sudah maka kita dapat menampilkan inbox seperti berikut, akan tetapi icondelete dan editnya belum bisa untuk eksekusinya. 2012| Parade Pelatihan CNC 18
  18. 18. 5. Selanjutnya kita mengeksekusi untuk icon deletenya. Tahap awal berikan href untuk linknya seperti berikut: <a href="<?php echo site_url(crud/delete/.$row->ID);?>" onclick="return confirm(Are you sure?);"><img src="<?php echo base_url(); ?>/images/delete_icon.gif"></a> Keterangan: crud/delete/.$row->ID nantinya tujuan eksekusi ke controller crud dengan functionya delete() dengan membawa variabel ID.6. Menambahkan function ke controller crud.php function delete() //untuk menghapus inbox { $kode = $this->security->xss_clean($this->uri- >segment(3)); $result = $this->crud_model->get_data_inbox($kode); if ($result == null) { redirect(crud); } else { $delete = $this->crud_model->delete_data_inbox($kode); if ($delete) $this->session->set_flashdata(message, Data deleted!); else $this->session->set_flashdata(message, Failed to delete data!); redirect(crud); } } Keterangan:  $result = $this->crud_model->get_data_inbox($kode); perintah untuk mengeksekusi ke database dengan melewati crud_mode.php. nama functionya get_data_inbox($kode). $kode merupakan parameter variabel yang akan digunakan dalam function tersebut. Jika data yang akan dihapus ada, maka menambahakan juga function delete_data_inbox($kode) ke dalam crud_model.php yang tujuanya untuk eksekusi delete. 2012| Parade Pelatihan CNC 19
  19. 19. 7. Menambahkan function delete_data_inbox() ke crud_model.php function get_data_inbox($kode) { $this->db->where(ID, $kode); $query = $this->db->get(inbox); if($query->num_rows() > 0){ return $query->row(); } else{ return null; } } function delete_data_inbox($kode) //untuk mengambil record berdasarkan kodenya { $this->db->where(ID, $kode); $this->db->delete(sentitems); if($this->db->affected_rows() > 0){ return true; } else{ return false; } } Kemudian lakukan klik ikon delete sehingga akan tampil seperti berikut: Setelah klik ok maka pesan inbox akan terhapus, yang sebelumnya berjumlah 4 menjadi 3 2012| Parade Pelatihan CNC 20
  20. 20. 3. Form Dialog box Dialog box adalah plugin dari J-query, yaitu sebuah kotak dialok yang didalamnyadapat kita sesuaikan dengan content apa saja yang kita mau. Kotak dialog ini bersifat pop-up sehingga user yang melihat web kita akan lebih terasa nyaman, Dalam pelatihan kali ini, kita akan mempelajari tentang Form Dialog Box dalamCode Igniter. Dialog box yang kita pasang ini akan kita konfigurasikan dengan fungsivalidate dan fungsi auto-complete. Pada dialog box ini, kita hanya berkutat di dalam file crud_view, pertama kita akanmembuat form dialog box yang berguna untuk me Replay message, yang harus kitalakukan adalah persiapkan file berikut: - jquery.min.js untuk J-query nya dan disimpan di dalam folder js - jquery-ui.min.js untuk J-query lanjutannya dan disimpan di dalam folder js - untuk CSS kita menggunakan css yang sama dengan Acordion tabs kemudian kita tambahkan id untuk dapat mengeksekusi perintah tersebut.Tambahan file tersebut kita pasang pada file crud_view.php<a href="#" onclick="replay(<?php echo $row->SenderNumber;?>);"><img src="<?php echo base_url();?>/images/replay.gif"></a></td> Setelah itu, kita akan membuat isi dari Form Dialog box.<div id="replay-form" title="replay message"><fieldset> <?php $attributes=array(name => "fmessage"); echo form_open("user/...",$attributes); ?> <label for="hp">No Handphone</label> <?php echo form_input(value,,id="id_tujuan"); ?><span id="hp_verify" class="verify"></span><br> <label for="message">Message</label> <textarea name="textmessage" onKeyUp="Hitung()"maxlength="160" id="alamat" rows="5" cols="55" > </textarea> </br><div id="maxkarakter"> 160 karakter </div></br> <input type=submit name=ok id="tombol3" align=left value="send message" /> <?php echo form_close(); ?></fieldset></div> 2012| Parade Pelatihan CNC 21
  21. 21. Setelah kita membuat isi untuk form dialog boxnya, sekarang kita membuat sciprtuntuk bisa menjalankan fungsi dari Form Dialog boxnya, script ini di tulis dalam tag<head></head><script> $(function() { $( "#dialog:ui-dialog" ).dialog( "destroy" ); $( "#replay-form" ).dialog({ autoOpen: false, height: 360, width: 400, modal: true, close: function() { allFields.val( "" ).removeClass( "ui-state-error" ); } }); $( "#message-form" ).dialog({ autoOpen: false, height: 300, width: 400, modal: true, close: function() { allFields.val( "" ).removeClass( "ui-state-error" ); } }); $( "#new-message" ) .click(function() { $( "#message-form" ).dialog( "open" ); }); $( "#tombol2" ) .button() ; $( "#tombol1" ) .button() ; }); </script> Kita buat function lagifunction replay(i){var id = i;$("#id_tujuan").val(id); $( "#replay-form" ).dialog( "open" );} 2012| Parade Pelatihan CNC 22
  22. 22. Setelah kita membuat script untuk memanggil dialog box tadi, kita membuat scriptdalam tag <style></style><style> label, input { display:block; } input.text { margin-bottom:12px; width:95%; padding: .4em; } fieldset { padding:0; border:0; margin-top:25px; } h1 { font-size: 1.2em; margin: .6em 0; } div#users-contain { width: 350px; margin: 20px 0; } div#users-contain table { margin: 1em 0; border-collapse: collapse; width: 100%; } div#users-contain table td, div#users-contain table th { border: 1px solid #eee; padding: .6em 10px; text-align:left; } .verify { margin-top: -35px; margin-left: 340px; position: absolute; width: 16px; height: 16px; }</style> Setelah kita membuat replay message, kita akan membuat create-new-message.Yang harus kita lakukan adalah buat script dulu untuk memanggil fungsi new-message.Script ini kita tuliskan di dalam acordion tabs,<div> <h3 ><a href="#">New Message</a></h3> <div><li><a href="#" style="text-decoration: none;" id="new-message">Compose</a></li> </div></div> Setelah itu, kita membuat isi dari dialog box yang akan kita tampilkan<div id="message-form" title="Create new message"> <fieldset> <?php echo form_open("user/..."); ?> <label for="hp">No Handphone</label> <label for="message">Message</label> <textarea name="textmessage" id="alamat" rows="5" cols="55" > </textarea> <input type=submit name=ok id="tombol2" align=left value="send message /> <?php echo form_close(); ?> </fieldset></div> Setelah itu, kita tidak perlu membuat file function lagi untuk create new message ini,karena function dialog box sudah kita definisikan dia atas. 2012| Parade Pelatihan CNC 23
  23. 23. FORM VALIDATION Validasi form adalah sebuah proses untuk memeriksa apakah suatu nilai yangdiinputkan itu valid atau tidak. Jika valid, maka proses akan dilanjutkan, jika tidak validmaka proses tidak akan dilanjutkan. Tujuan dari validasi ini adalah untuk memperkecilkesalahan user pada saat input data. Ada 2 jenis validasi form, yaitu client side validationdan server side validation. Apa bedanya? Client side validation adalah validasi yangdikerjakan disisi pengguna, jadi user tidak perlu submit terlebih dahulu untuk mengetahuidata yang diinputkan sudah valid atau belum. Sedangkan server side validation adalahvalidasi disisi server, jadi user akan mengetahui bahwa data yang diinputkan salah ketikauser sudah mengklik tombol submit. Dalam pelatihan ini, kita akan menggunakan dua jenis validasi tersebut. Client sidevalidation akan digunakan dalam form add contact dan compose message. Sedangkanserver side validation akan digunakan dalam form login. Untuk client side validation kitaakan menggunakan Jquery validation, yaitu sebuah plugin jquery yang berfungsi untukmempermudah dalam validasi form client side.PANEL LOGINLogin merupakan suatu gerbang dimana kita sebagai user atau admin dapat mengaksessuatu private area yang mempunyai hak-hak tertentu. Dalam aksi login saat ini, kita akanmenggunakan server side validation. Jadi pengecekan valid atau tidaknya akun tersebutberada disisi server. Berikut lebih jelasnya :  Buat tampilan login di direktori views dengan nama login.php <html> <head> <title>CRUD CodeIgniter</title> <link rel="stylesheet" href="<?php echo base_url();?>css/style.css" type="text/css" /> </head> <body> <div id="login_container"> <h1>Panel Login</h1> <div id="form_login"> <div id="login_error_message"><?php echo 2012| Parade Pelatihan CNC 24
  24. 24. validation_errors();?></div> <?php echo form_open(verifikasi_login); ?> <div id="field_login"> <span class="label">Username</span> <input type="text" name="username" value="username" onblur="if (this.value==) { this.value=username; }" onfocus="if (this.value==username) { this.value=; }" /> </div> <div id="field_login"> <span class="label">Password</span> <input type="password" name="password" value="**********" onblur="if (this.value==) { this.value=**********; }" onfocus="if (this.value==**********) { this.value=; }"/> </div> <div id="field"> <span class="label">&nbsp;</span> <input type="submit" id="submit" value="Submit"/> </div> <?php echo form_close(); ?> </div> <div id="login_footer"> Copyright &copy; cnc laboratory </div> </div> </body> </html> Buat controller dengan nama verifikasi_login.php <?php class Verifikasi_login extends CI_Controller { function __construct() { parent::__construct(); $this->load->model(crud_model,,TRUE); } function index() { $this->load->library(form_validation); $this->form_validation->set_rules(username, Username, trim|required|xss_clean); $this->form_validation->set_rules(password, Password, trim|required|xss_clean|callback_check_database); if($this->form_validation->run() == FALSE) { $this->load->view(login); } else { redirect(crud, refresh); } } function check_database($password) 2012| Parade Pelatihan CNC 25
  25. 25. { $username = $this->input->post(username); $result = $this->crud_model->login($username, $password); if($result) { $sess_array = array(); foreach($result as $row) { $sess_array = array( id_user => $row->id_user, username => $row->username ); $this->session->set_userdata(logged_in, $sess_array); } return TRUE; } else { $this->form_validation->set_message(check_database, Invalid username or password); return false; } } } ?>  Tambahkan/buat models dengan nama crud_model.php <?php class Crud_model extends CI_Model { private $table_name; public function __construct() { parent::__construct(); $this->table_name = cd; } function login($username,$password) { $this->db->select(id_user, username, password); $this->db->from(user); $this->db->where(username = ."".$username.""); $this->db->where(password = ."".MD5($password).""); $this->db->limit(1); $query= $this->db->get(); if($query->num_rows() ==1) { return $query->result(); }else{ return false; } } ?>PANEL ADD CONTACT 2012| Parade Pelatihan CNC 26
  26. 26. Add contact merupakan suatu menu form yang digunakan untuk menambahkan data kedalam phonebook. Dalam form ini kita akan menggunakan clientside validation, jadisebelum user ‘submit’, user dapat memastikan apakah data yang akan dimasukkan itu validatau tidak. Berikut penjelasannya :Dalam validasi ini kita mengecek apakah phonebook yang akan ditambahkan sudah adadalam database atau belum. Ketika kita masukkan nama, dan nama tersebut valid makaakan muncul checklist yang menunjukkan bahwa nama tersebut belum terdaftar didatabase. Namun, ketika kita memasukkan nomor handphone dan muncul tanda ‘cross’(gambar kiri) itu berarti data nomor tersebut sudah terdaftar di database. Data yang benar-benar valid adalah jika field nama dan no. Handphone terdapat tanda checklist (gambarkanan). Berikut source code nya :  Tambahkan sintak javascript pada <head> crud_view.php <script type="text/javascript"> $(document).ready(function(){ $("#user_name").keyup(function(){ if($("#user_name").val().length >= 4) { $.ajax({ type: "POST", url: "<?php echo base_url();?>index.php/user/check_user", data: "name="+$("#user_name").val(), success: function(msg){ if(msg=="true") { $("#usr_verify").css({ "background-image": "url(<?php echo base_url();?>images/yes.png)" }); } else { $("#usr_verify").css({ "background-image": "url(<?php echo base_url();?>images/no.png)" }); } } }); } else 2012| Parade Pelatihan CNC 27
  27. 27. { $("#usr_verify").css({ "background-image": "url(<?php echo base_url();?>images/no.png)" }); } }); $("#hp").keyup(function(){ if($("#hp").val().length >=10) { $.ajax({ type: "POST", url: "<?php echo base_url();?>index.php/user/check_nomer", data: "hp="+$("#hp").val(), success: function(msg){ if(msg=="true") { $("#hp_verify").css({ "background-image": "url(<?php echo base_url();?>images/yes.png)" }); } else { $("#hp_verify").css({ "background-image": "url(<?php echo base_url();?>images/no.png)" }); } } }); } else { $("#hp_verify").css({ "background-image": "url(<?php echo base_url();?>images/no.png)" }); } }); }); function isNumberKey(evt) { var charCode = (evt.which) ? evt.which : event.keyCode if (charCode > 31 && (charCode < 48 || charCode > 57)) return false; return true; } </script> Buat controller dengan nama user.php <?php public function check_user() { $usr=$this->input->post(name); $result=$this->user_model->check_user_exist($usr); if($result) 2012| Parade Pelatihan CNC 28
  28. 28. { echo "false"; } else{ echo "true"; } } public function check_nomer() { $hp=$this->input->post(hp); $result=$this->user_model->check_contact_exist($hp); if($result) { echo "false"; } else{ echo "true"; } } ?> Buat model dengan nama user_model.php <?php public function check_user_exist($usr) { $this->db->where("Name",$usr); $query=$this->db->get("pbk"); if($query->num_rows()>0) { return true; } else { return false; } } public function check_contact_exist($hp) { $this->db->where("Number",$hp); $query=$this->db->get("pbk"); if($query->num_rows()>0) { return true; } else { return false; } } ?> Untuk menampilkan icon validasi, pada form add contact tambahkan/ubah menjadi sebagai berikut. (Dalam file crud_view.php) 2012| Parade Pelatihan CNC 29
  29. 29. <div id="dialog-form" title="Add Contact"> <p class="validateTips"><?php echo validation_errors(<p class="error">); ?></p> <fieldset> <?php echo form_open("user/registration"); ?> <label for="name">Nama</label> <input type="text" id="user_name" name="user_name" value="<?php echo set_value(user_name); ?>" class="text ui-widget- content ui-corner-all" /> <div id="usr_verify" class="verify"></div> <label for="hp">No Handphone</label> <input type="text" id="hp" onkeypress="return isNumberKey(event)" name="hp" value="<?php echo set_value(hp); ?>" class="text ui-widget-content ui-corner-all" /> <span id="hp_verify" class="verify"></span> <input type=submit name=ok id="tombol1" align=left value="create account" /> <?php echo form_close(); ?> </fieldset> </div>  Note : jangan lupa copy paste ‘no.PNG’ dan ‘yes.PNG’ ke direktori image !!!  Field no.handphone hanya bisa diisi dengan format angka, field ini menjalankan function isNumberKey() javascript yang telah ditambahkan pada <head> sebelumnya.PANEL NEW MESSAGEPada panel ini akan terdapat 2 field yaitu nomor handphone dan message. Banyak karakterpada field message dibatasi sebanyak 160 karakter tiap SMS. Dan untuk field nomorhandphone akan menggunakan fitur autocomplete (autocomplete akan dibahas di babselanjutnya). Berikut source code nya :  Tambahkan sintak javascript pada <head> crud_view.php <script language=javascript> 2012| Parade Pelatihan CNC 30
  30. 30. function Hitung(){ var curText = document.fmessage.textmessage.value.length; var maxText = 160; var sisa = maxText - curText; var isi = document.getElementById(maxkarakter); isi.innerHTML = sisa + karakter; } </script> Untuk menghitung mundur jumlah karakter yang dituliskan, pada form ‘create new message’ tambahkan sintak sebagai berikut : <div id="message-form" title="Create new message"> <p class="validateTips"><?php echo validation_errors(<p class="error">); ?></p> <fieldset> <?php $attributes=array(name => "fmessage"); echo form_open("user/sendmessage",$attributes); ?> <label for="hp">No Handphone</label> <?php echo form_input(value,,id="id_kontak");?> <span id="hp_verify" class="verify"></span><br> <label for="message">Message</label> <textarea name="textmessage" onKeyUp="Hitung()" maxlength="160" id="alamat" rows="5" cols="55" > </textarea> </br><div id="maxkarakter"> 160 karakter </div></br> <input type=submit name=ok id="tombol2" align=left value="send message /> <?php echo form_close(); ?> </fieldset> </div> Note : ketika karakter message menunjukkan ‘0 karakter’, maka user tidak akan bisa menambahkan karakter lagi. Tambahkan sintak berikut pada controller user.php public function sendmessage() { $this->user_model->send_message(); redirect(crud); } Tambahkan sintak berikut pada model user_model.php public function send_message() { $data=array( DestinationNumber=>$this->input->post(nomer), Coding=>Default_No_Compression, TextDecoded=>$this->input->post(textmessage), CreatorID=>1 ); $this->db->insert(outbox,$data); } 2012| Parade Pelatihan CNC 31
  31. 31. PANEL REPLY MESSAGEPanel ini digunakan untuk membalas SMS dari inbox yang masuk. Isi fieldnya sama dengannew message, namun untuk nomer handphone akan secara otomasi terisi dengan nomertujuan dari yang SMS yang masuk. Berikut lebih jelasnya :  Tambahkan sintak berikut ke dalam crud_view.php <div id="replay-form" title="replay message"> <fieldset> <?php $attributes=array(name => "freply"); echo form_open("user/sendmessage",$attributes); ?> <label for="hp">No Handphone</label> <input type="text" id="id_tujuan" name="nomer"> <span id="hp_verify" class="verify"></span><br> <label for="message">Message</label> <textarea name="textmessage" onKeyUp="Hitung2()" maxlength="160" id="alamat" rows="5" cols="55" > </textarea> </br><div id="maxreply"> 160 karakter </div></br> <input type=submit name=ok id="tombol3" align=left value="send message" /> <?php echo form_close(); ?> </fieldset> </div>  Untuk menghitung mundur jumlah karakter reply, tambahkan sintak berikut ke <head> crud_view.php function Hitung2(){ var curText = document.freply.textmessage.value.length; var maxText = 160; var sisa = maxText - curText; var isi = document.getElementById(maxreply); isi.innerHTML = sisa + karakter; 2012| Parade Pelatihan CNC 32
  32. 32. }  Agar dapat membawa nomer handphone dari pengirim, maka tambahkan sintak berikut pada anchor reply di crud_view.php <a href="#" onclick="replay(<?php echo $row->SenderNumber; ?>);"><img src="<?php echo base_url(); ?>/images/replay.gif"></a>  Dan tambahkan function berikut pada <head> crud_view.php function replay(i){ var id = i; $("#id_tujuan").val(id); $( "#replay-form" ).dialog( "open" ) } //tambahkan pada function dialog box sebelumnya $( "#replay-form" ).dialog({ autoOpen: false, height: 360, width: 400, modal: true, close: function() { allFields.val( "" ).removeClass( "ui-state-error" ); } }); $( "#tombol3" ) .button() ; //akhir penambahan pada dialog box  Untuk proses pengiriman, aksi dari controller dan model sama dengan create new message diatas. Maka tidak perlu kita buat lagi  4. AutoCompleteAutoComplete dapat memudahkan kita dalam mencari data yang kita inginkan,misalnyadalam kasus pencarian. Ketika kita mengetikkan 1 karakter maka seluruh data yang 2012| Parade Pelatihan CNC 33
  33. 33. mengandung awalan karakter yang ditampilkan. Mungkin jika Anda sering searchingmenggunakan Google, fasilitas ini pasti tidak asing lagi.Hal-hal yang diperlukan pertama adalah persiapkan sebuah tabel yang berisi data nomorhandphone dan nama orang yang akan kita tuju. Adapun spesifikasinya sebagai berikut :Dengan syarat ID sebagai primary key, dan di autoincrement-kan.Selanjutnya isi data pada tabel diatas secara manual melalui tab INSERT di phpmyadmin.Contoh data bisa dilihat sebagai berikut:Tambahkan Script Model berikut pada model crud_model.php yang telah kita buatsebelumnya :<?php function lookup($keyword){ $this->db->select(*)->from(pbk); $this->db->like(Number,$keyword,after); $query = $this->db->get(); return $query->result(); } ?>Langkah selanjutnya membuat controller untuk autocomplete yang akan kita buat.Tambahkan script berikut pada controller yang telah kita buat sebelumnya. Bernamacrud.php di dalam folder application/controllers. Scriptnya seperti berikut :<?php function lookup(){ // process posted form data (the requested items likenomor) $keyword = $this->input->post(term); $data[response] = false; //Set default response $query = $this->crud_model->lookup($keyword); //Search DB if( ! empty($query) ) 2012| Parade Pelatihan CNC 34
  34. 34. { $data[response] = true; //Set response $data[message] = array(); //Create array foreach( $query as $row ) { $data[message][] = array( id=>$row-> ID, value => $row->Number, ); //Menambahkan row ke suatuarray } } if(IS_AJAX) { echo json_encode($data); //echo json string if ajaxrequest } else { $this->load->view(autocomplete/index,$data); //Loadhtml view of search results } } ?>Setelah selesai, langkah terakhir adalah membuat view nya, sisipkan script berikut di dalamview yang telah kita buat sebelumnya, bernama crud_view.php .<script type="text/javascript"> $(this).ready( function() { $("#id_kontak").autocomplete({ minLength: 1, source: function(req, add){ $.ajax({ url: "<?php echo base_url();?>index.php/crud/lookup", dataType: json, type: POST, data: req, success: function(data){ if(data.response =="true"){ add(data.message); } }, }); }, select: 2012| Parade Pelatihan CNC 35
  35. 35. function(event, ui) { $("#result").append( "<li>"+ ui.item.nama + "</li>" ); }, }); }); </script> <style> /* Autocomplete ----------------------------------*/ .ui-autocomplete { position: absolute; cursor:default; } .ui-autocomplete-loading { background: whiteurl(<?php echo base_url();?>/jquery/images/ui-anim_basic_16x16.gif) right center no-repeat; }*/ /* workarounds */ * html .ui-autocomplete { width:1px; } /* withoutthis, the menu expands to 100% in IE6 */ /* Menu ----------------------------------*/ .ui-menu { list-style:none; padding: 2px; margin: 0; display:block; } .ui-menu .ui-menu { margin-top: -3px; } .ui-menu .ui-menu-item { margin:0; padding: 0; zoom: 1; float: left; clear: left; width: 100%; font-size:80%; } .ui-menu .ui-menu-item a { text-decoration:none; display:block; padding:.2em .4em; line-height:1.5; zoom:1; } .ui-menu .ui-menu-item a.ui-state-hover, .ui-menu .ui-menu-item a.ui-state-active { font-weight: normal; 2012| Parade Pelatihan CNC 36
  36. 36. margin: -1px; } </style> </head> <body><!-- mulai dialog-form nya --><div id="dialog-form" title="New Message"> <p class="validateTips">All form fields are required.</p> <fieldset> <form action="input.php" method="POST"> <label for="name">Nomor Handphone</label> <?php echo form_input(nomor,,id="id_kontak"); ?> <label for="email">Pesan</label> <?php $text = array ( name => pesan, cols => 60, rows => 5); echo form_textarea($text); ?> <input type=submit name=submit id="tombol" align=left> </form> </fieldset></div><!-- button nya --><button id="create-user">New Message</button></body></html>Apabila proyek yang telah kita kerjakan benar maka hasilnya adalah sebagai berikut : 2012| Parade Pelatihan CNC 37
  37. 37. Penjelasan : Halaman awal setelah login sebelum new message di klikDan tampilan terakhir dari kotak Dialog box yang telah kita buat tadi, disini kolom yang kitaisikan akan menampilkan auto-suggest / inputan yang pada awalnya adalah 8.Jika sudah sampai di tahap ini, maka script yang tadi kita buat sudah berjalan denganbenar. 1. Menerapkan Grafik untuk membaca jumlah inbox dan sent item 2012| Parade Pelatihan CNC 38
  38. 38. Grafik bar untuk inbox dan sent itemKali ini kita akan membuat grafik batang yang memerapkan untuk membaca tableinbox dan sent item dari database, konsep ini grafik merepresentasikan jumlah inboxdan sent item pada now -7 hari. Jadi semisal sekarang tanggal 5 Mei 2012, makagrafik akan membaca untuk tanggal 28 April 2012 sampai 05 April 2012. Selain itubagian grafik akan menampilkan jumlah total dari inbox dan sent itemnya, Sehinggakita dapat mengetahui jumlah total inbox dan sent item yang ada dalam database.a. Persiapkan file-file berikut: -FCF_MSColumn3D.swf kemudian kita simpan pada folder ci/charts. -jquery-1.4.js simpan filenya di ci/js. -jquery.fusioncharts.js simpan filenya di ci/js.b. Kemudian kita diskripsikan tujuan controller ketika klik menu status. Tambahkanpada crud_view.php<div onclick="location.href=crud/status;"> <h3><a id="create-user">Status</a></h3></div>Keterangan: kita memberikan tujuan ke controller crud/status ketika ada perintahklik pada bagian menu status.c. Berikan fungtion baru dengan nama status pada controller crud.php. function status(){ $oa=strtotime(date(Y-m-d)); $sa=date(Y-m-d,strtotime(-1 week,$oa)); $tgl=explode("-",$sa); $da=date(Y-m-d,strtotime(this week,$oa)); //inbox $datas="<tr><td>inbox</td>"; for($i=0;$i<=7;$i++){ $x=mktime(0,0,0,$tgl[1],$tgl[2]+$i,$tgl[0]); $y=date(Y-m-d,$x); $datas.=<td>.$this->crud_model-> cari_datainbox($y).</td>; } $data[inbox]=$datas.</tr>; //sent item $datas="<tr><td>Sent Item</td>"; 2012| Parade Pelatihan CNC 39
  39. 39. for($i=0;$i<=7;$i++){ $x=mktime(0,0,0,$tgl[1],$tgl[2]+$i,$tgl[0]); $y=date(Y-m-d,$x); $datas.=<td>.$this->crud_model-> cari_datasitem($y).</td>; } $data[sentitem]=$datas.</tr>; //tanggal $datas="<tr><th>Tgl</th>"; $sa=date(Y-m-d,strtotime(-1 week,$oa)); $tgl=explode("-",$sa); for($i=0;$i<=7;$i++){ $x=mktime(0,0,0,$tgl[1],$tgl[2]+$i,$tgl[0]); $y=date(d,$x); $datas.=<th>.$y.</th>; } $data[tgl]=$datas.</tr>; //mencari tanggal -7 dan tanggal sekarang! $oa=strtotime(date(Y-m-d)); $sa=date(d-m-Y,strtotime(-1 week,$oa)); $da=date(d-m-Y,strtotime(now)); $data[last]=$sa; $data[now]=$da; $data[jumlahinbox]=$this->crud_model->cari_totalinbox(); $data[jumlahsitem]=$this->crud_model->cari_totalsitem(); $this->load->view(vstatus,$data); }d. Kemudian kita beralih pada model yaitu untuk mengeksekusi databasenya. Berikan fungsi baru pada crud_model.php function cari_datainbox($i){ $this->db->select(ReceivingDateTime); $this->db->from(inbox); $this->db->like(ReceivingDateTime,$i,after); $inbox=$this->db->get(); $jumlah=$inbox->num_rows(); $jumlah=!empty($jumlah)?$jumlah:0; return $jumlah; } function cari_totalinbox(){ $inbox=$this->db->get(inbox); $jumlah=$inbox->num_rows(); $jumlah=!empty($jumlah)?$jumlah:0; return $jumlah; } function cari_datasitem($i){ $this->db->select(SendingDateTime); $this->db->from(sentitems); 2012| Parade Pelatihan CNC 40
  40. 40. $this->db->like(SendingDateTime,$i,after); $inbox=$this->db->get(); $jumlah=$inbox->num_rows(); $jumlah=!empty($jumlah)?$jumlah:0; return $jumlah; } function cari_totalsitem(){ $inbox=$this->db->get(sentitems); $jumlah=$inbox->num_rows(); $jumlah=!empty($jumlah)?$jumlah:0; return $jumlah; }e. Setelah itu kita beralih ke view. Karena controller mengirimkanya ke view vstatus $this->load->view(‘vstatus’,$data) maka kita buat vstatus.php pada folder viewnya. vstatus.php Tambahkan di dalam tag <head> <script type="text/javascript" src="<?php echo base_url(); ?>js/jquery-1.4.js"></script> <script type="text/javascript" src="<?php echo base_url(); ?>js/jquery.fusioncharts.js"></script> Tambahkan script dibawah ini untuk menampilkan grafiknya di bagian <div class=”right_content”> <div class="right_content"> <!-- grafik--> <div style="overflow:auto; width:575px; height:370px; padding:5px; border:1px solid #eee"> <center><h4>Grafik Inbox dan Sent Item</h4></center> <?php echo "<center>$last sampai $now</center>"; ?> <table style="display: none;" id="myHTMLTable" border="1" align="center"> <?php echo $tgl; ?> <?php echo $inbox; ?> <?php echo $sentitem; ?> </table> <script type="text/javascript"> $(#myHTMLTable).convertToFusionCharts({ swfPath: "<?php echo base_url(); ?>charts/", type: "MSColumn3D", data: "#myHTMLTable", dataFormat: "HTMLTable", width : "550" 2012| Parade Pelatihan CNC 41
  41. 41. }); </script> <table border="0"> <tr><td>Total Inbox</td><td>:</td><td><?php echo $jumlahinbox; ?></td></tr> <tr><td>Total Sent Item</td><td>:</td><td><?php echo $jumlahsitem ?></td></tr> </table> </div> <!-- end grafik--> </div>f. Terakhir kita lihat hasilnya, dengan menklik menu status maka akan tampil seperti dibawah ini. 2012| Parade Pelatihan CNC 42
  42. 42. Membuat aplikasi sms gateway di Windows1. Download file gammu di wammu.eu/download. Kemudian pilih untuk versi gammu yang stabil, untuk versi saat membuat tutorial ini penulis mencoba untuk memilih gammu 1.31.0. Download gammu windows versi .ZIP2. Setelah mendownload file gammu-1.31.0-windows.zip, kemudian lakukan ekstrak file zip tersebut. Buka folder hasil ekstrak, maka akan terdapat 4 folder yaitu: bin, include, lib, dan share.3. Pindahkan file hasil ekstrak atau folder Gammu-1.31.0-Windows ke direktori C: kemudian rename dengan nama gammu-1.31 agar lebih mudah.4. Langkah berikutnya yaitu melakukan konfigurasi untuk file gammurc dan smsdrc. Caranya cari file gammurc dan smsdrc yang ada di C:gammu- 1.31sharedocgammuexamplesconfig dan copykan kedua file tersebut ke folder bin yang berada di C:gammu-1.31bin . kemudian konfigurasi gammurc-nya. 2012| Parade Pelatihan CNC 43
  43. 43. gammurc [gammu] device = com12: connection = at115200 ;Do not use model configuration unless you really need it ;model = 6110 ;synchronizetime = yes ;logfile = gammulog ;logformat = textall ;use_locking = yes ;gammuloc = locfile ;startinfo = yes ;gammucoding = utf8 ;usephonedb = yescatatan : Untuk membuka file ini, dapat menggunakan notepad atau editor lainya.Pada gammurc hanya konfigurasi pada device dan connection. Untuk device kitasesuaikan pada pengecekkan port pada komputer. Untuk connection pada modemyang saya pakai adalah at115200, untuk modem atau handphone yang lainya dapatdilihat di http://wammu.eu/phones.Melihat port device : Cari pada Device Manager kemudian pilih modems. Catatan : Jika device manager tidak menampilkan modem, kemungkinan besar yaitu belum menginstall driver bawaan dari modem tersebut. Sehingga,perlu untuk menginstall terlebih dahulu sebelum melihat device portnya. Kemudian, untuk menghindari bentrok close software bawaanya. 2012| Parade Pelatihan CNC 44
  44. 44.  Klik kanan pada modem yang digunakan, dan pilih properties, kemudian cek pada modem. Device Port yaitu com125. Langkah berikutnya kita lakukan pengecekkan apakah konfigurasi terhadap modem yang dipakai sudah sesuai.  Buka comment-prompt  Kemudian ketikan dibawah ini untuk masuk ke directori C:gammu-1.31bin cd C:gammu-1.31bin  Kemudian ketikkan gammu –identify  Jika konfigurasi telah sesuai maka kan tampil seperti berikut: Catatan : Kalau IMEI nya muncul maka sudah OK!6. Setelah terdeteksi untuk modem dan device portnya, selanjutnya tahap menyambungkan dengan database. Catatan : Komputer telah terinstall Apache, Mysql. Jika belum anda dapat menginstall Xampp terlebih dahulu. 2012| Parade Pelatihan CNC 45
  45. 45.  Buat database baru di localhost/phpmyadmin, misalkan pada kasus sekarang buat database dengan nama sms. Import database mysql.sql di folder C:gammu- 1.31sharedocgammuexamplessql Pilih import Pilih file mysql.sql Klik go! 2012| Parade Pelatihan CNC 46
  46. 46.  Jika sukses dalam import file sql tersebut maka akan tampil seperti dibawah ini. Telah berhasil import database (ada 9 tabel)! Setelah membuat database beserta import isi database yang berjumlah 9 tabel, maka selanjutnya konfigurasi dengan file smsdrc yang berada di direktori bin. Sehingga sms yang diterima oleh device dapat di simpan kedalam database sms. smsdrc [gammu] device = com12: Sesuai dengan device port #model = 6110 connection = at115200 Sesuai daftar device di wammu.eu/phones #synchronizetime = yes #logfile = gammulog # this is not used at all in SMSD mode #logformat = textall #use_locking = yes #gammuloc = gammu.us #startinfo = yes catatan : Jangan lupa untuk menghilangkan tanda # pada parameter yang akan digunakan. 2012| Parade Pelatihan CNC 47
  47. 47. # General SMSD settings, see gammu-smsdrc(5) for detailed description. [smsd] # SMSD service to use, one of FILES, MYSQL, PGSQL, DBI service = sql Versi gammu terbaru service kita ubah menjadi sql # PIN for SIM card #PIN = 1234 Beri tanda # jika simcard tidak memakai PIN Kemudian konfigurasi untuk databasenya. # Database backends congfiguration user = root password = pc = localhost # pc can also contain port or socket path after colon (eg. localhost:/path/to/socket) database = sms # DBI configuration driver = sqlite Driver diubah menjadi native_mysql # driverspath = /usr/lib/dbd/ # Database directory for sqlite # dbdir = /var/lib/smsd Keterangan konfigurasi database:  User : Nama user untuk mengakses ke database mysql.  Password : Password utnuk mengakses ke database, jika tidak ada kita kosongkan saja.  Pc : Isikan localhost, karena kita mengakses di localhost.  Database : Nama database yang akan kita jadinkan tempat penyimpanan sms.7. Setelah mengkonfigurasi gammurc dan smsdrc, selanjutnya mulai menjalankan sebagai servicenya.  Untuk menginstall service gammu-smsd –i –c smsdrc –n gammuSMSD Jika comment benar, maka akan menampilkan seperti ini . 2012| Parade Pelatihan CNC 48
  48. 48.  Untuk menuninstall service gammu-smsd –u –c smsdrc –n gammuSMSD Jika comment benar, maka akan menampilkan seperti ini. Untuk menjalankan service gammu-smsd –s –c smsdrc –n gammuSMSD Jika comment benar, maka akan menampilkan seperti ini. Untuk mengecek apakah service gammusmsd telah running, dapat mengecek pada task manager seperti dibawah ini. Status Running 2012| Parade Pelatihan CNC 49
  49. 49. 8. Setelah semuanya dilakukan, kemudian lakukan pengiriman sms ke nomor handphone yang ada pada modem. Bila, konfigurasi benar maka pesan atau sms masuk akan masuk pada database sms dan berada di tabel inbox. Kurang lebih akan tampil seperti dibawah ini. 2012| Parade Pelatihan CNC 50
  50. 50. Membuat aplikasi sms gateway di ubuntu 11.10 (Oneiric Ocelot)1. Persiapkan terlebih dahulu ubuntu 11.10 dengan koneksi internet yang memadahi. Pada studi kasus tutorial kali ini, penulis menggunakan akses internet kampus Institute Teknologi Telkom dengan menggunakan proxy address 172.16.1.1 proxy port 8080. Untuk repository kita menggunakan server pinguin (Repository Laboratorium CNC).2. Akses ke pinguin.ittelkom.ac.id/mirror. Kemudian pilih untuk bagian repo ubuntu, setelah itu pilih untuk versi ubuntunya. Karena disini kita memakai ubuntu 11.10 oneiric maka kita pilih repo yang sesuai. Pilih seri oneiric Klik untuk how-to.txt. maka akan ada beberapa konfigurasi untuk alamat list repositorinya.3. Copykan ke source.list dari ubuntu anda. Dengan cara ketikan pada terminal. Untuk masuk dalam mode root terlebih dahulu ketikan. sudo su Kemudian ganti sources.list gedit /etc/apt/sources.list Copykan konfigurasi yang ada pada list web tadi kedalam panel editnya. Dapat dilihat pada gambar berikut ini. Kemudian save konfigurasinya. 2012| Parade Pelatihan CNC 51
  51. 51. Setelah konfigurasi disimpan. Lakukan update dengan cara mengetikkan diterminal.apt-get updateJika tidak terjadi proses maka kita harus seting proxy pada terminalnya denganmengetikan format berikut kedalam terminal.export http_proxy=http://yourproxyaddress:proxyportKeterangan:  yourproxyaddress : Diisi alamat proxy yang digunakan.  proxyport : Diisi untuk port proxy yang digunakan.Karena kasus kali ini menggunakan proxy address 172.16.1.1 proxy port 8080. Makaketikan diterminal seperti ini:export http_proxy=http://172.16.1.1:8080Kemudian lakukan update kembali. Jika sukses akan tampil seperti berikut: 2012| Parade Pelatihan CNC 52
  52. 52. 4. Install apache2, untuk install apache masuk keterminal dan ketikan: apt-get install apache2 Maka akan muncul do you want to continue [Y/n]? kemudian ketikan y dan tekan enter. Jika sudah proses selesai, coba untuk membuka browser dan ketikan alamat http://localhost jika apache telah terinstal akan memunculkan it works!. 5. Install PHP, untuk menginstall php, ketikan diterminal seperti berikut. sudo apt-get install php5 libapache2-mod-php5 Proses selanjutnya akan sama dengan proses menginstall apache2. Setelah terinstall lakukan restart untuk apache2nya dengan mengetikkan perintah berikut. /etc/init.d/apache2 restart Untuk menguji berhasil atau tidaknya PHP yang baru saja kita install, buatlah sebuah file format php dan disimpan di /var/www/file_anda.php atau anda 2012| Parade Pelatihan CNC 53
  53. 53. langsung bisa mengetikkan ke terminal seperti berikut:gedit /var/www/phpinfo.phpKemudian isikan pada phpinfo.php seperti berikut.<?phpphpinfo()?>Kemudian anda langsung bisa mengakses menggunakan browser danmemasukkan alamat ini. http://localhost/phpinfo.php. jika file bernama lainmaka akses kehalaman,dengan memberikan nama file untuk setelah localhost.Keterangan: jika muncul maka menandakan php telah terinstall. 2012| Parade Pelatihan CNC 54
  54. 54. 6. Install mysql-server, mysql disini berhubungan dengan database kita, dan untuk menginstalnya hanya perlu mengetikkan perintah berikut keterminal. apt-get install mysql-server Tunggu prosesnya, jika ada muncul seperti berikut maka masukkan password untuk username root mysql anda. Password ini digunakan apabila anda menggunakan MySQL, jadi ingat baik-baik password anda. Ulangi passwordnya sesuai dengan password yang anda masukkan tadi.7. Setelah install MySQL telah selesai, selanjutnya komponen terakhir yang perlu diinstall untuk membangun webserver yaitu PhpMyAdmin. Sebenarnya tanpa phpmyadmin sendiri kita sudah bisa menggunakan mysql, hanya untuk pemula dalam masalah database, maka kita akan sangat mengalami kesulitan sehingga membutuhkan gui atau interface agar penggunaan database MySQLnya lebih mudah. Ketikan perintah berikut. apt-get install phpmyadmin 2012| Parade Pelatihan CNC 55
  55. 55. Setelah itu akan muncul seperti berikut pilih untuk apache2 kemudian tekan enter dan pilih no untuk setingan konfigurasi kemudian tekan enter lagi.8. Selanjutnya, ketikan perintah berikut diterminal. cp /etc/phpmyadmin/apache.conf /etc/apache2/conf.d Kemudan lakukan restart apache2nya. /etc/init.d/apache2 restart Untuk melihat hasilnya, masukkan alamat http://localhost/phpmyadin. Untuk masuk loginlah sebagai root dengan password yang telah anda buat. 2012| Parade Pelatihan CNC 56
  56. 56. Jika username dan password benar maka akan muncul halaman muka dari panel phpmyadminya seperti gambar diatas.9. Instalasi gammu dan gammu-smsd apt-get install gammu gammu-smsd Tunggu sampai proses selesai, pada setingan awal gammu-smsd belum sesuai dengan konfigurasi sehingga nantinya perlu kita konfigurasi manual.10. Tahap selanjutnya pasangkan modem atau bisa juga menggunakan device handphone. Kali ini penulis menggunakan modem ZTE model: MF636. Cek versi dari gammu yang telah terinstall, ketikkan perintah dalam terminal dpkg –l gammu 2012| Parade Pelatihan CNC 57
  57. 57. Sebelum mengkonfigurasi, kita perlu mencari tahu dimanakah letak port device tersebut. Cara melihatnya dapat mengetikkan dmesg | grep tty Kemudian kita seting konfigurasi seperti berikut ini. Dengan port yang sebelumnya kita cek yaitu ttyUSB1. Keterangan :  Port : letak port yang sebelumnya kita cek.  Connection : tipe koneksinya, untuk melihat database list tipe koneksinya bisa cek di wammu.eu/phones/.11. Setelah konfigurasi, lakukan identify apakah modem telah teridentifikasi sempurna oleh computer ubuntu kita. Caranya ketikan perintah berikut gammu –-identify 2012| Parade Pelatihan CNC 58
  58. 58. Jika berhasil seperti gambar diatas, lakukan pengecekkan dengan mangirmkan sms melalui terminal dengan mengetikkan perintah. echo isi_pesan | gammu –sendsms TEXT no_tujuan12. Menggunakan funsionalitas database mysql untuk menyimpan sms yang masuk. Sehingga nanti semua sms akan masuk kedalam database mysql. Pertama buat terlabih dahulu nama databasenya, contoh disini memberikan nama parade_cnc. Kemudian importkan untuk database bawaan dari gammu. Sebelumnya kita extrak terlebih dahulu file mysql.sql.gz yang berada di folder /usr/share/doc/gammu/examples/sql/mysql.sql.qz. dengan cara: cd /usr/share/doc/gammu/examples/sql 2012| Parade Pelatihan CNC 59
  59. 59. Kemudian ketikan perintah berikut untuk mengekstrak mysql.sql.gz menjadi mysql.sql. gunzip mysql.sql.gz Kemudian import mysql.sql seperti berikut pada database yang telah dibuat tadi. Jika sudah berhasil import maka hasilnya akan seperti berikut:13. Setelah database kita persiapkan, saatnya konfigurasi agar dapat terhubung. Langkah awal buat file /etc/gammurc. Anda dapat mengetikkan perintah gedit /etc/gammurc Kemudian isikan konfigurasi berikut ini. [gammu] Port = /dev/ttyUSB1 Connection = at19200 Logfile = /etc/gammulog Logformat = textall Use_locking = yes Keterangan : semua konfigurasi diatas menyesuaikan port dan jenis connectionya. Untuk jenis connectionya tergantung devicenya. 2012| Parade Pelatihan CNC 60
  60. 60. Karena tujuan kita akan menghubungkan gammu dengan Mysql, Maka kitamengedit file /etc/gammu-smsdrc. Lakukan perintah berikut.gedit /etc/gammu-smsdrcKemudian isikan seperti berikut:[gammu]Port = /dev/ttyUSB1Connection = at19200[smsd]Service = sqlLogfile = /etc/smsdlogDebuglevel =255User = rootPassword = paradecncPC = localhostDatabase = parade_cncDriver = native_mysqlKemudian save, dan untuk menjalankan service gammu-sms hanya perlumengetikkan perintah berikut pada terminal.gammu-smsdKemudian lakukan test dengan mengirimkan sms ke no modem atau device lainyang dipakai untuk sms gateway. Jika semua konfigurasi dan pensetingan telahsesuai maka akan berhasil dan sms yang masuk akan langsung masuk kedalamdatabase parade_cnc pada table inbox. 2012| Parade Pelatihan CNC 61
  61. 61. Trigger MySQLArti trigger sendiri merupakan suatu pemicu. Misalkan jika ada data masukkan di tabelinbox maka akan lakukan perintah x. Banyak sekali manfaat dari trigger sendiri, biasanyatrigger digunakan untuk pembackup’an data. Dilain kasus,dengan memanfaatkan triggersendiri kita bisa membuat sebuah aplikasi sms auto replay yang cukup baik. Mari kita coba,Contoh 1: Membuat sms auto replay untuk level 1.Format -> Ketik CNC<SPASI>DAFTARAnaloginya sendiri, ketika ada inputan atau sms masuk kedalam tabel inbox maka sistemakan membaca. Jika tidak ada format pesan yang sesuai dengan apa yang dimiliki programyaitu CNC<spasi>DAFTAR maka akan dibalas “Maaf Format sms anda salah! Cnc_crew”.CREATE TRIGGER cnc1AFTER INSERT ON inboxFOR EACH ROW BEGINif SUBSTRING(new.TextDecoded,5,10)=’DAFTAR’ thenINSERT INTOoutbox ( DestinationNumber, Coding, TextDecoded, CreatorID )VALUES ( new.SenderNumber, ‘Default_No_Compression’,’Hore Format andabenar’, ’1′);elseINSERT INTOoutbox ( DestinationNumber, Coding, TextDecoded, CreatorID )VALUES ( new.SenderNumber, ‘Default_No_Compression’, ‘Maaf format smsAnda salah! Cnc_Crew Ketik CNC<spasi>DAFTAR’, ’1′);end if;END$$Keterangan:  CREATE TRIGGER cnc1 Membuat trigger di MySQL untuk nama triggernya cnc1. Untuk mengecek trigger apa saja yang telah dibuat di MySQL tinggal ketikan. show triggers  SUBSTRING(new.TextDecoded,5,10)=’DAFTAR’ mengecek table inbox untuk field TextDecoded untuk isi dar karakter ke 5 sampai 10 apakah berisi DAFTAR. Jika benar maka akan memasukkan ke table outbox .  END$$ Merupakan sebuah pembatas. 2012| Parade Pelatihan CNC 62

×