Teknik Analisis Data METODE PENELITIAN

76 Bootstrap, Bootstrap-datepicker, dan DataTables sebagai komponen tambahan dalam pengembangan sistem peminjaman berbasis web perlu di-load terlebih dahulu agar dapat berfungsi. Cara me- load Bootstrap, Bootstrap- datepicker, dan DataTables ditunjukkan pada script admin_template.php berikut: DOCTYPE html html lang=en head meta charset=utf-8 meta http-equiv=X-UA-Compatible content=IE=edge meta name=viewport content=width=device-width, initial- scale=1.0 meta name=description content=Sistem Peminjaman Alat Studio Multimedia SMK 2 Sewon meta name=author content=Tim ICT SMK 2 Sewon link rel=shortcut icon href=?php echo base_url.assetsimagesfav_icon.png; ? title?php echo issettitle ? title : ; ?title link rel=stylesheet href=?php echo base_url.assetscssbootstrap.css; ? link rel=stylesheet href=?php echo base_url.assetscssdataTables.bootstrap.css; ? link rel=stylesheet href=?php echo base_url.assetscssdatepicker3.css; ? link rel=stylesheet href=?php echo base_url.assetscssstyle.css; ? head body id=?php echo issettitle ? title : ; ? div id=navigation ?php this-load-viewadmin_navigation; ? div div class=container ?php this-load-viewmain_view; ? div div id=footer ?php this-load-viewfooter; ? div script src=?php echo base_url.assetsjsjquery-1.11.0.js; ? script script src=?php echo base_url.assetsjsbootstrap.js; ? script script src=?php echo base_url.assetsjsbootstrap- datepicker.js; ? script script src=?php echo base_url.assetsjsbootstrap- datepicker.id.js; ? script script src=?php echo base_url.assetsDataTables- 1.10.0mediajsjquery.dataTables.js; ? script script src=?php echo base_url.assetsjsdataTables.bootstrap.js; ? script script src=?php echo base_url.assetsDataTables- 1.10.0extensionsTableToolsjsdataTables.tableTools.js; ? script body html 77 Selain load pada template bagian View sistem peminjaman berbasis web, Bootstrap-datepicker dan DataTables juga perlu “dipanggil” untuk dapat tampil dan berfungsi dengan baik tiap halaman. Pemanggilan Bootstrap-datepicker dilakukan pada file bootstrap-datepicker.js di dalam folder assetsjs. Pada bagian bawah file tersebut ditambahkan script sebagai berikut: ... function{ [data-provide=datepicker-inline].datepicker; JS to trigger the datepicker .trigger-datepicker.datepicker{ format: dd-mm-yyyy, language: id, startView: 2, todayBtn: true, todayHighlight: true, weekStart: 1 }; mmbr_birth-date.datepicker .onchangeDate, functione{ mmbr_birth.vale.formatdd-mm-yyyy; }; mmbr_expiredate-date.datepicker .onchangeDate, functione{ mmbr_expiredate.vale.formatdd-mm-yyyy; }; eqpmitem_receivedate-date.datepicker .onchangeDate, functione{ eqpmitem_receivedate.vale.formatdd-mm-yyyy; }; clctitem_receivedate-date.datepicker .onchangeDate, functione{ clctitem_receivedate.vale.formatdd-mm-yyyy; }; stck_receivedate-date.datepicker .onchangeDate, functione{ stck_receivedate.vale.formatdd-mm-yyyy; }; .input-daterange.datepicker{ format: dd-mm-yyyy, language: id, startView: 0, todayBtn: false, todayHighlight: true, weekStart: 1 }; loan_actualdate-date.datepicker .onchangeDate, functione{ loan_actualdate.vale.formatdd-mm-yyyy; }; srvc_date-date.datepicker .onchangeDate, functione{ srvc_date.vale.formatdd-mm-yyyy; }; 78 srvc_fixdate-date.datepicker .onchangeDate, functione{ srvc_fixdate.vale.formatdd-mm-yyyy; }; take_date-date.datepicker .onchangeDate, functione{ take_date.vale.formatdd-mm-yyyy; }; }; ... Sementara pemanggilan pada DataTables dilakukan dengan cara menambahkan script pada bagian bawah file dataTables.tableTools.js di dalam folder pelat\assets\DataTables-1.10.0\extensions\TableTools\js. Script yang ditambahkan sebagai berikut: ... DataTables API document.readyfunction { var table = search.DataTable; var tt = new .fn.dataTable.TableTools table ; } ; document.readyfunction { var table = search2.DataTable; var tt = new .fn.dataTable.TableTools table ; } ; ... 2 Halaman Home. Halaman Home memuat menu navigasi Home, Alat, Bahan, Koleksi, dan Login. Halaman Home tidak memuat data dari basis data sehingga tidak memiliki script model. Admin dan operator dapat mengakses Halaman Login dengan cara klik link Login pada menu navigasi atau tombol Login di tengah halaman Home. Tampilan halaman Home ditunjukkan pada Gambar 28.