MODULPRAKTIKUM Web 2 Cetak by Dedih

Modul Pemograman Web 2 With CI
FASILKOM UNSIKA
MODUL I
MENGENAL CODEIGNITER
1.1 Definisi CodeIgniter
CodeIgniter (CI) adalah suatu framework pengembangan aplikasi web berbasis PHP. CI
menyediakan banyak library sehingga memungkinkan mengembangkan aplikasi dengan
lebih cepat. Salah satu keunggulan CI dibanding framework lain adalah kesederhanaan
penggunaannya dan kecepatan eksekusinya.
CodeIgniter ( C I ) adalah sebuah kerangka (framework) pembangunan aplikasi atau
mudahnya disebut toolkit, untuk developer yang akan membuat aplikasi web dengan PHP.
Tujuan CI adalah supaya pembangunan aplikasi lebih cepat dibanding menulis source code
dari awal, karena CI telah meyediakan banyak library untuk proses-proses yang sering
digunakan pada suatu aplikasi, dan juga dengan kemudahan dalam menggunakan library
tersebut serta kesederhaan penggunaannya.
CodeIgniter ditulis (dibuat) oleh Rick Ellis, seorang musisi rock yang menjadi
programmer. Ia membangun perusahaan bernama Ellis Lab, yang mengembangkan
beberapa produk unggulan salah satunya CodeIgniter.
CodeIgniter cocok untuk developer yang:
a. Menginginkan framework yang sederhana.
b. Membutuhkan kinerja yang luar biasa.
c. Membutuhkan kompatibilitas yang luas dengan berbagai web hosting.
d. Menginginkan framework yang hampir tidak ada konfigurasi.
e. Menginginkan framework yang tidak menggunakan command line.
f. Menginginkan framework yang tidak mengharuskan mematuhi aturan penulisan source
code.
g. Tidak ingin dipaksa harus mempelajari templating language.
h. Tidak menyukai kompleksitas, lebih menyukai solusi yang sederhana.
i. Membutuhkan dokumentasi yang baik
A dapun Keunggulan CodeIgniter:
a. Gratis.
Modify by dedih
FASILKOM UNSIKA
b. Ringan.
Inti sistem CI hanya membutuhkan sangat sedikit library, hal ini merupakan perbedaan
kontras dengan framework lain. Library lainnya dapat digunakan dinamis berdasarkan
kebutuhan.
c. Cepat. Sampai saat ini CI masih diakui sebagai framework yang paling cepat.
d. Menggunakan Konsep MVC.
e. Clean URL.
URL yang digunakan CI bersifat search-engine friendly. Menggunakan pendekatan
segment-based.
f. Library yang lengkap.
g. Dapat diperluas.
Developer dapat dengan mudah mengembangkan (extend) library, helper atau bahkan
perluasan class inti CI.
h. Dukungan teknis yang lengkap di forum CI.
1.2 Alur Proses CodeIgniter
Gambar 1.1 Alur proses codeIgniter

Gambar di atas mengilustrasikan alur proses data pada CI:
1. Index.php berfungsi sebagai pengendali awal, menginisialisasi sumber daya utama
yang dibutuhkan CodeIgniter.
2. Router memeriksa paket HTTP request untuk menentukan aksi apa yang harus
dilakukan oleh sistem. Jika tersedia, maka halaman langsung dikirim ke browser,
eksekusi sistem yang normal akan dilewati.
Modify by dedih
FASILKOM UNSIKA
3. Security. Sebelum Application Controller dieksekusi, paket HTTP request dan semua
data yang dikirimkan pengguna akan disaring terlebih dahulu oleh Security Class.
4. Application Controller menginisialisasi model, library utama, helpers dan semua
sumberdaya yang dibutuhkan untuk setiap request.
5. Antarmuka aplikasi (view) yang sudah disiapkan dikirimkan ke browser. Jika caching
diaktifkan, maka view akan disimpan sementara untuk request yang sama
berikutnya.
1.3 Model, View, Controller, Libraries, Helper
Seperti framework PHP pada umumnya, CodeIgniter menggunakan konsep MVC serta
menyediakan banyak library dan helper untuk digunakan. Berikut penjelasan mengenai
model, view, controller, library dan helper.
1. Model, merepresentasikan struktur data. Biasanya class model akan berisi fungsifungsi untuk mengambil data, insert data, dan update data ke database. Pada CI,
model tidak harus digunakan, tapi hal ini akan menghilangkan konsep MVC itu
sendiri.
2. View, adalah informasi / halaman yang ditampilkan ke pengguna. Sebuah view
biasanya adalah sebuah web page, tapi di CodeIgniter view juga dapat berupa
bagian-bagian halaman web, seperti header dan footer. Bahkan view juga dapat
berupa halaman RSS.
3. Controller, berfungsi sebagai penghubung antara Model, View dan dengan sumber
daya lain yang digunakan untuk memproses HTTP request. Controller juga biasanya
berfungsi sebagai inti pemrosesan lojik aplikasi.
4. Libraries, adalah macam-macam class yang masing-masing mempunyai fungsi
khusus yang dapat digunakan untuk mengembangkan aplikasi. Contoh library
database, email, validasi form, dan lain-lain.
Modify by dedih
FASILKOM UNSIKA
5. Helper, seperti namanya berfungsi menolong untuk melakukan tugas-tugas tertentu.

Setiap file helper terdiri dari kumpulan fungsi (function). Contoh URL Helper yang
berfungsi untuk membuat link, Form helper untuk membuat elemen-elemen form.
Tidak seperti library, helper tidak menggunakan format Object Oriented, sehingga
dapat digunakan dimanapun, baik itu di model, view, controller dan library.
Modify by dedih
FASILKOM UNSIKA
MODUL 2
KEBUTUHAN SISTEM & INSTALASI CODEIGNITER
2.1 Kebutuhan Sistem

Untuk membangun aplikasi web yang menggunakan CodeIgniter tentunya kita
membutuhkan bahasa pemrograman PHP4 atau PHP5. Setelah PHP4 atau PHP5 terpenuhi,
kita dapat menggunakan berbagai alat yang sudah dikenal luas. Alat alat tersebut terbagi
kedalam beberapa kategori yang akan menangani perannya masing masing. Berikut adalah
alat alat dasar yang dapat digunakan untuk membangun aplikasi web menggunakan
CodeIgniter:
1. Text Editor, digunakan untuk menulis source code PHP dan lainnya serta untuk
menyunting file konfigurasi. Sebagai contoh, Notepad++, Sublime Text, Geany, Kate,
Komodo Edit,Aksi IDE, Netbeans
2. Web Server, agar aplikasi web yang dibangun dapat diakses oleh pengguna. Sebagai
contohApache, Lighttpd, IIS, Nginx
3. Database Management System, menyimpan informasi yang dibutuhkan oleh aplikasi
yang dibangun. Sebagai contoh MySQL, SQLite3, MS-SQL Server, Oracle, PostgreSQL
4. Internet Browser, digunakan untuk menampilkan aplikasi dan berinteraksi dengan
antarmukanya. Sebagai contoh, Internet Explorer, Opera, Google Chrome, Mozilla
Firefox
5. Mail Server, memberikan layanan e-mail kepada user dan mengintegrasikannya dengan
aplikasi web yang akan dibangun. Sebagai contoh, SquirrelMail, ArgoSoft, RoundCube,
GMaild
6. PDF Creator, digunakan untuk menghasilkan file dalam bentuk PDF. Sebagai contoh,
7. PDFLib, FPDF,
8. Database Browser, digunakan untuk melihat database secara grafikal. Sebagai contoh,
PHPMyAdmin, MySQLBrowser, Chive, SQLite3 Manager, PgAdmin, SQL Server Browser,
Oracle Apex
9. Sistem Operasi, landasan untuk mengembangkan aplikasi web sebelum diluncurkan di
server. Sebagai contoh, Windows 7, Windows XP, Ubuntu, Fedora, Slackware, BlankOn.
Modify by dedih
FASILKOM UNSIKA
2.2 Instalasi Codeigniter

Tentunya untuk membuat aplikasi web dengan CodeIgniter, kita harus mengenal cara
instalasinya terlebih dahulu. Berikut adalah cara untuk instalasi CodeIgniter di Windows 7:
1. unduh CodeIgniter dari link berikut : http://ellislab.com/codeigniter/download
2. kemudian ekstrak bundelan CodeIgniter_2.1.4 di tempat unduhan Anda
3. copy hasil ekstraksi ke folder C:/xampp/htdocs atau direktori xampp di mesin Anda
ubah namanya menjadi ci214
4. nyalakan Apache (web server) dan MySQL (database management relationship)
melalui XAMPP Control Panelakses direktori tersebut lewat browser dengan URL :
http://localhost/ci214
5. Jika berhasil akan muncul tampilan seperti berikut:
Gambar 2.1 Tampilan awal codeigniter
Modify by dedih
FASILKOM UNSIKA
2.3 Struktur folder CodeIgniter

Di CodeIgniter terdapat hirarki yang dikepalai oleh tiga folder utama, yaitu :
application, system, dan user_guide. Folder application adalah tempat dimana programmer
aplikasi web yang menggunakan CodeIgniter, akan menyusun aplikasinya. Berikut akan
dibahas fungsi masing-masing folder dan file default dari CodeIgniter. Dimulai dari root
direktori kerja Anda.
Gambar 2.2 Direktori codeigniter

1. Application, berisi folder dan file yang terkait dengan aplikasi yang akan dibuat. Kita
akan banyak bekerja pada direktori application ini.
2. System, berisi file-file inti framework CodeIgniter. Kita tidak akan mengubah apapun
pada direktori system ini.
3. User_guide, berisi file-file dokumentasi CI yang dapat diakses melalui browser.
4. Index.php, file konfigurasi awal CodeIgniter.
Dalam folder aplication terdapat sub folder sebagai berikut :
Gambar 2.2 Sub direktori application

Modify by dedih
FASILKOM UNSIKA
Sedangkan dalam direktori system terdapat folder sbb:
Gambar 2.2 Sub direktori system
2.4 Mengatur Configurasi pada CodeIgniter

setiap pembangunan aplikasi tentunya diperlukan beberapa konfigurasi tambahan
yang mendukung aplikasi tersebut, misalnya konfigurasi error_reporting, database, security,
dan controller default aplikasi. Berikut akan dijelaskan beberapa file konfigurasi minimal
untuk mulai membangun aplikasi (silahkan buka masing-masing file yang ada di penjelasan
berikut ini):
a. Index.php. Sebenarnya pada tahap development tidak ada konfigurasi yang diubah pada
file ini, tapi jika aplikasi akan di-publish / deploy maka error reporting harus dimatikan,
silahkan lihat di baris 21 ada konfigurasi ENVIRONMENT. Default-nya terdapat 3 nilai
konstanta ENVIRONMENT, yaitu development, testing, dan production. Setiap nilai
tersebut berpengaruh pada error_reporting aplikasi. Selain ENVIRONMENT, pada file
index.php juga terdapat beberapa konfigurasi lain seperti nama direktori application dan
system, ekstensi file aplikasi yang bisa diubah sesuai kebutuhan.
Selanjutnya buka direktori application/config/
b. Autoload.php, pada file ini didefinisikan apa saja yang harus dipanggil otomatis oleh CI
tanpa harus dideklarasikan disetiap fitur aplikasi. Yang dapat otomatis dipanggil adalah:
1). Packages
2). Libraries
3). Helper
4). Custom config, jika Anda membuat file konfigurasi diluar file default CodeIgniter.
Modify by dedih
FASILKOM UNSIKA
5). Language
6). Model.
Kita dapat mendefinisikan ap asaja yang harus dipanggil otomatis oleh CI sesuai
kebutuhan, misalnya library session, database, security, helper form dan url.
c. Config.php, pada file ini didefinisikan macam-macam konfigurasi utama aplikasi.
Diantaranya yang biasanya kita ubah pada setiap project adalah:
1. Base url, berfungsi sebagai URL utama aplikasi yang dibangun. Jika tidak didefinisikan
CI akan mendeteksi otomatis URL dan Domain yang dipakai aplikasi. Pada modul 1 ini
silahkan isi dengan URL kerja Anda atau biarkan kosong tidak masalah.
2. Index page, jika file index diganti namanya maka sesuaikan konfigurasi ini, jika
index.php dihilangkan dari URL menggunakan .htaccess maka kosongkan nilai
$config[index_page].
3. Url suffix, jika ingin menambahkan akhiran ekstensi file di URL. Misal
example.com/news/show/231.html
4. Language, bahasa yang akan digunakan pada aplikasi. Kita dapat merubah atau
membuat bahasa sendiri untuk sistem CI pada direktori root: system/language/.
5. Encryption key, jika aplikasi menggunakan session, maka $config[encryption_key]
harus didefinisikan. Pada modul 1 ini kita tidak menggunakan session.
6. Session, konfigurasi untuk session:
6).1. [sess_cookie_name] : nama cookie aplikasi yang dibangun, bisa diubah.
6).2. [sess_expiration] : waktu kadaluarsa session, satuannya detik.
6).3. [sess_expire_on_close] : jika bernilai TRUE, maka session expire ketika
browser ditutup.
6).4. [sess_encrypt_cookie] : beri nilai TRUE jika cookie ingin dienkripsi.
6).5. [sess_use_database] : beri nilai TRUE jika ingin menggunakan database untuk
menyimpan data session.
6).6. [sess_table_name] : nama table penyimpanan data session, bisa diubah.
6).7. [sess_match_ip] : beri nilai TRUE jika ingin membanding IP address setiap
membaca data session.
Modify by dedih
FASILKOM UNSIKA
6).8. [sess_match_useragent] : beri nilai TRUE untuk membandingkan browser

pengguna setiap membaca data session.
6).9. [sess_time_to_update] : waktu (dalam detik) CI harus memperbaharui data
session yang disimpannya.
7. XSS Filtering, mendefinisikan apakah setiap data yang dikirimkan oleh browser /
pengguna (POST, GET, COOKIE) diperiksa dulu dari bahaya hacking metode XSS
(Cross Site Scripting).
Sebaiknya nilai $config[global_xss_filtering] bernilai TRUE.
8. CSRF Protection, mendefinisikan apakah setiap data yang dikirimkan melalui form
masih masuk waktu SESSION atau tidak dan memastikan bahwa data dikirimkan oleh
browser yang mengakses halaman web tersebut, jika tidak maka data akan ditolak.
Konfigurasi ini untuk menghindari bahaya hacking metode Cross Site Request
Forgery.
Sebaiknya nilai $config[csrf_protection] bernilai TRUE.
d. Database.php, pada file ini mendefinisikan parameter-parameter yang dibutuhkan untuk
koneksi ke database. CodeIgniter mendukung koneksi ke beberapa produk DBMS, bahkan
mendukung koneksi ke beberapa database dan DBMS sekaligus pada satu aplikasi. Berikut
penjelasan beberapa konfigurasi:
1). Active group, isikan nama konfigurasi database default yang digunakan.
2). Active record, jika bernilai TRUE, maka fasilitas Active Records CI dapat digunakan.
Active Record membantu membuat query yang akan support multi DBMS.
3). Hostname, isikan alamat IP atau hostname database server.
4). Username, isikan username yang dipakai untuk login ke database.
5). Password, isikan password yang dipakai untuk login ke database.
6). Database, isikan nama database yang dipakai aplikasi.
7). DB Driver, isikan tipe driver DBMS yang dipakai aplikasi. Driver DMBS yang
terkoneksi dengan CI saat ini : mysql, mysqli, postgre, odbc, mssql, sqllite, oci8.
8). P Connect, isikan nilai TRUE jika ingin koneksi ke database server tetap terhubung
untuk beberapa waktu sejak eksekusi query terakhir (Persistent Connection). Cukup
Modify by dedih
10
FASILKOM UNSIKA
membantu agar proses aplikasi lebih cepat, dibandingkan harus menjalin koneksi ke
database setiap akan eksekusi query.
9). DB Debug, isikan nilai TRUE jika ingin error koneksi atau error query ditampilkan.
Sangat membantu pada proses development. Jika aplikasi akan di-publish / deploy
maka nilai [db_debug] sebaiknya FALSE.
e. Routes.php, pada file ini didefinisikan beberapa URL yang spesifik mengacu ke controller
yang spesifik pula sesuai kebutuhan aplikasi. Pada file ini juga dapat didefinisikan default
controller yang akan dipanggil jika tidak didefinisikan pada URL. Itulah mengapa tanpa
konfigurasi awal halaman pembuka CI bisa tampil seperti di Gambar B.2.2, karena
$route[default_controller] diisi controller welcome.
Modify by dedih
11
FASILKOM UNSIKA
MODUL 3
PROJECT CI PERTAMA
3.1 Membuat Program Selamat Belajar Web 2

Perhatikan tampilan output program di bawah ini :
Adapun langkah- langkah yang harus dilakukan adalah :

1. Bukalah program teks editor misalkan notepad++ selanjutnya file >open
http://localhost/ci214/application/views/welcome.php
dan ubahlah program seperti berikut ini :
Modify by dedih
12
FASILKOM UNSIKA
Ini yg dirubah
Ini yg dirubah
2. Sesudah itu simpanlah file dengan perintah file>save

3. Lalu buka browser dan ketikan alamat http://localhost/ci214/
Sehingga tampilan seperti gambar 3.1 di atas.
3.2 Mengakses Database dengan CodeIgniter
Untuk dapat mengakses database kita harus membuat terlebih dahulu database
dengan xampp dan panggil programnya dari browser dengan alamat localhost/phpmyadmin
selanjutnya sebagai berikut :
1. create database dengan nama dbsiswa selanjutnya buat tabel dengan nama siswa
yang mepunyai dua record yaitu nis (varchar 7) dan nama (varchar 50) seperti
tampak pada gambar berikut ini :
Modify by dedih
13
FASILKOM UNSIKA
2. Buatlah skrip Controller bernama siswa.php di application/controllers
Penjelasan skrip :
Baris 2,
mendefinisikan class controller siswa, class siswa meng-extend class
CI_Controller. class CI_Controller sendiri merupakan native class untuk controller

Codeigniter.
Baris 4-9, membuat method/ fungsi index().
Baris 5, memanggil class model bernama Siswa_model, kemudian memberikan nama
alias siswa untuk model tersebut.
Baris 6, mendefenisikan variabel bertipe array bernama $data[siswa], isinya adalah
hasil eksekusi method cari_semua() milik class siswa_model.
Baris 7, memanggil view siswa_view dan melewatkan variabel $data bersamanya,
variabel $data berisi data siswayang akan ditampilkan di view
3. Buatlah skrip program model bernama siswa_model.php di application/models
Modify by dedih
14
FASILKOM UNSIKA
Penjelasan skrip :
Baris 2, mendefinisikan clas Model bernama Siswa_model. Kelas ini meng-extend clas
CI_model yang merupakan native class Model CodeIgniter.
Baris 3, membuat method cari semua() yang bertugas mendapatkan semua data
siswa dari database.
Baris 5, memanggil library database codeigniter
Baris 6, memdapatkan data tabel siswa menggunakan metode get().
4. Langkah berikutnya , buatlah file view bernama siswa_view.php , kemudian simpanlah di
application/views/siswa_view.php
Modify by dedih
15
FASILKOM UNSIKA
Penjelasan skrip :
File siswa_view.php digunakan untuk menampilkan data siswa
Baris 9-13, dengan menggunakan perintah foreach akan mengekstrak array $siswa
kemudian menampilkan dengan perintah echo.
5. Bukalah file application/config/database.php, lalu lakukan pengaturan :

$db['default']['hostname'] = 'localhost';
$db['default']['username'] = 'root';
$db['default']['password'] = '';
$db['default']['database'] = 'dbsiswa';
6. Buka file application/config/config.php, lalu lakukan pengaturan :
$config['base_url']
= 'http://localhost/ci214';
7. Untuk melihat hasil program maka kita ketikan http://localhost/ci214/siswa pada browser
sehingga akan tampil keluaran sebagai berikut ;
Modify by dedih
16
FASILKOM UNSIKA
MODUL 4
STUDI KASUS PROGRAM ABSENSI SISWA
4.1 Membuat Database
Pada modul ini kita akan memcoba untuk membuat program absensi siswa yang
dipakai untuk membantu mencatat kehadiran siswa. Dimana tujuan akhirnya untuk
menghasilkan laporan ketidakhadiran siswa untuk setiap kelas.
Pertama-tama kita buat folder absensi2014 di htdocs atau di www untuk sistem
operasi linux lalu install codeigniter tempatkan pada folder absensi2014. Selanjutnya kita
membuat database dengan nama db_absensi2014 dengan mysql selanjutnya buatlah 5
buah tabel yaitu user, kelas, siswa, semester dan absen. Adapun rancangan struktur
tabelnya terlihat seperti berikut :
Tabel user
Field
Type
Lenght
Id_user
INT
usename
VARCHAR
32
password
VARCHAR
32
Index
PRIMARY
Tabel kelas
Field
Type
Lenght
Id_kelas
INT
kelas
VARCHAR
32
Index
PRIMARY
Tabel siswa
Field
Type
Lenght
nis
VARCHAR
nama
VARCHAR
50
Id_kelas
INT
Modify by dedih
Index
PRIMARY
17
FASILKOM UNSIKA
Tabel Semester
Field
Type
Lenght
Id_semester
INT
status
ENUM
Y,N
Index
PRIMARY
Tabel Absen
Field
Type
Lenght
Id_absen
INT
11
nis
VARCHAR
Id_semester
INT
Tanggal
DATE
absen
VARCHAR
Index
PRIMARY
4.2 Mengatur Konfigurasi(config.php)

Bukalah file application/config/config.php, lalu lakukan konfigurasinya sebagai
berikut ;
$config['base_url']
= 'http://localhost/absensi2014/';
$config['index_page'] = '';
$config['language']
= 'bahasa_indonesia';
4.3 Membuat file .htaccess

Sebelumnya anda telah menghapus file .htaccess yang ada. Lalu buatlah file .htaccess
kemudian simpanlah pada folder absensi2014 berikut skrip kodenya :
RewriteEngine on
RewriteCond $1 !^(index\.php|images|js|css|favicon\.png)
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ ./index.php/$1 [L]
Modify by dedih
18
FASILKOM UNSIKA
4.4 Mengatur Database (database.php)

Bukalah file application/config/database.php, lalu lakukan konfigurasinya sebagai
berikut ;
$active_group = 'default';
$active_record = TRUE;
$db['default']['hostname'] = 'localhost';
$db['default']['username'] = 'root';
$db['default']['password'] = '';
$db['default']['database'] = 'db_absensi2014';
4.5 Mengatur Auto-Loading(autoload.php)

Bukalah file application/config/autoload.php, lalu lakukan konfigurasinya sebagai
berikut ;
$autoload['libraries'] = array('session', 'database', 'form_validation');
$autoload['helper'] = array('url', 'form');
4.6 Mengatur Route (routes.php)
Bukalah file application/config/route.php, lalu lakukan konfigurasinya sebagai berikut
:
// $route['default_controller'] = "welcome";
$route['default_controller'] = "login";
//$route['404_override'] = '';
$route['404_override'] = 'error404';
// Siswa Paging
$route['siswa/halaman'] = "siswa/index";
$route['siswa/halaman/(:num)'] = "siswa/index/$1";
// Absen Paging
$route['absen/halaman'] = "absen/index";
$route['absen/halaman/(:num)'] = "absen/index/$1";
Modify by dedih
19
FASILKOM UNSIKA
$route['logout'] = "login/logout";
4.7 Membuat File Bahasa Indonesia
Kita perlu untuk membuat file berbahasa indonesia. Copylah folder english yang ada di
system/language, kemudian paste sembarang tempat, kemudian rename hasil copy tadi
menjadi bahasa_indonesia, lalu cut folder bahasa_indonesia ke application/language
sehingga tampak seperti gambar berikut :
Gambar 4.1 Membuat folder bahasa indonesia

Buka
file
form_validation_lang.php
pada
folder
application/language/bahasa_indonesia kemudian ubah menjadi :

<?php
$lang['required']
= "Field %s harus diisi.";
$lang['isset']
= "Field %s harus memiliki nilai.";
$lang['valid_email']
= "Field %s harus berisi format e-mail yang benar.";
$lang['valid_emails']
= "Field %s harus berisi format e-mail yang benar.";
$lang['valid_url']
= "Field %s harus berisi format URL yang benar.";
$lang['valid_ip']
= "Field %s harus berisi format IP yang benar.";
$lang['min_length']
= "Field %s minimal %s karakter.";
$lang['max_length']
= "Field %s maksimal %s karakter.";
$lang['exact_length']
= "Field %s harus tepat %s karakter.";
$lang['alpha']
= "Field %s harus berisi alphabet.";
Modify by dedih
20
FASILKOM UNSIKA
$lang['alpha_numeric']
= "Field %s harus berisi alpha-numeric.";
$lang['alpha_dash']
dashes.";
= "Field %s harus berisi alpha-numeric, underscores,
$lang['numeric']
= "Field %s hanya boleh berisi bilangan.";
$lang['is_numeric']
= "Field %s hanya boleh berisi karakter angka.";
$lang['integer']
= "Field %s harus berisi integer.";
$lang['regex_match']
= "Field %s harus berisi format yang benar.";
$lang['matches']
= "Field %s tidak sesuai dengan field %s.";
$lang['is_unique']
= "Field %s berisi data yang sama dengan database.";
$lang['is_natural']
= "Field %s harus berisi bilangan positif.";
$lang['is_natural_no_zero']
= "Field %s harus berisi bilangan > 0.";
$lang['decimal']
= "Field %s harus berisi bilangan desimal.";
$lang['less_than']
= "Field %s harus berisi bilangan < %s.";
$lang['greater_than']
= "Field %s harus berisi bilangan > %s.";
/* End of file form_validation_lang.php */

/* Location: ./application/language/indonesia/form_validation_lang.php */
4.8 Membuat Status Login (MY_Controller.php)

Buatlah file MY_Controller.php lalu simpan pada folder application/core adapun skrip
programnya sbb:
<?php if (!defined('BASEPATH')) exit('No direct script access allowed');
class MY_Controller extends CI_Controller
{
public function __construct()
{
parent::__construct();
session_start();
// cek status login user
if ($this->session->userdata('login') == FALSE)
{
redirect('login');
Modify by dedih
21
FASILKOM UNSIKA
}
/* End of file MY_Controller.php */
/* Location: ./application/core/MY_Controller.php */
4.9 Membuat Controller Error (error404.php)
Buatlah file error404.php lalu simpan pada folder application/controller adapun skrip
programnya sbb:
<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');
class Error404 extends CI_Controller {
{
}
public function index()
{
$this->load->view('view404');
}
}
4.10 Membuat View Error (view404.php)
Buatlah file view404.php lalu simpan pada folder application/views adapun skrip
programnya sbb:
<!DOCTYPE
html
PUBLIC
"-//W3C//DTD
XHTML
1.0
Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
/>
<link rel="shortcut icon" href="<?php echo base_url('asset/images/favicon.png');?>"
<link
rel="stylesheet"
base_url('asset/css/reset.css');?>" />
<link
rel="stylesheet"
base_url('asset/css/style.css');?>" />
type="text/css"
href="<?php
echo
type="text/css"
href="<?php
echo
<title>Error 404: Halaman Tidak Ditemukan.</title>

</head>
Modify by dedih
22
FASILKOM UNSIKA
<body>
<div id="masthead">
<?php $this->load->view('masthead'); ?>
</div>
<div id="main">
<h2 id="error_header" class="error_header">Error 404</h2>
<p class="error_content">Halaman Tidak Ditemukan.</p>
<?php echo 'Kembali ke ' . anchor(base_url(),'halaman utama'); ?>
</div>
<div id="footer">
<?php $this->load->view('footer'); ?>
</div>
</body>
</html>
4.11 Membuat Layout Halaman

HEADER
NAVIGASI
MAIN CONTENT
FOOTER
Gambar 4.2 Sketsa gambar layout
Modify by dedih
23
FASILKOM UNSIKA
HEADER
Absen
Rekap
Siswa
Kelas
Logout
Absen
Message
<< Fist 1 2 3 4 5 Last >>
FOOTER
Gambar 4.3 Main content berisi tampilan data

HEADER
Absen
Rekap
Siswa
Kelas
Logout
Siswa > Add

Message
NIS :
Nama :
Kelas :
FOOTER
Gambar 4.4 Main content berisi form
Modify by dedih
24
FASILKOM UNSIKA
4.11.1 Membuat Template(template.php)

Buatlah
sebuah
file
bernama
template.php
simpan
pada
folder
application/views/template.php dengan skrip program sebagai berikut :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
<head>
/>
<link rel="shortcut icon" href="<?php echo base_url('asset/images/favicon.png');?>"
<link rel="stylesheet" type="text/css" href="<?php echo

base_url('asset/css/style.css');?>" />
base_url('asset/css/calendar.css');?>" />
<script type="text/javascript" src="<?php echo base_url('asset/js/calendar.js');
?>"></script>
<title><?php echo isset($breadcrumb) ? $breadcrumb : ''; ?></title>
</head>
<body id="<?php echo isset($modul) ? $modul : ''; ?>">
<div id="masthead">
<?php $this->load->view('masthead'); ?>
</div>
<div id="navigation">
<?php $this->load->view('navigation'); ?>
</div>
<div id="main">
<?php $this->load->view($main_view); ?>
</div>
<div id="footer">
<?php $this->load->view('footer'); ?>
</div>
</body>
</html>
Modify by dedih
25
FASILKOM UNSIKA
4.11.2 Membuat Header(masthead.php)

Buatlah
sebuah
file
bernama
masthead.php
simpan
pada
folder
simpan
pada
folder
application/views/ dengan skrip program sebagai berikut :

<h1>Program Absensi SMA Abu-abu</h1>
4.11.3 Membuat Navigasi(navigation.php)

Buatlah
sebuah
file
bernama
navigation.php
application/views/ dengan skrip program sebagai berikut :

<ul id="menu_tab">
<li id="tab_absen"><?php echo anchor('absen', 'Absen');?></li>
<li id="tab_rekap"><?php echo anchor('rekap', 'Rekap');?></li>
<li id="tab_siswa"><?php echo anchor('siswa', 'Siswa');?></li>
<li id="tab_semester"><?php echo anchor('semester', 'Semester');?></li>
<li id="tab_kelas"><?php echo anchor('kelas', 'Kelas');?></li>
<li id="tab_logout"><?php echo anchor('logout', 'Logout', array('onclick' =>
"return confirm('Anda yakin akan logout?')"));?></li>
</ul>
4.11.4 Membuat Footer(footer.php)
Buatlah sebuah file bernama footer.php simpan pada folder application/views/
dengan skrip program sebagai berikut :
Copyright ©2014 SMA Abu-abu<br />
sma_abu_abu@yahoo.com
4.12 Asset (CSS, Javascript, images)

Buatlah folder bernama asset di folder absensi2014. Kemudian buatlah 3 folder di
dalam folder tersebut, beri nama css, images, dan js. Lihat gambar berikut :
Modify by dedih
26
FASILKOM UNSIKA
Gambar 4.5 folder asset terdiri dari folder css, images dan js
Folder tersebut akan digunakan untuk menyimpan file css, javascript dan gambar yang
dibutuhkan pada program absensi2014.
1. Pada folder css terdapat empat buah file, yaitu :
a. Reset.css berfungsi untuk mereset style default dari browser sehingga tampilan
program absensi siswa relatif seragam untuk semua browser. Buatlah file bernama
reset.css dan simpanlah pada folder absensi2014/asset/ . dengan sript program
sebagai berikut :
/**
* -------------------------------------------------------------* CSS style aplikasi Absensi2014
* untuk pop-up datepicker
* -------------------------------------------------------------*/
/* the div that holds the date picker calendar */
.dpDiv {
}
/* the table (within the div) that holds the date picker calendar */
.dpTable {
font-family: Verdana;
font-size: 9px;
text-align: center;
Modify by dedih
27
FASILKOM UNSIKA
color: #000000;
background-color: #F9E9A9;
border: 1px solid #FFCB2D;
}
/* a table row that holds date numbers (either blank or 1-31) */
.dpTR {
}
/* the top table row that holds the month, year, and forward /
backward buttons */
.dpTitleTR { }
/* the second table row, that holds the names of days of the week
(Mo, Tu, We, etc.) */
.dpDayTR { }
/* the bottom table row, that has the "This Month" and "Close"
buttons */
.dpTodayButtonTR { }
/* a table cell that holds a date number (either blank or 1-31) */
.dpTD {
border: 1px solid #ffffff;
}
/* a table cell that holds a highlighted day (usually either
today's date or the current date field value) */
.dpDayHighlightTD {
background-color: #CCCCCC;
border: 1px solid #AAAAAA;
}
/* the date number table cell that the mouse pointer is currently
over (you can use contrasting colors to make it apparent which
cell is being hovered over) */
.dpTDHover {
cursor: pointer;
}
/* the table cell that holds the name of the month and the year */
.dpTitleTD { }
/* a table cell that holds one of the forward/backward buttons */
.dpButtonTD { }
/* the table cell that holds the "This Month" or "Close" button
Modify by dedih
28
FASILKOM UNSIKA
at the bottom */
.dpTodayButtonTD { }
/* a table cell that holds the names of days of the week
.dpDayTD {
background-color: #FFCB2D;
color: #000000;
}
/* additional style information for the text that indicates the
month and year */
.dpTitleText {
font-size: 12px;
color: #000000;
font-weight: bold;
}
/* additional style information for the cell that holds a
highlighted day (usually either today's date or the current
date field value) */
.dpDayHighlight {
color: #000000;
font-weight: bold;
}
/* the forward/backward buttons at the top */
.dpButton, .dpTodayButton {
font-size: 10px;
color: #000000;
background: #FFCB2D;
font-weight: bold;
padding: 0px;
border:0px;
}
b. Style.css berfungsi untuk mengatur tampilan semua halaman kecuali login. Buatlah
file bernama style.css dan simpanlah pada folder absensi2014/asset/ . dengan sript
program sebagai berikut :
$config['base_url'] = 'http://localhost/ci214';
$config['index_page'] = '';
Modify by dedih
29
FASILKOM UNSIKA
$config['uri_protocol']
= 'AUTO';
$config['url_suffix'] = '';
$config['language'] = 'english';
$config['charset'] = 'UTF-8';
$config['enable_hooks'] = FALSE;
$config['subclass_prefix'] = 'MY_';
$config['permitted_uri_chars'] = 'a-z 0-9~%.:_\-';
$config['allow_get_array']
= TRUE;
$config['enable_query_strings'] = FALSE;
$config['controller_trigger']
= 'c';
$config['function_trigger']
= 'm';
$config['directory_trigger'] = 'd'; // experimental not currently in use
$config['log_threshold'] = 0;
$config['log_path'] = '';
$config['log_date_format'] = 'Y-m-d H:i:s';
$config['cache_path'] = '';
$config['encryption_key'] = '';
$config['sess_cookie_name']
= 'ci_session';
$config['sess_expiration']
= 7200;
$config['sess_expire_on_close'] = FALSE;
$config['sess_encrypt_cookie']
= FALSE;
$config['sess_use_database']
= FALSE;
$config['sess_table_name']
= 'ci_sessions';
$config['sess_match_ip']
= FALSE;
$config['sess_match_useragent'] = TRUE;
$config['sess_time_to_update'] = 300;
$config['cookie_prefix']
= "";
$config['cookie_domain'] = "";
$config['cookie_path']
= "/";
$config['cookie_secure'] = FALSE;
$config['global_xss_filtering'] = FALSE;
$config['csrf_protection'] = FALSE;
$config['csrf_token_name'] = 'csrf_test_name';
$config['csrf_cookie_name'] = 'csrf_cookie_name';
$config['csrf_expire'] = 7200;
$config['compress_output'] = FALSE;
$config['time_reference'] = 'local';
$config['rewrite_short_tags'] = FALSE;
$config['proxy_ips'] = '';
/* End of file config.php */
/* Location: ./application/config/config.php */
Modify by dedih
30
FASILKOM UNSIKA
c. Login.css berfungsi khusus untuk mengatur tampilan halaman. Buatlah file

bernama login.css dan simpanlah pada folder absensi2014/asset/ . dengan sript
program sebagai berikut :
/**
* untuk halaman login
* -------------------------------------------------------------*/
#login_box {
position:absolute;
top: 50%;
left: 50%;
width:26em;
height:16em;
margin-top: -8em; /*set to a negative number 1/2 of your height*/
margin-left: -13em; /*set to a negative number 1/2 of your width*/
border: 1px solid #7F5F00;
background-color: #f3f3f3;
}
h1{
background-color:#FFCB2D;
border-bottom:1px solid #7F5F00;
font-size:120%;
font-weight:bolder;
color:#7F5F00;
padding-top:1em;
padding-bottom:1em;
text-align:center;
#login_form{
padding:10px;
}
#login_form p label{
display:block;
float:left;
width:80px;
}
#login_form p{
margin-bottom:10px;
}
Modify by dedih
31
FASILKOM UNSIKA
#login_form p#message{
margin-left: 60px;
}
#submit{
padding:0 4px;
border:#666 solid 1px;
margin-left:80px;
}
#login_box .field_error, #login_box #message{
font-size:12px;
color:#F00;
}
#login_box #form_error_message{
margin-bottom:20px;
}
#login_box .field_error{
clear:both;
margin-left:80px;
}
.form_field{
border:#666 solid 1px;
}
.form_field:focus{
background-color:#F9E9A9;
}
d. Calender.css berfungsi mengatur tampilan kalendr pop-up yang ada pada modul
absen.
Buatlah
file
bernama
style.css
dan
simpanlah
pada
folder
absensi2014/asset/ . dengan sript program sebagai berikut :

/**
* untuk pop-up datepicker
* -------------------------------------------------------------*/
/* the div that holds the date picker calendar */
Modify by dedih
32
FASILKOM UNSIKA
.dpDiv {
}
/* the table (within the div) that holds the date picker calendar */
.dpTable {
font-size: 9px;
text-align: center;
color: #000000;
background-color: #F9E9A9;
}
/* a table row that holds date numbers (either blank or 1-31) */
.dpTR {
}
/* the top table row that holds the month, year, and forward /
backward buttons */
.dpTitleTR { }
/* the second table row, that holds the names of days of the week
.dpDayTR { }
/* the bottom table row, that has the "This Month" and "Close"
buttons */
.dpTodayButtonTR { }
/* a table cell that holds a date number (either blank or 1-31) */
.dpTD {
border: 1px solid #ffffff;
}
/* a table cell that holds a highlighted day (usually either
today's date or the current date field value) */
.dpDayHighlightTD {
background-color: #CCCCCC;
border: 1px solid #AAAAAA;
}
/* the date number table cell that the mouse pointer is currently
over (you can use contrasting colors to make it apparent which
cell is being hovered over) */
.dpTDHover {
cursor: pointer;
Modify by dedih
33
FASILKOM UNSIKA
}
/* the table cell that holds the name of the month and the year */
.dpTitleTD { }
/* a table cell that holds one of the forward/backward buttons */
.dpButtonTD { }
/* the table cell that holds the "This Month" or "Close" button
at the bottom */
.dpTodayButtonTD { }
/* a table cell that holds the names of days of the week
.dpDayTD {
background-color: #FFCB2D;
color: #000000;
}
/* additional style information for the text that indicates the
month and year */
.dpTitleText {
font-size: 12px;
color: #000000;
font-weight: bold;
}
/* additional style information for the cell that holds a
highlighted day (usually either today's date or the current
date field value) */
.dpDayHighlight {
color: #000000;
font-weight: bold;
}
/* the forward/backward buttons at the top */
.dpButton, .dpTodayButton {
font-size: 10px;
color: #000000;
background: #FFCB2D;
font-weight: bold;
padding: 0px;
border:0px;
}
Modify by dedih
34
FASILKOM UNSIKA
2. Pada folder images terdapat gambar-gambar yang dibutuhkan pada program aplikasi
absensi
3. Pada folder js terdapa file calender.js . buatlah file tersebut dan simpan pada folder
absensi2014/asset/js dengan skrip kode sbb:
var datePickerDivID = "datepicker";
var iFrameDivID = "datepickeriframe";
var dayArrayShort = new Array('Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat');
var dayArrayMed = new Array('Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat');
var dayArrayLong = new Array('Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday',
'Friday', 'Saturday');
var monthArrayShort = new Array('Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep',
'Oct', 'Nov', 'Dec');
var monthArrayMed = new Array('Jan', 'Feb', 'Mar', 'Apr', 'May', 'June', 'July', 'Aug',
'Sept', 'Oct', 'Nov', 'Dec');
var monthArrayLong = new Array('January', 'February', 'March', 'April', 'May', 'June',
'July', 'August', 'September', 'October', 'November', 'December');
var defaultDateSeparator = "-";
// common values would be "/" or "."
var defaultDateFormat = "dmy" // valid values are "mdy", "dmy", and "ymd"
var dateSeparator = defaultDateSeparator;
var dateFormat = defaultDateFormat;
function CopyText(SourceFeild, DestinationFeild) {
document.getElementsByName
(DestinationFeild).item(0).value
document.getElementsByName (SourceFeild).item(0).value;
}
function displayDatePicker(dateFieldName, displayBelowThisObject, dtFormat, dtSep)

{
var targetDateField = document.getElementsByName(dateFieldName).item(0);
// if we weren't told what node to display the datepicker beneath, just display it
// beneath the date field we're updating
if (!displayBelowThisObject)
displayBelowThisObject = targetDateField;
// if a date separator character was given, update the dateSeparator variable
if (dtSep)
dateSeparator = dtSep;
else
dateSeparator = defaultDateSeparator;
Modify by dedih
35
FASILKOM UNSIKA
// if a date format was given, update the dateFormat variable

if (dtFormat)
dateFormat = dtFormat;
else
dateFormat = defaultDateFormat;
var x = displayBelowThisObject.offsetLeft;
var y = displayBelowThisObject.offsetTop + displayBelowThisObject.offsetHeight ;
// deal with elements inside tables and such
var parent = displayBelowThisObject;
while (parent.offsetParent) {
parent = parent.offsetParent;
x += parent.offsetLeft;
y += parent.offsetTop ;
}
}
drawDatePicker(targetDateField, x, y);
function drawDatePicker(targetDateField, x, y)
{
var dt = getFieldDate(targetDateField.value);
// the datepicker table will be drawn inside of a <div> with an ID defined by the
// global datePickerDivID variable. If such a div doesn't yet exist on the HTML
// document we're working with, add one.
if (!document.getElementById(datePickerDivID)) {
// don't use innerHTML to update the body, because it can cause global variables
// that are currently pointing to objects on the page to have bad references
//document.body.innerHTML += "<div id='" + datePickerDivID +
class='dpDiv'></div>";
var newNode = document.createElement("div");
newNode.setAttribute("id", datePickerDivID);
newNode.setAttribute("class", "dpDiv");
newNode.setAttribute("style", "visibility: hidden;");
document.body.appendChild(newNode);
}
"'
// move the datepicker div to the proper x,y coordinate and toggle the visiblity
var pickerDiv = document.getElementById(datePickerDivID);
pickerDiv.style.position = "absolute";
pickerDiv.style.left = x + "px";
pickerDiv.style.top = y + "px";
pickerDiv.style.visibility = (pickerDiv.style.visibility == "visible" ? "hidden" : "visible");
pickerDiv.style.display = (pickerDiv.style.display == "block" ? "none" : "block");
Modify by dedih
36
FASILKOM UNSIKA
pickerDiv.style.zIndex = 10000;
// draw the datepicker table
refreshDatePicker(targetDateField.name,
dt.getDate());
}
dt.getFullYear(),
dt.getMonth(),
/**
This is the function that actually draws the datepicker calendar.
*/
function refreshDatePicker(dateFieldName, year, month, day)
{
// if no arguments are passed, use today's date; otherwise, month and year
// are required (if a day is passed, it will be highlighted later)
var thisDay = new Date();
if ((month >= 0) && (year > 0)) {
thisDay = new Date(year, month, 1);
} else {
day = thisDay.getDate();
thisDay.setDate(1);
}
// the calendar will be drawn as a table
// you can customize the table elements with a global CSS style sheet,
// or by hardcoding style and formatting elements below
var crlf = "\r\n";
var TABLE = "<table cols=7 class='dpTable'>" + crlf;
var xTABLE = "</table>" + crlf;
var TR = "<tr class='dpTR'>";
var TR_title = "<tr class='dpTitleTR'>";
var TR_days = "<tr class='dpDayTR'>";
var TR_todaybutton = "<tr class='dpTodayButtonTR'>";
var xTR = "</tr>" + crlf;
var TD = "<td nowrap class='dpTD' onMouseOut='this.className=\"dpTD\";'
onMouseOver=' this.className=\"dpTDHover\";' "; // leave this tag open, because
we'll be adding an onClick event
var TD_title = "<td nowrap colspan=5 class='dpTitleTD'>";
var TD_buttons = "<td nowrap class='dpButtonTD'>";
var TD_todaybutton = "<td nowrap colspan=7 class='dpTodayButtonTD'>";
var TD_days = "<td class='dpDayTD'>";
var
TD_selected
=
"<td
class='dpDayHighlightTD'
onMouseOut='this.className=\"dpDayHighlightTD\";'
onMouseOver='this.className=\"dpTDHover\";' ";
// leave this tag open, because
we'll be adding an onClick event
var xTD = "</td>" + crlf;
Modify by dedih
37
FASILKOM UNSIKA
var DIV_title = "<div class='dpTitleText'>";

var DIV_selected = "<div class='dpDayHighlight'>";
var xDIV = "</div>";
// start generating the code for the calendar table
var html = TABLE;
// this is the title bar, which displays the month and the buttons to
// go back to a previous month or forward to the next month
html += TR_title;
html += TD_buttons + getButtonCode(dateFieldName, thisDay, -1, "<") + xTD;
html += TD_title + DIV_title + monthArrayLong[ thisDay.getMonth()] + " " +
thisDay.getFullYear() + xDIV + xTD;
html += TD_buttons + getButtonCode(dateFieldName, thisDay, 1, ">") + xTD;
html += xTR;
// this is the row that indicates which day of the week we're on
html += TR_days;
for(i = 0; i < dayArrayMed.length; i++)
html += TD_days + dayArrayMed[i] + xTD;
html += xTR;
// now we'll start populating the table with days of the month
html += TR;
// first, the leading blanks
for (i = 0; i < thisDay.getDay(); i++)
html += TD + " " + xTD;
// now, the days of the month
do {
dayNum = thisDay.getDate();
TD_onclick = " onclick=\"updateDateField('" + dateFieldName + "', '" +
getDateString(thisDay) + "');\">";
if (dayNum == day)
html += TD_selected + TD_onclick + DIV_selected + dayNum + xDIV + xTD;
else
html += TD + TD_onclick + dayNum + xTD;
// if this is a Saturday, start a new row
if (thisDay.getDay() == 6)
html += xTR + TR;
// increment the day
thisDay.setDate(thisDay.getDate() + 1);
} while (thisDay.getDate() > 1)
Modify by dedih
38
FASILKOM UNSIKA
// fill in any trailing blanks

if (thisDay.getDay() > 0) {
for (i = 6; i > thisDay.getDay(); i--)
html += TD + " " + xTD;
}
html += xTR;
// add a button to allow the user to easily return to today, or close the calendar
var today = new Date();
var todayString = "Today is " + dayArrayMed[today.getDay()] + ", " + monthArrayMed[
today.getMonth()] + " " + today.getDate();
html += TR_todaybutton + TD_todaybutton;
html += "<button class='dpTodayButton' onClick='refreshDatePicker(\"" +
dateFieldName + "\");'>This Month</button> ";
html += xTD + xTR;
// and finally, close the table
html += xTABLE;
document.getElementById(datePickerDivID).innerHTML = html;
// add an "iFrame shim" to allow the datepicker to display above selection lists
adjustiFrame();
/**
Convenience function for writing the code for the buttons that bring us back or forward
a month.
*/
function getButtonCode(dateFieldName, dateVal, adjust, label)
{
var newMonth = (dateVal.getMonth () + adjust) % 12;
var newYear = dateVal.getFullYear() + parseInt((dateVal.getMonth() + adjust) / 12);
if (newMonth < 0) {
newMonth += 12;
newYear += -1;
}
return "<button class='dpButton' onClick='refreshDatePicker(\"" + dateFieldName +
"\", " + newYear + ", " + newMonth + ");'>" + label + "</button>";
}
/**
Convert a JavaScript Date object to a string, based on the dateFormat and
dateSeparator
Modify by dedih
39
FASILKOM UNSIKA
variables at the beginning of this script library.

*/
function getDateString(dateVal)
{
var dayString = "00" + dateVal.getDate();
var monthString = "00" + (dateVal.getMonth()+1);
dayString = dayString.substring(dayString.length - 2);
monthString = monthString.substring(monthString.length - 2);
switch (dateFormat) {
case "dmy" :
return dayString + dateSeparator + monthString + dateSeparator +
dateVal.getFullYear();
case "ymd" :
return dateVal.getFullYear() + dateSeparator + monthString + dateSeparator +
dayString;
case "mdy" :
default :
return monthString + dateSeparator + dayString + dateSeparator +
dateVal.getFullYear();
}
}
/**
Convert a string to a JavaScript Date object.
*/
function getFieldDate(dateString)
{
var dateVal;
var dArray;
var d, m, y;
try {
dArray = splitDateString(dateString);
if (dArray) {
switch (dateFormat) {
case "dmy" :
d = parseInt(dArray[0], 10);
m = parseInt(dArray[1], 10) - 1;
y = parseInt(dArray[2], 10);
break;
case "ymd" :
break;
Modify by dedih
40
FASILKOM UNSIKA
case "mdy" :
default :
break;
}
dateVal = new Date(y, m, d);
} else if (dateString) {
dateVal = new Date(dateString);
} else {
dateVal = new Date();
}
} catch(e) {
dateVal = new Date();
}
}
return dateVal;
/**
Try to split a date string into an array of elements, using common date separators.
If the date is split, an array is returned; otherwise, we just return false.
*/
function splitDateString(dateString)
{
var dArray;
if (dateString.indexOf("/") >= 0)
dArray = dateString.split("/");
else if (dateString.indexOf(".") >= 0)
dArray = dateString.split(".");
else if (dateString.indexOf("-") >= 0)
dArray = dateString.split("-");
else if (dateString.indexOf("\\") >= 0)
dArray = dateString.split("\\");
else
dArray = false;
}
return dArray;
function updateDateField(dateFieldName, dateString)

{
var targetDateField = document.getElementsByName (dateFieldName).item(0);
if (dateString)
Modify by dedih
41
FASILKOM UNSIKA
targetDateField.value = dateString;
var pickerDiv = document.getElementById(datePickerDivID);
pickerDiv.style.visibility = "hidden";
pickerDiv.style.display = "none";
adjustiFrame();
targetDateField.focus();
// after the datepicker has closed, optionally run a user-defined function called
// datePickerClosed, passing the field that was just updated as a parameter
// (note that this will only run if the user actually selected a date from the datepicker)
if ((dateString) && (typeof(datePickerClosed) == "function"))
datePickerClosed(targetDateField);
function adjustiFrame(pickerDiv, iFrameDiv)

{
// we know that Opera doesn't like something about this, so if we
// think we're using Opera, don't even try
var is_opera = (navigator.userAgent.toLowerCase().indexOf("opera") != -1);
if (is_opera)
return;
// put a try/catch block around the whole thing, just in case
try {
if (!document.getElementById(iFrameDivID)) {
// don't use innerHTML to update the body, because it can cause global variables
// that are currently pointing to objects on the page to have bad references
//document.body.innerHTML += "<iframe id='" + iFrameDivID + "'
src='javascript:false;' scrolling='no' frameborder='0'>";
var newNode = document.createElement("iFrame");
newNode.setAttribute("id", iFrameDivID);
newNode.setAttribute("src", "javascript:false;");
newNode.setAttribute("scrolling", "no");
newNode.setAttribute ("frameborder", "0");
document.body.appendChild(newNode);
}
if (!pickerDiv)
pickerDiv = document.getElementById(datePickerDivID);
if (!iFrameDiv)
iFrameDiv = document.getElementById(iFrameDivID);
try {
iFrameDiv.style.position = "absolute";
Modify by dedih
42
FASILKOM UNSIKA
iFrameDiv.style.width = pickerDiv.offsetWidth;
iFrameDiv.style.height = pickerDiv.offsetHeight ;
iFrameDiv.style.top = pickerDiv.style.top;
iFrameDiv.style.left = pickerDiv.style.left;
iFrameDiv.style.zIndex = pickerDiv.style.zIndex - 1;
iFrameDiv.style.visibility = pickerDiv.style.visibility ;
iFrameDiv.style.display = pickerDiv.style.display;
} catch(e) {
}
} catch (ee) {
}
}
Modify by dedih
43
FASILKOM UNSIKA
MODUL 5
MODUL LOGIN DAN LOGOUT
5.1 Controller Login
Untuk membuat modul login yaitu dengan cara membuat controller. Buat file
login.php, lalu simpan di folder application/controller. Berikut ini skrip kodenya :
class Login extends CI_Controller
{
public $data = array('pesan'=> '');
{
$this->load->helper('form');
$this->load->library('form_validation');
$this->load->model('Login_model', 'login', TRUE);
}
{
// status user login = BENAR, pindah ke halaman absen
if ($this->session->userdata('login') == TRUE)
{
redirect('absen');
}
// status login salah, tampilkan form login
else
{
// validasi sukses
if($this->login->validasi())
{
// cek di database sukses
if($this->login->cek_user())
{
redirect('absen');
}
// cek database gagal
else
{
$this->data['pesan'] = 'Username atau Password salah.';
$this->load->view('login/login_form', $this->data);
}
Modify by dedih
44
FASILKOM UNSIKA
}
// validasi gagal
else
{
$this->load->view('login/login_form', $this->data);
}
}
public function logout()

{
$this->login->logout();
redirect('login');
}
}
/* End of file login.php */
/* Location: ./application/controllers/login.php */
5.2 Model Login

Controller login berfungsi untuk mengatur aliran program, sedangkan kerja
sesungguhnya dilakukan oleh Login_model. Buat file login_model.php, lalu simpan di folder
application/models. Berikut ini skrip kodenya :
class Login_model extends CI_Model {
public $db_tabel = 'user';
public function load_form_rules()
{
$form_rules = array(
array(
'field' => 'username',
'label' => 'Username',
'rules' => 'required'
),
array(
'field' => 'password',
'label' => 'Password',
),
);
return $form_rules;
Modify by dedih
45
FASILKOM UNSIKA
}
public function validasi()
{
$form = $this->load_form_rules();
$this->form_validation->set_rules($form);
if ($this->form_validation->run())
{
return TRUE;
}
else
{
return FALSE;
}
// cek status user, login atau tidak?

public function cek_user()
{
$username = $this->input->post('username');
$password = md5($this->input->post('password'));
$query = $this->db->where('username', $username)
->where('password', $password)
->limit(1)
->get($this->db_tabel);
if ($query->num_rows() == 1)
{
$data = array('username' => $username, 'login' => TRUE);
// buat data session jika login benar
$this->session->set_userdata($data);
return TRUE;
}
else
{
return FALSE;
}
public function logout()

{
$this->session->unset_userdata(array('username' => '', 'login' => FALSE));
$this->session->sess_destroy();
}
Modify by dedih
46
FASILKOM UNSIKA
/* End of file login_model.php */

/* Location: ./application/models/login_model.php */
5.3 View Login

Dalam folder absensi/application/views buatlah 6 folder dan berinama login, siswa,
kelas, absen, rekap dan semester sehingga tampak seperti gambar berikut :
Gambar 5.1 folder views terdiri dari folder absen, kelas,login, rekap,siswa & semester
Buat file view_model.php, lalu simpan di folder application/views/login. Berikut ini
skrip kodenya :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
<head>
<link rel="shortcut icon" href="<?php echo
base_url('asset/images/favicon.png');?>" />
base_url('asset/css/login.css');?>" />
<title>Login</title>
</head>
Modify by dedih
47
FASILKOM UNSIKA
<body>
<div id="login_box">
<h1>Login Absensi 2014</h1>
<?php
$attributes = array('name' => 'login_form', 'id' => 'login_form');

echo form_open('login', $attributes);
?>

<?php if (! empty($pesan)) : ?>
<p id="message">
<?php echo $pesan; ?>
</p>
<?php endif ?>

<p>
<label for="username">Username:</label>
<input type="text" name="username" size="20" class="form_field"
value="<?php echo set_value('username');?>">
</p>
<?php echo form_error('username', '<p class="field_error">', '</p>');?>
<p>
<label for="password">Password:</label>
<input type="password" name="password" size="20"
class="form_field" value="<?php echo set_value('password');?>">
</p>
<?php echo form_error('password', '<p class="field_error">', '</p>');?>
<p>
</p>
</form>
</div>
</body>
</html>
<input type="submit" name="submit" id="submit" value="O K"/>
Setelah semua program yang anda ketikan selesai cobalah panggil browser dan
ketikan localhost/absensi2014 sehingga akan muncul tampilan seperti gambar berikut ini :
Modify by dedih
48
FASILKOM UNSIKA
Gambar 5.1 Tampilan Login
Modify by dedih
49
FASILKOM UNSIKA
MODUL 6
MODUL KELAS
Modul kelas berfungsi untuk mengatur data kelas yang meliputi kode kelas dan nama
kelas. Data kelas ini digunakan untuk mengelompokan data siswa ke dalam kelas-kelas yang
dibuat pada modul kelas.
6.1 Controller Kelas

Untuk membuat controller kelas, buatlah file bernama kelas.php kemudian simpan
pada folder application/controller. Berikut ini skrip programnya :
class Kelas extends MY_Controller {
public $data = array(
'modul'
=> 'kelas',
'breadcrumb' => 'Kelas',
'pesan'
=> '',
'pagination' => '',
'tabel_data' => '',
'main_view' => 'kelas/kelas',
'form_action' => '',
'form_value' => '',
);
{
$this->load->model('Kelas_model', 'kelas', TRUE);
}
{
// hapus data temporary proses update
$this->session->unset_userdata('id_kelas_sekarang', '');
$this->session->unset_userdata('kelas_sekarang', '');
// Cari semua data kelas
$kelas = $this->kelas->cari_semua();
// data kelas ada, tampilkan
if ($kelas)
{
Modify by dedih
50
FASILKOM UNSIKA
// buat tabel
$tabel = $this->kelas->buat_tabel($kelas);
$this->data['tabel_data'] = $tabel;
$this->load->view('template', $this->data);
}
// data kelas tidak ada
else
{
$this->data['pesan'] = 'Tidak ada data kelas.';
}
public function tambah()

{
$this->data['breadcrumb'] = 'Kelas > Tambah';
$this->data['main_view'] = 'kelas/kelas_form';
$this->data['form_action'] = 'kelas/tambah';
// submit
if($this->input->post('submit'))
{
// validasi sukses
if($this->kelas->validasi_tambah())
{
if($this->kelas->tambah())
{
$this->session->set_flashdata('pesan', 'Proses tambah data berhasil.');
redirect('kelas');
}
else
{
$this->data['pesan'] = 'Proses tambah data gagal.';
}
}
// validasi gagal
else
{
}
}
// no submit
else
{
}
Modify by dedih
51
FASILKOM UNSIKA
}
public function edit($id_kelas = NULL)
{
$this->data['breadcrumb'] = 'Kelas > Edit';
$this->data['main_view'] = 'kelas/kelas_form';
$this->data['form_action'] = 'kelas/edit/' . $id_kelas;
// pastikan id_kelas ada
if( ! empty($id_kelas))
{
// submit
{
// validasi berhasil
if($this->kelas->validasi_edit() === TRUE)
{
//update db
$this->kelas->edit($this->session->userdata('id_kelas_sekarang'));
$this->session->set_flashdata('pesan', 'Proses update data berhasil.');
redirect('kelas');
}
// validasi gagal
else
{
}
}
// tidak disubmit, form pertama kali dimuat
else
{
// ambil data dari database, $form_value sebagai nilai dafault form
$kelas = $this->kelas->cari($id_kelas);
foreach($kelas as $key => $value)
{
$this->data['form_value'][$key] = $value;
}
// set temporary data for edit
$this->session->set_userdata('id_kelas_sekarang', $kelas->id_kelas);
$this->session->set_userdata('kelas_sekarang', $kelas->kelas);
}
}
// tidak ada parameter id_kelas, kembalikan ke halaman kelas
Modify by dedih
52
FASILKOM UNSIKA
else
{
redirect('kelas');
}
public function hapus($id_kelas = NULL)

{
// pastikan id_kelas yang akan dihapus
if( ! empty($id_kelas))
{
if($this->kelas->hapus($id_kelas))
{
$this->session->set_flashdata('pesan', 'Proses hapus data berhasil.');
redirect('kelas');
}
else
{
$this->session->set_flashdata('pesan', 'Proses hapus data gagal.');
redirect('kelas');
}
}
else
{
redirect('kelas');
}
}
// callback, apakah id_kelas sama? untuk proses edit
function is_id_kelas_exist()
{
$id_kelas_sekarang
= $this->session->userdata('id_kelas_sekarang');
$id_kelas_baru
= $this->input->post('id_kelas');
// jika id_kelas baru dan id_kelas yang sedang diedit sama biarkan
// artinya id_kelas tidak diganti
if ($id_kelas_baru === $id_kelas_sekarang)
{
return TRUE;
}
// jika id_kelas yang sedang diupdate (di session) dan yang baru (dari form) tidak
sama,
// artinya id_kelas mau diganti
// cek di database apakah id_kelas sudah terpakai?
else
{
Modify by dedih
53
FASILKOM UNSIKA
// cek database untuk id_kelas yang sama

$query = $this->db->get_where('kelas', array('id_kelas' => $id_kelas_baru));
// id_kelas sudah dipakai

if($query->num_rows() > 0)
{
$this->form_validation->set_message('is_id_kelas_exist',
"Kelas dengan kode $id_kelas_baru sudah terdaftar");
return FALSE;
}
// id_kelas belum dipakai, OK
else
{
return TRUE;
}
// callback, apakah nama kelas sama? untuk proses edit

// penjelasan kurang lebih sama dengan is_id_kelas_exist
function is_kelas_exist()
{
$kelas_sekarang = $this->session->userdata('kelas_sekarang');
$kelas_baru
= $this->input->post('kelas');
if ($kelas_baru === $kelas_sekarang)
{
return TRUE;
}
else
{
// cek database untuk nama kelas yang sama
$query = $this->db->get_where('kelas', array('kelas' => $kelas_baru));
{
$this->form_validation->set_message('is_kelas_exist',
"Kelas dengan nama $kelas_baru sudah terdaftar");
return FALSE;
}
else
{
return TRUE;
}
}
}
}
/* End of file kelas.php */
Modify by dedih
54
FASILKOM UNSIKA
/* Location: ./application/controllers/kelas.php */
6.2 Model Kelas

Buatlah
file
bernama
kelas_model.php
kemudian
simpan
pada
folder
application/models. Berikut ini skrip programnya :

class Kelas_model extends CI_Model {
public $db_tabel = 'kelas';
{
}
public function load_form_rules_tambah()
{
array(
'field' => 'id_kelas',
'label' => 'Kode Kelas',
'rules'
=>
"required|numeric|exact_length[2]|is_unique[$this>db_tabel.id_kelas]"
),
array(
'field' => 'kelas',
'label' => 'Nama Kelas',
'rules' => "required|max_length[32]|is_unique[$this->db_tabel.kelas]"
),
);
return $form_rules;
}
public function load_form_rules_edit()
{
array(
'label' => 'Kode Kelas',
'rules' => "required|numeric|exact_length[2]|callback_is_id_kelas_exist"
),
array(
'field' => 'kelas',
Modify by dedih
55
FASILKOM UNSIKA
'label' => 'Nama Kelas',

'rules' => "required|max_length[32]|callback_is_kelas_exist"
),
);
return $form_rules;
public function validasi_tambah()

{
$form = $this->load_form_rules_tambah();
{
return TRUE;
}
else
{
return FALSE;
}
public function validasi_edit()

{
$form = $this->load_form_rules_edit();
{
return TRUE;
}
else
{
return FALSE;
}
public function cari_semua()

{
return $this->db->order_by('id_kelas', 'ASC')
->get($this->db_tabel)
->result();
}
public function cari($id_kelas)
{
return $this->db->where('id_kelas', $id_kelas)
Modify by dedih
56
FASILKOM UNSIKA
->limit(1)
->row();
public function buat_tabel($data)

{
$this->load->library('table');
// buat class zebra di <tr>,untuk warna selang-seling
$tmpl = array('row_alt_start' => '<tr class="zebra">');
$this->table->set_template($tmpl);
/// heading tabel
$this->table->set_heading('No', 'Kode Kelas', 'Nama Kelas', 'Aksi');
$no = 0;
foreach ($data as $row)
{
$this->table->add_row(
++$no,
$row->id_kelas,
$row->kelas,
anchor('kelas/edit/'.$row->id_kelas,'Edit',array('class' => 'edit')).' '.
anchor('kelas/hapus/'.$row->id_kelas,'Hapus',array('class'=>
'delete','onclick'=>"return confirm('Anda yakin akan menghapus data ini?')"))
);
}
$tabel = $this->table->generate();
}
return $tabel;

{
$kelas = array(
'id_kelas' => $this->input->post('id_kelas'),
'kelas' => $this->input->post('kelas')
);
$this->db->insert($this->db_tabel, $kelas);
if($this->db->affected_rows() > 0)
{
return TRUE;
}
else
{
Modify by dedih
57
FASILKOM UNSIKA
return FALSE;
public function edit($id_kelas)

{
$kelas = array(
'id_kelas'=>$this->input->post('id_kelas'),
'kelas'=>$this->input->post('kelas'),
);
// update db
$this->db->where('id_kelas', $id_kelas);
$this->db->update($this->db_tabel, $kelas);
{
return TRUE;
}
else
{
return FALSE;
}
public function hapus($id_kelas)

{
$this->db->where('id_kelas', $id_kelas)->delete($this->db_tabel);
{
return TRUE;
}
else
{
return FALSE;
}
}
/* End of file kelas_model.php */
/* Location: ./application/models/kelas_model.php */
Modify by dedih
58
FASILKOM UNSIKA
6.3 View Kelas

Buatlah
file
bernama
kelas.php
kemudian
simpan
pada
folder
application/views/kelas/. Berikut ini skrip programnya :

<h2><?php echo $breadcrumb ?></h2>

<?php $flash_pesan = $this->session->flashdata('pesan')?>
<?php if (! empty($flash_pesan)) : ?>
<div class="pesan">
<?php echo $flash_pesan; ?>
</div>
<?php endif ?>

<div class="pesan">
</div>
<?php endif ?>


<?php if (! empty($tabel_data)) : ?>
<?php echo $tabel_data; ?>
<?php endif ?>

<div id="bottom_link">
<?php echo anchor('kelas/tambah/','Tambah', array('class' => 'add')) ?>
</div>
<?php
/* End of file kelas.php */
/* Location: ./application/views/kelas/kelas.php */
?>
Modify by dedih
59
FASILKOM UNSIKA
Setelah semua program kelas yang anda ketikan selesai cobalah panggil browser dan
ketikan localhost/absensi2014/kelas sehingga akan muncul tampilan seperti gambar berikut
ini :
Gambar 6.1 Tampilan modul kelas
Modify by dedih
60
FASILKOM UNSIKA
MODUL 7
MODUL SEMESTER
Modul semester digunakan untuk mengatur semester yang aktif , apakah semester
ganjil atau semester genap? Menentukan semester yang aktif penting karena data ini akan
digunakan pada proses entry data absen dan rekap.
7.1 Controller Semester

Buatlah file semester.php, simpan di folder application/controller/. Berikut ini skrip
programnya :
class Semester extends MY_Controller
{
'modul'
=> 'semester',
'breadcrumb' => 'Semester',
'pesan'
=> '',
'tabel_data' => '',
'main_view' => 'semester/semester',
'form_action' => 'semester',
'form_value' => '',
);
{
$this->load->model('Semester_model', 'semester', TRUE);
}
{
// cari semester
$semester = $this->semester->cari_semua();
// tampilkan dalam tabel
if ($semester)
{
$tabel = $this->semester->buat_tabel($semester);
}
Modify by dedih
61
FASILKOM UNSIKA
// if submit
{
// proses
$this->semester->set();
$this->session->set_flashdata('pesan', 'Proses ubah semester berhasil.');
redirect('semester');
}
// if no submit
else
{
// tampilkan
}
}
/* End of file semester.php */
/* Location: ./application/controllers/semester.php */
7.2 Model Semester

Buatlah file semester_model.php, simpan di folder application/models/. Berikut ini
skrip programnya :
class Semester_model extends CI_Model {
public $db_tabel = 'semester';
public function cari_semester_aktif()
{
return $this->db->select('id_semester')
->where('status', 'Y')
->limit(1)
->row();
}
function cari_semua()
{
return $this->db->order_by('id_semester')
->result();
Modify by dedih
62
FASILKOM UNSIKA
}
// buat tabel untuk ditampilkan
{
// heading tabel
$this->table->set_heading('Semester', 'Status / Pilih');
// generate row tabel
{
$row->id_semester == 1 ? $row->id_semester . ' (Ganjil)' : $row>id_semester . ' (Genap)',
// form_radio : perhatikan parameter ke-3, TRUE/FALSE akan menentukan
status radio
// checked atau tidak
form_radio('id_semester', $row->id_semester, ($row->status == 'Y' ? TRUE :
FALSE))
);
}
}
return $tabel;
// mengaktifkan semester
public function set()
{
$id_semester = $this->input->post('id_semester');
$sql1 = "UPDATE semester
SET semester.status = 'Y'
WHERE semester.id_semester = '$id_semester'";
$sql2 = "UPDATE semester
SET semester.status = 'N'
WHERE semester.id_semester != '$id_semester'";
// lakukan update dengan metode transaksi
// memastikan 2 operasi berjalan semua
Modify by dedih
63
FASILKOM UNSIKA
$this->db->trans_start();
$this->db->query($sql1);
$this->db->query($sql2);
$this->db->trans_complete();
if ($this->db->trans_status() === TRUE)

{
return TRUE;
}
else
{
return FALSE;
}
}
/* End of file semester_model.php */
/* Location: ./application/models/semester_model.php */
7.3 View Semester

Buatlah file semester.php, simpan di folder application/views/semester/. Berikut ini
skrip programnya :
<?php
$form = array(
'submit' => array(
'name'=>'submit',
'id'=>'submit',
'value'=>'Simpan'
)
);
?>
<div class="pesan">
</div>
<?php endif ?>


<?php echo form_open($form_action); ?>
Modify by dedih
64
FASILKOM UNSIKA

<?php endif ?>
<p>
<?php echo form_submit($form['submit']); ?>
</p>
<?php echo form_close(); ?>

<?php
/* End of file semester.php */
/* Location: ./application/views/semester/semester.php */
?>
Setelah semua program semester yang anda ketikan selesai cobalah panggil browser
dan ketikan localhost/absensi2014/semester sehingga akan muncul tampilan seperti
gambar berikut ini :
Gambar 7.1 Tampilan modul semester
Modify by dedih
65
FASILKOM UNSIKA
MODUL 8
MODUL SISWA
8.1 Controller Siswa
Untuk membuat modul siswa langkah pertama adalah membuat controller siswa. Buat
file bernama siswa.php kemudian simpan pada folder application/controller/. Dengan skrip
sebagai berikut :
class Siswa extends MY_Controller
{
'modul'
=> 'siswa',
'breadcrumb' => 'Siswa',
'pesan'
=> '',
'pagination' => '',
'tabel_data' => '',
'main_view' => 'siswa/siswa',
'form_value' => '',
'option_kelas' => '',
);
{
$this->load->model('Siswa_model', 'siswa', TRUE);
}
public function index($offset = 0)
{
// hapus data temporary proses update
$this->session->unset_userdata('nis_sekarang', '');
// cari data siswa
$siswa = $this->siswa->cari_semua($offset);
// ada data siswa, tampilkan
if ($siswa)
{
$tabel = $this->siswa->buat_tabel($siswa);
Modify by dedih
66
FASILKOM UNSIKA
// Paging
// http://localhost/absensi2014/siswa/halaman/2
$this->data['pagination'] = $this->siswa->paging(site_url('siswa/halaman'));
}
// tidak ada data siswa
else
{
$this->data['pesan'] = 'Tidak ada data siswa.';
}

{
$this->data['breadcrumb'] = 'Siswa > Tambah';
$this->data['main_view'] = 'siswa/siswa_form';
$this->data['form_action'] = 'siswa/tambah';
// option kelas, untuk menu dropdown
// data kelas ada
if($kelas)
{
foreach($kelas as $row)
{
$this->data['option_kelas'][$row->id_kelas] = $row->kelas;
}
}
else
{
$this->data['option_kelas']['00'] = '-';
$this->data['pesan'] = 'Data kelas tidak tersedia. Silahkan isi dahulu data kelas.';
//$this->load->view('template', $this->data);
}
// if submit
{
// validasi sukses
if($this->siswa->validasi_tambah())
{
if($this->siswa->tambah())
{
Modify by dedih
67
FASILKOM UNSIKA

redirect('siswa');
}
else
{
}
}
// validasi gagal
else
{
}
}
// if no submit
else
{
}
public function edit($nis = NULL)

{
$this->data['breadcrumb'] = 'Siswa > Edit';
$this->data['main_view'] = 'siswa/siswa_form';
$this->data['form_action'] = 'siswa/edit/' . $nis;
// option kelas
{
}
// Mencegah error http://localhost/absensi2014/siswa/edit/$nis (edit tanpa ada
parameter)
// Ada parameter
if( ! empty($nis))
{
// submit
{
if($this->siswa->validasi_edit() === TRUE)
{
//update db
Modify by dedih
68
FASILKOM UNSIKA
$this->siswa->edit($this->session->userdata('nis_sekarang'));
redirect('siswa');
}
// validasi gagal
else
{
}
}
else
{
// ambil data dari database, $form_value sebagai nilai default form
$siswa = $this->siswa->cari($nis);
foreach($siswa as $key => $value)
{
}
// set temporary data untuk edit
$this->session->set_userdata('nis_sekarang', $siswa->nis);
}
}
// tidak ada parameter $nis di URL, kembalikan ke halaman siswa
else
{
redirect('siswa');
}
public function hapus($nis = NULL)

{
if( ! empty($nis))
{
if($this->siswa->hapus($nis))
{
redirect('siswa');
}
else
{
Modify by dedih
69
FASILKOM UNSIKA
redirect('siswa');
}
else
{
redirect('kelas');
}
public function is_nis_exist()

{
$nis_sekarang = $this->session->userdata('nis_sekarang');
$nis_baru = $this->input->post('nis');
if ($nis_baru === $nis_sekarang)

{
return TRUE;
}
else
{
// cek database untuk nis yang sama
$query = $this->db->get_where('siswa', array('nis' => $nis_baru));
{
$this->form_validation->set_message('is_nis_exist',
"Siswa dengan NIS $nis_baru sudah terdaftar");
return FALSE;
}
else
{
return TRUE;
}
}
}
/* End of file siswa.php */
/* Location: ./application/controllers/siswa.php */
8.2 Model Siswa

Buatlah file siswa_model.php, simpan di folder application/models/. Berikut ini skrip
programnya :
Modify by dedih
70
FASILKOM UNSIKA

class Siswa_model extends CI_Model {
public $db_tabel = 'siswa';
public $per_halaman = 10;
public $offset = 0;
// rules form validasi, proses TAMBAH
private function load_form_rules_tambah()
{
$form = array(
array(
'field' => 'nis',
'label' => 'NIS',
'rules'
=>
"required|exact_length[4]|numeric|is_unique[$this>db_tabel.nis]"
),
array(
'field' => 'nama',
'label' => 'Nama',
'rules' => 'required|max_length[50]'
),
array(
'label' => 'Kelas',
),
);
return $form;
}
// rules form validasi, proses EDIT
private function load_form_rules_edit()
{
$form = array(
array(
'field' => 'nis',
'label' => 'NIS',
'rules' => "required|exact_length[4]|numeric|callback_is_nis_exist"
),
array(
'field' => 'nama',
'label' => 'Nama',
'rules' => 'required|max_length[50]'
),
array(
Modify by dedih
71
),
FASILKOM UNSIKA

'label' => 'Kelas',
);
return $form;
// jalankan proses validasi, untuk operasi TAMBAH

{
{
return TRUE;
}
else
{
return FALSE;
}
// jalankan proses validasi, untuk operasi EDIT

{
{
return TRUE;
}
else
{
return FALSE;
}
public function cari_semua($offset)

{
/**
* $offset start
* Gunakan hanya jika class 'PAGINATION' menggunakan option
* 'use_page_numbers' => TRUE
* Jika tidak, beri comment
Modify by dedih
72
*/
{
FASILKOM UNSIKA
if (is_null($offset) || empty($offset))
$this->offset = 0;
}
else
{
$this->offset = ($offset * $this->per_halaman) - $this->per_halaman;
}
// $offset end
return $this->db->select('siswa.nis, siswa.nama, kelas.kelas')

->from($this->db_tabel)
->join('kelas', 'kelas.id_kelas = siswa.id_kelas')
->limit($this->per_halaman, $this->offset)
->order_by('nis', 'ASC')
->get()
->result();
public function cari($nis)

{
return $this->db->where('nis', $nis)
->limit(1)
->row();
}
{
// heading tabel
$this->table->set_heading('No', 'NIS', 'Nama', 'Kelas', 'Aksi');
// no urut data
$no = 0 + $this->offset;
{
++$no,
$row->nis,
Modify by dedih
73
FASILKOM UNSIKA
$row->nama,
$row->kelas,
anchor('siswa/edit/'.$row->nis,'Edit',array('class' => 'edit')).' '.
anchor('siswa/hapus/'.$row->nis,'Hapus',array('class'=>
);
}
}
return $tabel;
public function paging($base_url)

{
$this->load->library('pagination');
$config = array(
'base_url'
=> $base_url,
'total_rows'
=> $this->hitung_semua(),
'per_page'
=> $this->per_halaman,
'num_links'
=> 4,
'use_page_numbers' => TRUE,
'first_link'
=> '|< First',
'last_link'
=> 'Last >|',
'next_link'
=> 'Next >',
'prev_link'
=> '< Prev',
);
$this->pagination->initialize($config);
return $this->pagination->create_links();
}
public function hitung_semua()
{
return $this->db->count_all($this->db_tabel);
}
{
$siswa = array(
'nis' => $this->input->post('nis'),
'nama' => $this->input->post('nama'),
'id_kelas' => $this->input->post('id_kelas')
);
$this->db->insert($this->db_tabel, $siswa);
{
return TRUE;
Modify by dedih
74
FASILKOM UNSIKA
}
else
{
return FALSE;
}
public function edit($nis)

{
$siswa = array(
'nis'=>$this->input->post('nis'),
'nama'=>$this->input->post('nama'),
'id_kelas' => $this->input->post('id_kelas'),
);
// update db
$this->db->where('nis', $nis);
$this->db->update($this->db_tabel, $siswa);
{
return TRUE;
}
else
{
return FALSE;
}
public function hapus($nis)

{
$this->db->where('nis', $nis)->delete($this->db_tabel);
{
return TRUE;
}
else
{
return FALSE;
}
}
}
/* End of file siswa_model.php */
/* Location: ./application/models/siswa_model.php */
Modify by dedih
75
FASILKOM UNSIKA
8.3 View Siswa

Buatlah file siswa_form.php, simpan di folder application/views/siswa/. Berikut ini
skrip programnya :
<?php
$form = array(
'nis' => array(
'name'=>'nis',
'size'=>'30',
'class'=>'form_field',
'value'=>set_value('nis', isset($form_value['nis']) ? $form_value['nis'] : '')
),
'nama' => array(
'name'=>'nama',
'size'=>'30',
'value'=>set_value('nama', isset($form_value['nama']) ? $form_value['nama'] : '')
),
'submit' => array(
'name'=>'submit',
'id'=>'submit',
'value'=>'Simpan'
)
);
?>
<div class="pesan">
</div>
<?php endif ?>


<p>
<?php echo form_label('NIS', 'nis'); ?>
<?php echo form_input($form['nis']); ?>
</p>
<?php echo form_error('nis', '<p class="field_error">', '</p>');?>
<p>
Modify by dedih
76
FASILKOM UNSIKA
<?php echo form_label('Nama', 'nama'); ?>

<?php echo form_input($form['nama']); ?>
</p>
<?php echo form_error('nama', '<p class="field_error">', '</p>');?>
<p>
<?php echo form_label('Kelas', 'id_kelas'); ?>
<?php echo form_dropdown('id_kelas', $option_kelas, set_value('id_kelas',
isset($form_value['id_kelas']) ? $form_value['id_kelas'] : '')); ?>
</p>
<?php echo form_error('id_kelas', '<p class="field_error">', '</p>');?>
<p>

<?php echo anchor('siswa','Batal', array('class' => 'cancel')) ?>
</p>

<?php
/* End of file siswa_form.php */
/* Location: ./application/views/kelas/siswa_form.php */
?>
Buatlah file siswa.php, simpan di folder application/views/siswa/. Berikut ini skrip
programnya :
<div class="pesan">
</div>
<?php endif ?>
<div class="pesan">
</div>
<?php endif ?>

Modify by dedih
77
FASILKOM UNSIKA


<?php if (! empty($pagination)) : ?>
<div id="pagination">
<?php echo $pagination; ?>
</div>
<?php endif ?>

<?php endif ?>
<?php echo anchor('siswa/tambah/','Tambah', array('class' => 'add')) ?>
</div>
dan ketikan localhost/absensi2014/siswa/tambah sehingga akan muncul tampilan seperti
Gambar 8.1 Tampilan modul siswa
Modify by dedih
78
FASILKOM UNSIKA
MODUL 9
MODUL ABSEN
9.1 Controller Absen
Buatlah file absen.php, simpan di folder application/controller Berikut ini skrip
programnya :
class Absen extends MY_Controller
{
'modul'
=> 'absen',
'breadcrumb' => 'Absen',
'pesan'
=> '',
'pagination' => '',
'tabel_data' => '',
'main_view' => 'absen/absen',
'form_value' => '',
);
{
$this->load->model('Absen_model', 'absen', TRUE);
}
public function index($offset = 0)
{
// hapus data tanggal temporary untuk proses update
$this->session->unset_userdata('tanggal_sekarang');
// id semester yang aktif
$id_semester = $this->semester->cari_semester_aktif()->id_semester;
// Cari data absen
$absen = $this->absen->cari_semua($offset, $id_semester);
// Jika ada tampilkan
if ($absen)
Modify by dedih
79
FASILKOM UNSIKA
$tabel = $this->absen->buat_tabel($absen);
// Paging
// http://localhost/absensi2014/siswa/halaman/2
$this->data['pagination'] = $this->absen->paging(site_url('absen/halaman'));
}
else
{
$this->data['pesan'] = 'Tidak ada data absen.';
}

{
$this->data['breadcrumb'] = 'Absen > Tambah';
$this->data['main_view'] = 'absen/absen_form';
$this->data['form_action'] = 'absen/tambah';
// if submit
{
// validasi sukses
if($this->absen->validasi_tambah())
{
// tambah data absen sukses
if($this->absen->tambah())
{
redirect('absen');
}
// tambah data absen gagal
else
{
}
}
// validasi gagal
else
{
}
}
// no submit
Modify by dedih
80
FASILKOM UNSIKA
else
{
}
public function edit($id_absen = NULL)

{
$this->data['breadcrumb'] = 'Absen > Edit';
$this->data['main_view'] = 'absen/absen_form';
$this->data['form_action'] = 'absen/edit/' . $id_absen;
// pastikan parameter ada, mencegah error
if( ! empty($id_absen))
{
// submit
{
if($this->absen->validasi_edit() === TRUE)
{
//update db
if($this->absen->edit($id_absen))
{
redirect('absen');
}
else
{
$this->session->set_flashdata('pesan', 'Ups! Entah mengapa proses
update data gagal.');
redirect('absen');
}
}
// validasi gagal
else
{
}
}
else
{
// ambil data dari database
$absen = $this->absen->cari($id_absen);
Modify by dedih
81
FASILKOM UNSIKA
foreach($absen as $key => $value)

{
}
// konversi tanggal ke format Indonesia untuk ditampilkan di form
$tgl = $this->data['form_value']['tanggal'];
$this->data['form_value']['tanggal'] = date('d-m-Y', strtotime($tgl));
// set temporary data for edit
$this->session->set_userdata('tanggal_sekarang', $absen->tanggal);
}
}
// tidak ada parameter, kembalikan ke halaman absen
else
{
redirect('absen');
}
public function hapus($id_absen = NULL)

{
// pastikan data absen yang akan dihapus ada
if( ! empty($id_absen))
{
if($this->absen->hapus($id_absen))
{
redirect('absen');
}
else
{
redirect('absen');
}
}
// tidak ada id_absen, kembali ke halaman absen
else
{
redirect('absen');
}
}
// cek apakah ada siswa dengan NIS $nis ada, memastikan hanya siswa yang
terdaftar yang bisa diabsen
Modify by dedih
82
FASILKOM UNSIKA
public function is_siswa_exist($nis)

{
// cek di database
$query = $this->db->where('nis', $nis)->get('siswa');
if ($query->num_rows() > 0)
{
return TRUE;
}
else
{
$this->form_validation->set_message('is_siswa_exist', "Siswa dengan NIS $nis
tidak terdaftar");
return FALSE;
}
}
// cek format tanggal agar sesuai untuk penyimpanan di database
public function is_format_tanggal($str)
{
if( ! preg_match('/(0[1-9]|1[0-9]|2[0-9]|3[01])-(0[1-9]|1[012])-([0-9]{4})/', $str))
{
$this->form_validation->set_message('is_format_tanggal', 'Format tanggal
tidak valid. (dd-mm-yyyy)');
return FALSE;
}
else
{
return TRUE;
}
}
// cek agar tidak terjadi siswa dengan NIS yang sama diabsen 2 kali di tanggal yang
sama
public function is_double_entry_tambah()
{
$nis
= $this->input->post('nis');
$tanggal = date('Y-m-d', strtotime($this->input->post('tanggal')));
// cek di database
$this->db->where('nis', $nis)
->where('tanggal', $tanggal);
$query = $this->db->get('absen')->num_rows();
if($query > 0)
{
Modify by dedih
83
$this->form_validation->set_message('is_double_entry_tambah',
sudah tercatat absen pada tanggal ' . $this->input->post('tanggal'));
return FALSE;
}
else
{
return TRUE;
}
}
FASILKOM UNSIKA
'Siswa
ini
// cek apakah siswa dengan NIS sama diabsen 2 kali pada tanggal yang sama?
public function is_double_entry_edit()
{
$tanggal_sekarang
= $this->session->userdata('tanggal_sekarang');
$tanggal_baru
=
date('Y-m-d',
strtotime($this->input>post('tanggal')));
$nis
= $this->input->post('nis');
if ($tanggal_baru === $tanggal_sekarang)
{
return TRUE;
}
else
{
// cek di database
$query = $this->db->where('nis', $nis)->where('tanggal', $tanggal_baru)>get('absen');
{
$this->form_validation->set_message('is_double_entry_edit', 'Siswa ini sudah
tercatat absen pada tanggal ' . $this->input->post('tanggal'));
return FALSE;
}
else
{
return TRUE;
}
}
}
}
/* End of file absen.php */
/* Location: ./application/controllers/absen.php */
Modify by dedih
84
FASILKOM UNSIKA
9.2 Model Absen

Buatlah file absen_model.php, simpan di folder application/models/ Berikut ini skrip
programnya :
<?php
class Absen_model extends CI_Model {
public $db_tabel = 'absen';
public $per_halaman = 10;
public $offset = 0;
private function load_form_rules_tambah()
{
$form = array(
array(
'field' => 'nis',
'label' => 'NIS',
'rules' => 'required|exact_length[4]|callback_is_siswa_exist'
),
array(
'field' => 'tanggal',
'label' => 'Tanggal',
'rules'
'required|callback_is_format_tanggal|callback_is_double_entry_tambah'
),
array(
'field' => 'absen',
'label' => 'Absen',
),
);
return $form;
}
=>
private function load_form_rules_edit()

{
$form = array(
array(
'field' => 'nis',
'label' => 'NIS',
'rules' => 'required|exact_length[4]|callback_is_siswa_exist'
),
array(
'field' => 'tanggal',
'label' => 'Tanggal',
Modify by dedih
85
'rules'
'required|callback_is_format_tanggal|callback_is_double_entry_edit'
),
array(
'field' => 'absen',
'label' => 'Absen',
),
);
return $form;
}
FASILKOM UNSIKA
=>

{
{
return TRUE;
}
else
{
return FALSE;
}

{
{
return TRUE;
}
else
{
return FALSE;
}
public function cari_semua($offset, $id_semester)

{
/**
* $offset start
* Gunakan hanya jika class 'PAGINATION' menggunakan option
Modify by dedih
86
FASILKOM UNSIKA
* 'use_page_numbers' => TRUE

* Jika tidak, beri comment
*/
if (is_null($offset) || empty($offset))
{
$this->offset = 0;
}
else
{
$this->offset = ($offset * $this->per_halaman) - $this->per_halaman;
}
// $offset end
return $this->db->select('absen.id_absen,
absen.tanggal,
absen.absen,
siswa.nis,
siswa.nama,
kelas.kelas')
->from('absen,
siswa,
kelas,
semester')
->where('siswa.id_kelas = kelas.id_kelas')
->where('absen.nis = siswa.nis')
->where('semester.id_semester = absen.id_semester')
->where('absen.id_semester', $id_semester)
->order_by('absen.id_absen', 'desc')
->limit($this->per_halaman, $this->offset)
->get()->result();
public function cari($id_absen)

{
return $this->db->where('id_absen', $id_absen)
->limit(1)
->row();
}
public function buat_tabel($absen)
{
// Buat class zebra di <tr>,untuk warna selang-seling
Modify by dedih
87
FASILKOM UNSIKA
/// Buat heading tabel

$this->table->set_heading('No', 'Hari, Tanggal', 'No Induk','Nama', 'Kelas', 'Absen',
'Aksi');
// $i = 0 + $offset;
$no = 0 + $this->offset;
foreach ($absen as $row)
{
// Konversi hari dan tanggal ke dalam format Indonesia (dd-mm-yyyy)
$hari_array = array('Minggu', 'Senin', 'Selasa', 'Rabu', 'Kamis', 'Jumat', 'Sabtu');
$hr = date('w', strtotime($row->tanggal));
$hari = $hari_array[$hr];
$tgl = date('d-m-Y', strtotime($row->tanggal));
$hr_tgl = "$hari, $tgl";
++$no,
$hr_tgl,
$row->nis,
$row->nama,
$row->kelas,
$row->absen,
anchor('absen/edit/'.$row->id_absen,'Edit',array('class' => 'edit')).' '.
anchor('absen/hapus/'.$row->id_absen,'Hapus',array('class'=>
);
}
}
return $tabel;
public function paging($base_url)

{
$this->load->library('pagination');
$config = array(
'base_url'
=> $base_url,
'total_rows'
=> $this->hitung_semua(),
'per_page'
=> $this->per_halaman,
'num_links'
=> 4,
'use_page_numbers' => TRUE,
'first_link'
=> '|< First',
'last_link'
=> 'Last >|',
'next_link'
=> 'Next >',
'prev_link'
=> '< Prev',
);
Modify by dedih
88
FASILKOM UNSIKA
$this->pagination->initialize($config);
return $this->pagination->create_links();
public function hitung_semua()

{
$id_semester = $this->db->select('id_semester')
->where('status', 'Y')
->limit(1)
->get('semester')
->row()->id_semester;
return $this->db->select('absen.id_absen,
absen.tanggal,
absen.absen,
siswa.nis,
siswa.nama,
kelas.kelas')
->from('absen,
siswa,
kelas,
semester')
->where('siswa.id_kelas = kelas.id_kelas')
->where('absen.nis = siswa.nis')
->where('semester.id_semester = absen.id_semester')
->where('absen.id_semester', $id_semester)
->order_by('absen.id_absen', 'desc')
->get()->num_rows();
function hapus($id_absen)
{
$this->db->where('id_absen', $id_absen)->delete($this->db_tabel);
{
return TRUE;
}
else
{
return FALSE;
}

{
// cek semester yang sedang aktif
Modify by dedih
89
FASILKOM UNSIKA
$smt = $this->semester->cari_semester_aktif();
$id_semester = $smt->id_semester;
$absen = array(
'nis' => $this->input->post('nis'),
'id_semester' => $id_semester,
'tanggal' => date('Y-m-d', strtotime($this->input->post('tanggal'))),
'absen' => $this->input->post('absen')
);
$this->db->insert($this->db_tabel, $absen);
{
return TRUE;
}
else
{
return FALSE;
}
public function edit($id_absen)

{
// cek semester yang sedang aktif
$smt = $this->semester->cari_semester_aktif();
$id_semester = $smt->id_semester;
$absen = array(
'nis'=>$this->input->post('nis'),
'id_semester'=>$id_semester,
'tanggal'
=> date('Y-m-d', strtotime($this->input->post('tanggal'))),
'absen' => $this->input->post('absen'),
);
// update db
$this->db->where('id_absen', $id_absen)->update($this->db_tabel, $absen);
{
return TRUE;
}
else
{
return FALSE;
}
Modify by dedih
90
FASILKOM UNSIKA
}
/* End of file absen_model.php */
/* Location: ./application/models/absen_model.php */
9.3 View Absen

Buatlah file absen_form.php, simpan di folder application/views/absen/ Berikut ini
skrip programnya :
<?php
$form = array(
'nis' => array(
'name'=>'nis',
'size'=>'30',
'value'=>set_value('nis', isset($form_value['nis']) ? $form_value['nis'] : '')
),
'tanggal' => array(
'name'=>'tanggal',
'size'=>'30',
'value'=>set_value('tanggal', isset($form_value['tanggal']) ? $form_value['tanggal'] :
''),
'onclick' => "displayDatePicker('tanggal')"
),
'submit' => array(
'name'=>'submit',
'id'=>'submit',
'value'=>'Simpan'
)
);
?>
<div class="pesan">
</div>
<?php endif ?>


Modify by dedih
91
FASILKOM UNSIKA

<p>
<?php echo form_label('NIS', 'nis'); ?>
<?php echo form_input($form['nis']); ?>
</p>
<?php echo form_error('nis', '<p class="field_error">', '</p>');?>
<p>
<?php echo form_label('Tanggal (dd-mm-yyyy)', 'tanggal'); ?>
<?php echo form_input($form['tanggal']); ?>
<a href="javascript:void(0);" onclick="displayDatePicker('tanggal');"><img src="<?php
echo base_url('asset/images/icon_calendar.png'); ?>" alt="calendar" border="0"></a>
</p>
<?php echo form_error('tanggal', '<p class="field_error">', '</p>');?>
<p>
<?php echo form_label('Absen', 'absen'); ?>
<?php echo form_radio('absen', 'S', set_radio('absen', 'S',isset($form_value['absen'])
&& $form_value['absen'] == 'S' ? TRUE : FALSE)); ?> ( Sakit )
<?php echo form_radio('absen', 'I', set_radio('absen', 'I',isset($form_value['absen']) &&
$form_value['absen'] == 'I' ? TRUE : FALSE)); ?> ( Ijin )
<?php echo form_radio('absen', 'A', set_radio('absen', 'A',isset($form_value['absen'])
&& $form_value['absen'] == 'A' ? TRUE : FALSE)); ?> ( Alpha )
<?php echo form_radio('absen', 'T', set_radio('absen', 'T',isset($form_value['absen'])
&& $form_value['absen'] == 'T' ? TRUE : FALSE)); ?> ( Terlambat )
</p>
<?php echo form_error('absen', '<p class="field_error">', '</p>');?>
<p>
<?php echo anchor('absen','Batal', array('class' => 'cancel')) ?>
</p>

<?php
/* End of file absen_form.php */
/* Location: ./application/views/kelas/absen_form.php */
?>
Buatlah file absen.php, simpan di folder application/views/absen/ Berikut ini skrip

programnya :
Modify by dedih
92
FASILKOM UNSIKA

<div class="pesan">
</div>
<?php endif ?>
<div class="pesan">
</div>
<?php endif ?>


<?php if (! empty($pagination)) : ?>
<div id="pagination">
<?php echo $pagination; ?>
</div>
<?php endif ?>

<?php endif ?>
<?php echo anchor('absen/tambah/','Tambah', array('class' => 'add')) ?>
</div>
dan ketikan localhost/absensi2014/absen/tambah sehingga akan muncul tampilan seperti
Modify by dedih
93
FASILKOM UNSIKA
Gambar 9.1 modul absen
Modify by dedih
94
FASILKOM UNSIKA
MODUL 10
MODUL REKAP
Modul rekap dibuat untuk menapilkan data laporan absensi siswa tiap kelas. User
dapat memilih kelas yang akan dibuat rekap data absensinya melalui menu dropdown yang
ada pada form. Format data rekap absensi yang akan dibuat ada dua yaitu Excel dan Pdf.
10.1 Controller Rekap

Buatlah file rekap.php, simpan di folder application/controllers/ Berikut ini skrip
programnya :
class Rekap extends MY_Controller
{
'modul'
=> 'rekap',
'breadcrumb' => 'Rekap',
'pesan'
=> '',
'tabel_data' => '',
'main_view' => 'rekap/rekap',
'form_action' => 'rekap',
'form_value' => '',
'option_kelas' => '',
'link_excel' => '',
'link_pdf' => '',
'id_semester' => '', // untuk tampilan Semester: 2(Genap)
'kelas'
=> '', // untuk tampilan Kelas: XI
);
{
$this->load->model('Rekap_model', 'rekap', TRUE);
}
{
// data option kelas untuk dropdown
Modify by dedih
95
FASILKOM UNSIKA
// data kelas ada

if($kelas)
{
// prepare data option kelas
{
}
// if submit
if ($this->input->post('submit'))
{
// kelas yang dipilih agar dropdown tetap terpilih, tidak reset
$this->data['form_value']['id_kelas'] = $this->input->post('id_kelas');
// cari id semester yang aktif
$id_semester = $this->semester->cari_semester_aktif()->id_semester;
// id kelas
$id_kelas = $this->input->post('id_kelas');
// cari rekap
$rekap = $this->rekap->rekap($id_kelas, $id_semester)->result();
// ada data rekap
if ($rekap)
{
// kelas untuk ditampilkan; "Kelas: XI"
$this->data['kelas'] = $this->db->select('kelas')
->where('id_kelas', $id_kelas)
->get('kelas')
->row()->kelas;
// id_kelas untuk ditampilkan; "Semester: 2 (Genap)"
$this->data['id_semester'] = $id_semester;
// buat tabel di rekap_model
$this->data['tabel_data'] = $this->rekap->buat_tabel($rekap);
// link download excel & pdf
$this->data['link_excel']
anchor("rekap/download_excel/$id_kelas/$id_semester",'Download
array('class' => 'excel'));
Modify by dedih
=
Excel',
96
FASILKOM UNSIKA
$this->data['link_pdf']
=
anchor("rekap/download_pdf/$id_kelas/$id_semester",'Download PDF', array('class'
=> 'pdf'));
}
// data kelas ada, tapi tidak ada siswa yang termasuk di kelas yang dipilih
else
{
$this->data['pesan'] = 'Tidak ada data rekap. Tidak ada siswa yang terdaftar
di kelas yang dipilih.';
}
}
// if no submit
else
{
}
}
else
{
$this->data['option_kelas']['00'] = '-';
$this->data['pesan'] = 'Data kelas tidak tersedia. Silahkan isi dahulu data kelas.';
}
}
// download rekap excel
public function download_excel($id_kelas, $id_semester)
{
// load to_excel_helper (untuk membuat laporan dengan format excel)
$this->load->helper('to_excel');
// parameter OK
if(! empty($id_kelas) && ! empty($id_semester))
{
// kelas
$kelas = $this->db->select('kelas')->where('id_kelas', $id_kelas)->get('kelas')>row()->kelas;
$query = $this->rekap->rekap($id_kelas, $id_semester);
$id_semester;
Modify by dedih
$nama_file = 'REKAP_ABSEN_KELAS_' . $kelas . '_SEMESTER_' .
97
FASILKOM UNSIKA
to_excel($query, $nama_file);
}
// parameter tidak lengkap
else
{
$this->session->set_flashdata('pesan', 'Proses pembuatan data rekap (Excel)
gagal. Parameter tidak lengkap.');
redirect('rekap');
}
}
public function download_pdf($id_kelas, $id_semester)
{
// pastikan error reporting mati, atau file pdf akan corrupt
error_reporting(0);
// parameter OK
if(! empty($id_kelas) && ! empty($id_semester))
{
// kelas
$kelas = $this->db->select('kelas')->where('id_kelas', $id_kelas)->get('kelas')>row()->kelas;
$parameters=array(
'paper'=>'A4',
'orientation'=>'portrait',
);
// load library extension class Cezpdf
// lokasi: ./application/libraries/Pdf.php
$this->load->library('Pdf', $parameters);
// pastikan path font benar
$this->pdf->selectFont(APPPATH.'/third_party/pdf-php/fonts/Helvetica.afm');
// gambar header, pastikan path gambar benar
$this->pdf->ezImage(base_url('asset/images/logo.png'), 0, 200, 'none', 'center');
// judul rekap
$this->pdf->ezText("Data Rekap Absensi Kelas $kelas Semester $id_semester",
20, array('justification'=> 'centre'));
// spasi judul dengan tabel
$this->pdf->ezSetDy(-15);
// jalankan query
$query = $this->rekap->rekap($id_kelas, $id_semester);
Modify by dedih
98
FASILKOM UNSIKA
// persiapkan data (array) untuk tabel pdf

$no = 0;
$i = 0;
$data_rekap=array();
foreach ($query->result_array() as $key => $value) {
// jangan ganti urutan 3 baris ini, atau nomor tidak tampil
$data_rekap[$key] = $value;
$data_rekap[$i]['no']= ++$no;
$i++;
}
// header tabel pdf
$column_header=array(
'no' => 'No',
'nis'=>'NIS',
'nama'=>'Nama',
'sakit'=>'Sakit',
'ijin'=>'Ijin',
'alpha'=>'Alpha',
'terlambat'=>'Terlambat',
);
// buat tabel pdf
$this->pdf->ezTable($data_rekap, $column_header);
'.pdf';
$nama_file = 'REKAP_ABSEN_KELAS_' . $kelas . '_SEMESTER_' . $id_semester .

// force download, nama file sesuai dengan $nama_file
$this->pdf->ezStream(array('Content-Disposition'=>$nama_file));
}
// parameter tidak lengkap
else
{
$this->session->set_flashdata('pesan', 'Proses pembuatan data rekap (PDF)
gagal. Parameter tidak lengkap.');
redirect('rekap');
}
}
}
/* End of file rekap.php */
/* Location: ./application/controllers/rekap.php */
Modify by dedih
99
FASILKOM UNSIKA
10.2 Model Rekap

Buatlah file rekap_model.php, simpan di folder application/models/ Berikut ini skrip
programnya :
<?php
class Rekap_model extends CI_Model {
public $db_tabel = 'absen';
// cari data absen di kelas yang dipilih pada semester yang sedang aktif
public function rekap($id_kelas, $id_semester)
{
$sql = "SELECT siswa.nis, siswa.nama,
/* ----------- jumlah sakit ------------*/
IFNULL((SELECT COUNT(absen.absen)
FROM absen
WHERE absen.absen = 'S'
AND absen.id_semester = '$id_semester'
AND absen.nis = siswa.nis
AND absen.nis IN (SELECT siswa.nis
FROM siswa
WHERE siswa.id_kelas = '$id_kelas'
ORDER BY siswa.nis ASC)
GROUP BY absen.nis
ORDER BY absen.nis ASC), 0) AS sakit,
/* ----------- jumlah ijin ------------*/
FROM absen
WHERE absen.absen = 'I'
FROM siswa
GROUP BY absen.nis
ORDER BY absen.nis ASC), 0) AS ijin,
Modify by dedih
100
FASILKOM UNSIKA
/* ----------- jumlah alpa ------------*/

FROM absen
WHERE absen.absen = 'A'
FROM siswa
GROUP BY absen.nis
ORDER BY absen.nis ASC), 0) AS alpha,
/* ----------- jumlah telat ------------*/
FROM absen
WHERE absen.absen = 'T'
FROM siswa
GROUP BY absen.nis
ORDER BY absen.nis ASC), 0) AS terlambat
FROM siswa
GROUP BY siswa.nis
ORDER BY siswa.nis ASC;";
return $this->db->query($sql);
}
public function buat_tabel($rekap)
{
// Buat class zebra di <tr>,untuk warna selang-seling
Modify by dedih
101
FASILKOM UNSIKA
/// Buat heading tabel

$this->table->set_heading('No', 'NIS', 'Nama', 'Sakit', 'Ijin', 'Alpha', 'Terlambat');
$no = 0;
foreach ($rekap as $row)
{
$this->table->add_row(++$no,
$row->nis,
$row->nama,
$row->sakit,
$row->ijin,
$row->alpha,
$row->terlambat);
}
return $tabel;
}
}
/* End of file rekap_model.php */
/* Location: ./application/models/rekap_model.php */
10.3 View Rekap

Buatlah file rekap.php, simpan di folder application/views/rekap/ Berikut ini skrip
programnya :
<div class="pesan">
</div>
<?php endif ?>
Modify by dedih
102
FASILKOM UNSIKA

<div class="pesan">
</div>
<?php endif ?>


<?php echo form_fieldset('Pilih Kelas'); ?>
<p>
<?php echo form_label('Kode Kelas', 'id_kelas'); ?>
<?php
echo
form_dropdown('id_kelas',
isset($form_value['id_kelas']) ? $form_value['id_kelas'] : ''); ?>
</p>
<?php echo form_error('id_kelas', '<p class="field_error">', '</p>');?>
$option_kelas,
<p>
<?php // echo form_submit($form['submit']); ?>
<?php echo form_submit(array('name' => 'submit', 'id'=>'submit', 'value'=>'OK')); ?>
</p>
<?php echo form_fieldset_close(); ?>


<?php if (! empty($kelas)) : ?>
<?php echo 'Kelas : <b>' . $kelas . '</b><br />'; ?>
<?php endif ?>


<?php if (! empty($id_semester)) : ?>
<?php
($id_semester == 1) ? ($id_semester = '<b>1 (Ganjil)</b>') : ($id_semester = '<b>2
(Genap)</b>');
echo 'Semester : ' . $id_semester . '<br /><br />';
?>
<?php endif ?>

<?php endif ?>
Modify by dedih
103
FASILKOM UNSIKA


<?php if (! empty($link_excel) && ! empty($link_pdf)) : ?>
<?php echo $link_excel .' ' . $link_pdf; ?>
</div>
<?php endif ?>

10.4 Membuat Laporan Excel

Untuk membuat laporan rekap data absensi berformat excel, kita akan menggunakan
sebuah helper bernama To_Excel yang dibuat oleh Derek Allan. Helper ini dapat
didownload secara gratis di :
https://github.com/Ellislab/CodeIgniter/wiki/Excel-plugin
buatlah sebuah file helper bernama to_excel_helper.php kemudian simpan di folder
application/helper/. Berikut ini skripnya :
/*
* Excel library for Code Igniter applications
* Author: Derek Allard, Dark Horse Consulting, www.darkhorse.to, April 2006
*/
function to_excel($query, $filename='exceloutput')
{
$headers = ''; // just creating the var for field headers to append to below
$data = ''; // just creating the var for field data to append to below
$obj =& get_instance();
$fields = $query->list_fields();
if ($query->num_rows() == 0) {
echo '<p>The table appears to have no data.</p>';
} else {
foreach ($fields as $field) {
// $headers .= $field->name . "\t";
$headers .= $field . "\t";
}
foreach ($query->result() as $row) {
Modify by dedih
104
FASILKOM UNSIKA
$line = '';
foreach($row as $value) {
if ((!isset($value)) OR ($value == "")) {
$value = "\t";
} else {
$value = str_replace('"', '""', $value);
$value = '"' . $value . '"' . "\t";
}
$line .= $value;
}
$data .= trim($line)."\r\n";
$data = str_replace("\r","",$data);
header("Content-type: application/x-msdownload");
header("Content-Disposition: attachment; filename=$filename.xls");
echo "$headers\n$data";
}
?>
10.5 Membuat Laporan Pdf

Untuk membuat laporan rekap data absensi berformat Pdf, kita akan menggunakan
library pihak ke tiga bernama PDF-PHP yang dibuat oleh R&ROS Ltd. Filenya dapat
didownload secara gratis di :
https://pdf-php.sourceforge.net
atau
https:// sourceforge.net/projects/ pdf-php/
Untuk meng-install PDF-PHP caranya adalah :
1. Ekstrak file library PDF-PHP (0_11_7b_php4.zip) didalamnya akan menemukan
beberapa folder dan file
2. Copy semua isi folder src yaitu file Cezpdf.php, Cpdf.php dan folder Fonts.
3. Buat folder pdf-php di absensi2014/application/thid_party. Paste ketiga file dan
folder tersebut ke dalam folder pdf-php yang baru dibuat. Coba perhatian
gambarnya :
Modify by dedih
105
FASILKOM UNSIKA
4. buatlah sebuah file helper bernama pdf.php kemudian simpan di folder

application/libraries/. Berikut ini skripnya :

// load library pdf-library
require_once(APPPATH."/third_party/pdf-php/Cezpdf.php");
class Pdf extends Cezpdf
{
public function __construct($params)
{
if (is_array($params))
{
parent::__construct($params['paper'],$params['orientation'], $params['type'],
$params['options']);
}
else
{
}
}
}
Modify by dedih
106
FASILKOM UNSIKA
DAFTAR PUSTAKA
1. Ardana, K. (2010). Pemograman PHP CodeIgniter Black Box. Yogyakarta:

CV.LOKOMEDIA.
2. Basuki, A. p. (2014). Proyek Membangun Website berbasis PHP dengan CodeIgniter.
Yogyakarta: CV.LOKOMEDIA.
3. Fajar, R. (2014). Pelatihan CodeIgniter 2014. Bandung: UPI.
4. Sidik, Betha. (2012). Framework CodeIgniter. Bandung: Informatika.
5. Utama, C. (2011). CodeIgniter Framework. Retrieved September 2014
Modify by dedih
107

MODULPRAKTIKUM Web 2 Cetak by Dedih

Diunggah oleh

Informasi Dokumen

Hak Cipta

Format Tersedia

Bagikan dokumen Ini

Bagikan atau Tanam Dokumen

Opsi Berbagi

Apakah menurut Anda dokumen ini bermanfaat?

Apakah konten ini tidak pantas?

Hak Cipta:

Format Tersedia

MODULPRAKTIKUM Web 2 Cetak by Dedih

Diunggah oleh

Hak Cipta:

Format Tersedia

Modul Pemograman Web 2 With CI

Modul Pemograman Web 2 With CI

Gambar 1.1 Alur proses codeIgniter

Modul Pemograman Web 2 With CI

Modul Pemograman Web 2 With CI

5. Helper, seperti namanya berfungsi menolong untuk melakukan tugas-tugas tertentu.

Modul Pemograman Web 2 With CI

2.1 Kebutuhan Sistem

Modul Pemograman Web 2 With CI

2.2 Instalasi Codeigniter

Gambar 2.1 Tampilan awal codeigniter

Modul Pemograman Web 2 With CI

2.3 Struktur folder CodeIgniter

Gambar 2.2 Direktori codeigniter

Gambar 2.2 Sub direktori application

Modul Pemograman Web 2 With CI

Sedangkan dalam direktori system terdapat folder sbb:

Gambar 2.2 Sub direktori system

2.4 Mengatur Configurasi pada CodeIgniter

Modul Pemograman Web 2 With CI

Modul Pemograman Web 2 With CI

6).8. [sess_match_useragent] : beri nilai TRUE untuk membandingkan browser

Modul Pemograman Web 2 With CI

Modul Pemograman Web 2 With CI

3.1 Membuat Program Selamat Belajar Web 2

Adapun langkah- langkah yang harus dilakukan adalah :

Modul Pemograman Web 2 With CI

2. Sesudah itu simpanlah file dengan perintah file>save

Modul Pemograman Web 2 With CI

2. Buatlah skrip Controller bernama siswa.php di application/controllers

mendefinisikan class controller siswa, class siswa meng-extend class

CI_Controller. class CI_Controller sendiri merupakan native class untuk controller

Modul Pemograman Web 2 With CI

Modul Pemograman Web 2 With CI

5. Bukalah file application/config/database.php, lalu lakukan pengaturan :

Modul Pemograman Web 2 With CI

Modul Pemograman Web 2 With CI

4.2 Mengatur Konfigurasi(config.php)

4.3 Membuat file .htaccess

Modul Pemograman Web 2 With CI

4.4 Mengatur Database (database.php)

4.5 Mengatur Auto-Loading(autoload.php)

Modul Pemograman Web 2 With CI

Gambar 4.1 Membuat folder bahasa indonesia

application/language/bahasa_indonesia kemudian ubah menjadi :

= "Field %s harus diisi.";

= "Field %s harus memiliki nilai.";

= "Field %s harus berisi format e-mail yang benar.";

= "Field %s harus berisi format e-mail yang benar.";

= "Field %s harus berisi format URL yang benar.";

= "Field %s harus berisi format IP yang benar.";

= "Field %s minimal %s karakter.";

= "Field %s maksimal %s karakter.";

= "Field %s harus tepat %s karakter.";

= "Field %s harus berisi alphabet.";

Modul Pemograman Web 2 With CI

= "Field %s harus berisi alpha-numeric.";

= "Field %s harus berisi alpha-numeric, underscores,

= "Field %s hanya boleh berisi bilangan.";

= "Field %s hanya boleh berisi karakter angka.";

= "Field %s harus berisi integer.";

= "Field %s harus berisi format yang benar.";

= "Field %s tidak sesuai dengan field %s.";

= "Field %s berisi data yang sama dengan database.";