Sunday, April 1, 2018

Tutorial Framework Codeigniter : Implementasi CRUD pada Database


Framework CodeIgniter mendukung banyak jenis database misalnya MySQL, PostGre SQL, Oracle dan lain-lain. Dukungan database dari CodeIgniter berupa penyediaan beberapa driver database yang sekaligus juga memiliki fungsi sekuriti, caching dan active record.

Dalam Praktik kali ini, kita akan membuat sebuah aplikasi rumah sakit berbasis web yang mencatat data pasien. Di aplikasi tersebut kita dapat mengisi data pasien baru, memperbaharui data yang sudah ada, melihat daftar data yang pernah dicatat, kemudian menghapus data yang sudha terlewat dan tidak diperlukan. Langkah awal yang harus dibuat adalah membuat sebuah databasenya terlebih dahulu. Kita namakan database yang akan digunakan sebagai ‘rumah_sakit’. Di halaman muka PHP MyAdmin ketikkan nama tersebut dibawah field Create new database, kemudian tekan tombol Create untuk membuat database yang diinginkan. lebih jelasnya, lihat gambar 1 berikut :

Gambar 1. Pembuatan database

Langkah selanjutnya setelah database berhasil dibuat adalah membuat suatu tabel. tabel ini yang nantinya digunakan sebagai wadah memasukkan suatu data. Dan disini kita membuat 2 tabel pokok. yang pertama tabel ‘dokter’ dan yang kedua tabel ‘pasien’. Cara membuatnya yaitu pada database ‘rumah_sakit’, buat 2 buah tabel dan isikan nama tabelnya dan jumlah kolom (tabel ‘dokter’ dan ‘pasien’). Selain itu buat juga atribut – atributnya. Dan untuk implementasinya, lihat gambar 2 dan 3.

Gambar 2. Pembuatan tabel dokter

Gambar 3. Pembuatan tabel pasien

Tabel selesai dibuat. selanjutnya membuat membuat foreign key untuk ‘id_dokter’ dengan relasi one-to- many dari tabel dokter ke tabel pasien. Disini yang dijadikan foreign key ialah id_dokter. Jadi pada penerapannya, id_dokter akan terdapat pada tabel pasien. Lihat gambar 4.

Gambar 4. Pembuatan fl one-to-many id_dokter

Untuk mengakses aplikasi rumah sakit yang telah berhasil dibuat, perlu adanya suatu konfigurasi database terhadap CodeIgniter. Dan berikut cara mengkonfigurasiannya.

Kita harus mengkonfigurasi database yang akan kita akses lewat CodeIgniter lewat file database.php yang berada di application -> config. Konfigurasi yang akan digunakan dalam
pelatihan ini adalah seperti pada gambar 5 berikut.

Gambar 5. Konfigurasi database di CI

Kemudian setelah mengkonfigurasi database, kita harus menambahkan library database di autoload.php yang berlokasi di application -> config . Hal ini dilakukan agar library database selalu di load dimanapun di controller yang ada di CodeIgniter (Tentunya jika semua controller memerlukan database). Berikut cara menambahkan library database kedalam file autoload.php. Lihat gambar 6.

Gambar 6. Konfigurasi library database

Yang pertama kita akan membuat model pada framework ini. Model disini berfungsi seperti active record yang berfungsi untuk membuat data, menampilkan data, mengupdate data dan menghapus data pada database atau bisa dibilang CRUD. Disini kita mebuat file model dengan nama pasien_model.php. Simpan file tersebut pada folder appication -> models -> daftarpasien. Berikut ialah sourcodenya :

<?php
class pasien_model extends CI_Model {

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

}
 function insert_pasien($data){
 $this->db->insert('pasien', $data);
 }

 function select_all(){
$this->db->select('*');
$this->db->from('pasien');
// $this->db->order_by('date_modified', 'desc');
return $this->db->get();
 }

 function select_by_id($Id_pas){
$this->db->select('*');
$this->db->from('pasien');
$this->db->where('Id_pas', $Id_pas);
 return $this->db->get();
 }

 function update_pasien($Id_pas, $data){
$this->db->where('Id_pas', $Id_pas);
$this->db->update('pasien', $data);
}

 function delete_pasien($Id_pas){
$this->db->where('Id_pas', $Id_pas);
$this->db->delete('pasien');
 }

 // function yang digunakan oleh paginationsample
 function select_all_paging($limit=array()){
$this->db->select('*');
$this->db->from('pasien');
//$this->db->order_by('date_modified', 'desc');
 if ($limit != NULL)
$this->db->limit($limit['perpage'], $limit['offset']);

return $this->db->get();
 }

}
?>

Selanjutnya buat controller untuk membuat function yang memproses data sehingga bisa ditampilkan pada views. Buat file php dengan nama daftarpasien.php kemudian simpan file tersebut pada folder application -> controllers. Berikut ialah sourcecodenya :


<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');
class Daftarpasien extends CI_Controller {

 public function __construct()
 {
 parent::__construct();
 $this->load->helper('url');
 $this->load->library('input');
 $this->load->model('daftarpasien/pasien_model');
 }

 // bagian pengelolaan agenda
 public function index()
 {
 $data['daftar_pasien'] = $this->pasien_model->select_all()->result();
 $this->load->view('daftarpasien/daftar_pasien', $data);
 }

 //tambah_pasien
 public function tambah_pasien(){
 $this->load->view('daftarpasien/form_tambah_pasien');
 }

 public function proses_tambah_pasien(){
 $data['Id_pas'] = $this->input->post('Id_pas');
 $data['Id_dok'] = $this->input->post('Id_dok');
 $data['Nama_pas'] = $this->input->post('Nama_pas');
 $data['Alamat_pas'] = $this->input->post('Alamat_pas');
 $data['No_telp_pas'] = $this->input->post('No_telp_pas');
 $data['Keluhan'] = $this->input->post('Keluhan');
 $this->pasien_model->insert_pasien($data);
 redirect(site_url('daftarpasien'));
 }

 //edit_pasien
 public function edit_pasien($Id_pas){
$data['pasien'] = $this->pasien_model->select_by_id($Id_pas)->row();
$this->load->view('daftarpasien/form_edit_pasien', $data);
 }

 public function proses_edit_pasien(){
 $data['Nama_pas'] = $this->input->post('Nama_pas');
 $data['Alamat_pas'] = $this->input->post('Alamat_pas');
 $data['No_telp_pas'] = $this->input->post('No_telp_pas');
 $data['Keluhan'] = $this->input->post('Keluhan');
 $Id_pas=$this->input->post('Id_pas');
 $this->pasien_model->update_pasien($Id_pas, $data);
 redirect(site_url('daftarpasien'));
 }

 //delete pasien
  public function delete_pasien($Id_pas){
 $this->pasien_model->delete_pasien($Id_pas);
 redirect(site_url('daftarpasien'));
 } 
}

Selanjutnya untuk menampilkan data yang sudah di proses pada controllers, maka kita harus membuat view untuk menampilkan data tersebut. Buat file php dengan nama daftar_pasien.php. Simpan file tersebut pada folder application -> views ->daftarpasien. Berikut ialah sourcodenya :


<?php $i = 0; foreach ($daftar_pasien as $pasien) {?>
 <fieldset>
<?php 
$i = $i + 1;
?>
<div align="center"><h2>DAFTAR PASIEN KE- <?php echo $i ?><br><br></h2>
</div>
</td></tr> 
<div align="center" ></div>
<table width="366" border="3" align="center">

<tr>
<th><p>ID Pasien</p></th>
<td><p><?php echo $pasien->Id_pas;?></p></td>
</tr>
<tr>
<td><p>ID Dokter</p></td>
<td><p><?php echo $pasien->Id_dok;?></p></td>
</tr>
<tr><th><p>Nama Pasien</p></th>
<td><p><?php echo $pasien->Nama_pas;?></p></td>
</tr>
<tr>
<td><p>Alamat Pasien</p></td>
<td><p><?php echo $pasien->Alamat_pas;?></p></td>
</tr>
<tr>
<th><p>No Telpon Pasien</p></th>
<td><p><?php echo $pasien->No_telp_pas;?></td>
</tr>
<tr>
<td><p>Keluhan</p></td>
<td><p><?php echo $pasien->Keluhan;?></p></td>
</tr>
</table>
<div align="center">
<a href="<?php echo site_url('daftarpasien/edit_pasien/'.$pasien->Id_pas);?>" style="text-decoration:none"><h2 class="button" align="center">Edit Pasien</h2></a>
<a href="<?php echo site_url('daftarpasien/delete_pasien/'.$pasien->Id_pas);?>" style="text-decoration:none"><h2 class="button" align="center">Delete Pasien</h2></a>
</div>
</fieldset>

 <?php } ?>

Akses dengan url localhost/nama_framework/index.php/daftarpasien, maka akan muncul tampilan seperti gambar 7.

Langkah kali ini kita akan membuat daftar data pasien dengan integrasi framework CodeIgniter tentunya. dan berikut merupakan contoh tampilan daftar hadir pasien yang telah dibuat. Gambar 7.

Gambar 7. Tampilan daftar hadir pasien


Selanjutnya kita akan membuat form untuk tambah pasien, yang pertama buatlah fungsi tambah pasien pada file controller daftarpasien.php. Berikut ialah sourcecodenya :


 //tambah_pasien
 public function tambah_pasien(){
 $this->load->view('daftarpasien/form_tambah_pasien');
 }

 public function proses_tambah_pasien(){
 $data['Id_pas'] = $this->input->post('Id_pas');
 $data['Id_dok'] = $this->input->post('Id_dok');
 $data['Nama_pas'] = $this->input->post('Nama_pas');
 $data['Alamat_pas'] = $this->input->post('Alamat_pas');
 $data['No_telp_pas'] = $this->input->post('No_telp_pas');
 $data['Keluhan'] = $this->input->post('Keluhan');
 $this->pasien_model->insert_pasien($data);
 redirect(site_url('daftarpasien'));
 }

Selanjutnya untuk menampilkan fungsi tambah pasien pada controller, maka kita buat tampilan view untuk form tambah pasien. Buat file php dengan nama form_tambah_pasien.php. Simpan file tersebut pada folder application -> views -> daftarpasien. Berikut ialah sourcecodenya :

 <fieldset>

 <form action="<?php echo site_url('daftarpasien/proses_tambah_pasien');?>" method="POST" name="myForm" onsubmit="return validateForm()">
<div align="center"></div>
<table width="366" border="0" align="center">
<tr><td colspan="3">
<div align="center"> <h2>Form Tambah Pasien</h2>
<p>.....................................................</p>
</div>
</td></tr>
<tr><td width="354"><h4> ID Pasien<td> : </td></h4></td><td><input class="alamat" type="text" name="Id_pas"></td></tr>
<tr><td><h4> ID Dokter<td> : </td></h4></td><td><input class="alamat" type="text" name="Id_dok"><br></td></tr>
<tr><td><h4> Nama Pasien<td> : </td></h4></td><td><input class="alamat" type="text" name="Nama_pas"><br></td></tr>
<tr><td><h4> Alamat Pasien<td> : </td></h4></td><td><input class="alamat" type="text" name="Alamat_pas"><br></td></tr>
<tr><td><h4> No Telepon Pasien<td> : </td></h4></td><td><input class="alamat" type="text" name="No_telp_pas"><br></td></tr>
<tr><td><h4> Keluhan Pasien<td> : </td></h4></td><td><input class="alamat" type="text" name="Keluhan"><br></td></tr>
<tr><td colspan="3"><input class="button" type="submit" value="Tambah"></td></tr>
</table></form>
 </fieldset>

Jika berhasil, maka akan muncul tampilan seperti pada gambar 8.

Dan untuk cara membuatnya ialah dengan menggunakan fitur tambah data pasien melalui form tambah pasien yang telah dibuat. Dalam form tersebut terdapat kolom id_pasien, id_dokter (foreign key), nama pasien, alamat pasien, no. telepon pasien, dan keluhan pasien. Dengan mengisi semua kolom – kolom tersebut dengan data yang benar, kita telah membuat sebuah data pasien baru. Gambar 8.

Gambar 8. Tampilan tambah pasien

Untuk tutorial sourcecode update data pasien dan seterusnya bisa dilihat pada video tutorial pada link dibawah :


Setelah fitur tambah data telah diduat dan dipraktikkan, selanjutnya melakukan update data pasien dengan menggunakan fitur udate yang juga telah dibuatkan formnya. Caranya sama seperti menambahkan data baru, hanya saja tidak semua data diupdate atau diubah. Dan jika sudah, klik tombol ubah (Lihat gambar 10) dan untuk melihat data yang telah diupdate, lihat gambar 11.

Gambar 9. Tampilan sebelum update data pasien

Gambar 10. Tampilan form update

Gambar 11. Tampilan sesudah update data pasien

Kemudian melakukan delete data dengan menggunakan fitur ‘delete’, jika suatu waktu terdapat sebuah data yang tidak lagi diperlukan dan admin ingin menghapusnya. Maka fitur delete sanga diperlukan.
Dan untuk caranya ialah pada menu daftar data pasien, pilih data mana yang akan dihapus dengan menekan tombol delete data pasien /delete pasien. Perhatikan gambar 12 dan 13.

Gambar 12. Tampilan sebelum delete data pasien

Gambar 13. Tampilan sesudah delete data pasien

Terlihat pada gambar 13, bahwa pada daftar pasien posisi ke 1 data pasien yang terdapat adalah data dengan nomor id ke 2. Hal ini menunjukkan bahwa penghapusan data ke satu berhasil dilakukan.

Pembuatan serta konfigurasi database maupun tabel dokter dan pasien telah selesai dilakukan. Selanjutnya kita akan membuat sebuah tabel login. dimana tabel login berfungsi sebagai akses masuk admin maupun dokter. Langkah pembuatannya sebagai berikut.

Kita buat 1 tabel dengan 2 username, yaitu admin dan dokter. Untuk cara membuat tabelnya sama dengan cara membuat membuat tabel dokter dan pasien sebelumnya. Buat kolom sebanyak 3 dengan nama id_log, username, dan password. Untuk detailnya, lihat gambar 14 dan 15 dibawah ini :

Gambar 14. Tampilan tabel login

Gambar 15. Tampilan data dalam tabel login

Jika tabel login dan form login berhasil dibuat, maka pada ‘localhost/ci2/index.php/akun’ akan muncul tampilan seperti gambar 16 dibawah ini.

Gambar 16. Tampilan menu login 

Tampilan setelah admin berhasil masuk pada halaman login adalah langsung mengarah pada halaman daftar data pasien. Lihat gambar 17.

Gambar 17. Tampilan sesudah login admin

Untuk masuk sebagai dokter, menggunakan username dokter dan password dokter. Dan untuk tampilannya sebagai berikut. Gambar 18.

Gambar 18. Tampilan memasukkan akun login dokter

Ketika akses dokter berhasil masuk, maka tampilannya akan seperti berikut : Gambar 19.

Gambar 19. Tampilan sesudah login dokter

Halaman paging merupakan suatu menu halaman yang terdiri dari beberapa halaman dan dengan menggunakan model panah arah, yang menunjukkan lihat halaman selanjutnya. Disamping itu, halaman paging juga menampilkan daftar data pasien yang telah dimasukkan dari menu tambah pasien sebelumnya. Lebih jelasnya, lihat gambar 20.

Gambar 20. Tampilan halaman paging daftar hasir pasien

Tampilan halaman pagination. Halaman pagination merupakan halaman yang menampilkan daftar hadir pasien yang telah berpindah halaman. Dalam artian user telah memindahkan halaman yang sebelumnya dari halaman paging.

Gambar 21. Tampilan halaman pagination daftar hasir pasien setelah berpindah halaman


NB : Pada softcopy yang saya share base url http://pfw2017k01.000webhostapp.com/ silahkan ganti base url local kalian masing-masing. Misal : http://localhost/ci2c/

Untuk file silahkan unduh disini, dan jangan lupa tinggalkan jejak jika artikel ini bermanfaat :)
Jika ada pertanyaan email ke danifwahyudi@gmail.com

Saturday, March 31, 2018

Tutorial Framework Codeigniter : Menghitung Luas dan Volume Bangunan



  • Pengertian Framework CodeIgniter (CI)
CodeIgniter adalah sebuah framework berbasis PHP yang kuat dengan footprint yang sangat kecil, dibangun untuk pengembang yang membutuhkan toolkit sederhana dan elegan untuk membuat aplikasi web dengan fitur lengkap. Lantas Apa itu framework? Framework atau dalam bahasa indonesia dapat diartikan sebagai “kerangka kerja” merupakan sebuah toolyang bekerja pada suatu konsep tertentu dan terdiri dari berbagai fungsi yang dapat dengan mudah dijabarkan atau dialih-gunakan untuk membuat fungsi-fungsi lain yang lebih kompleks.
Maksudnya, jika seorang Programmer menggunakan sebuah framework sebagai lingkup kerjanya, dia
harus mematuhi segala ketentuan dari framework tersebut. Lebih lanjut ia dapat membangun berbagai
fungsi yang rumit dan kompleks dengan menggunakan fungsi-fungsi yang telah disediakan oleh Framework tersebut. Jadi dia tidak perlu lagi menulis ulang semua coding, Ia cukup mempelajari cara
menggunakan kerangka (frame) yang telah tersedia dari framework tersebut.

  • Implementasi Framework CI

1. Membuat file controler dengan nama bangun.php pada folder controler

<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');

class Bangun extends CI_Controller {
public function index()
{
$this->load->view('input');
}

function hasil()
{
//balok
$panjang = $this->input->post('panjang');
$lebar = $this->input->post('lebar');
$tinggibalok = $this->input->post('tinggibalok');
//tabung
$jari2luas = $this->input->post('jari2luas');
$jari2volume = $this->input->post('jari2volume');
$tinggitabung = $this->input->post('tinggitabung');
//limas segiempat
$sisilimas = $this->input->post('sisilimas');
$alaslimas = $this->input->post('alaslimas');
$tinggilimas = $this->input->post('tinggilimas');
//prisma segitiga
$alassegitiga = $this->input->post('alassegitiga');
$tinggisegitiga = $this->input->post('tinggisegitiga');
$tinggiprisma = $this->input->post('tinggiprisma');

if($this->input->post('luasbalok')){
$jawaban = 2*(($panjang*$lebar)+($panjang*$tinggibalok)+($lebar*$tinggibalok)); 
$bangun = 'Bangun Balok';
$jenis = 'Luas : ';
}

  if($this->input->post('volumebalok')){
$jawaban = $panjang*$lebar*$tinggibalok;
$bangun = 'Bangun Balok';
$jenis = 'Volume : ';
}

if($this->input->post('luastabung')){
$jawaban = 3.14*$jari2luas*$jari2luas;
$bangun = 'Bangun Tabung';
$jenis = 'Luas : ';
}

if($this->input->post('volumetabung')){
$jawaban = 3.14*$jari2volume*$jari2volume*$tinggitabung;
$bangun = 'Bangun Tabung';
$jenis = 'Volume : ';
}

if($this->input->post('luaslimas')){
$luasalas = $sisilimas*$sisilimas;
$luassisi = (0.5*$alaslimas*$tinggilimas)*4;
$jawaban = $luasalas + (4*$luassisi);
$bangun = 'Bangun Limas Segiempat';
$jenis = 'Luas : ';
}

if($this->input->post('volumelimas')){
$luasalas = $sisilimas*$sisilimas;
$jawaban = 1/3*$luasalas*$tinggilimas;
$bangun = 'Bangun Limas Segiempat';
$jenis = 'Volume : ';
}

if($this->input->post('luasprisma')){
$jawaban = $tinggisegitiga*($alassegitiga + (3*$tinggiprisma));
$bangun = 'Bangun Prisma Segitiga';
$jenis = 'Luas : ';
}

if($this->input->post('volumeprisma')){
$jawaban = 0.5*$alassegitiga*$tinggisegitiga*$tinggiprisma;
$bangun = 'Bangun Prisma Segitiga';
$jenis = 'Volume : ';
}

$data=array(
'jawaban' => $jawaban,
'bangun' => $bangun,
'jenis' => $jenis
);

$this->load->view('hasil',$data);

}

}


2.  Membuat file view dengan nama input.php pada folder view untuk passing data ke fungsi controler

<!doctype html>
<html>
    <head>
    <meta charset="utf-8">
        <title>Demo Tugas</title>
    <style type="text/css">
    body {
        background: #1f8dd6;
        color: #df4231;
        font-family: Arial;
    }

h1{
font-family: Comic Sans MS;
color: Green;
font-size: 40px;
}

    h2 {
        margin-bottom: -5px;
    }

h3 {
        margin-bottom: 5px;
    }

    p {
margin-top: 5px;
        font-size: 20px;
//        color: #c9c9c9;
color: black;
    }

h4 {
margin-top: 5px;
        font-size: 20px;
        color: black;
    }

    table {
        background: #ffffff;
        border-radius: 5px;
        padding: 20px;
    }

    input.alamat {
        background: url(images/maps.png)no-repeat 7px 9px;
        border: 1px solid #c9c9c9;
        border-radius: 3px;
        height: 15px;
        padding: 8px;
        padding-left: 37px;
        
        transition: 1s all;
        -moz-transition: 1s all;
        -o-transition: 1s all;
    }

    .button {
        background: #df4231;
        color: #ffffff;
        width: 370px;
        margin-top: 10px;
        height: 40px;
        border: 1px solid #c9c9c9;
        border-radius: 5px;
        transition: 1s all;
        -moz-transition: 1s all;
        -o-transition: 1s all;
    }
    .button:hover {
        background: #19B5FE;   
        transition: 1s all;
        -moz-transition: 1s all;
        -o-transition: 1s all;
    }
    .button-gambar {
        height: 35px;
    }
</style>
</head>
<body>

<table align="center">

    <tr>
        <td align="center" colspan="2"><h1>MENGHITUNG LUAS DAN VOLUME BANGUNAN</h1></td>
    </tr>

<tr>
<td>

<form method="POST" action="http://pfw2017k01.000webhostapp.com/index.php/bangun/hasil">
<div align="center"></div>
<table width="366" border="0" align="center">
<tr><td colspan="2">
<div align="center"> <h2>BANGUN BALOK</h2>
<p>.....................................................</p>
</div>
</td></tr>
<tr><td width="354"><h4> Panjang  : </h4><input class="alamat" type="text" name="panjang"></td></tr>
<tr><td><h4> Lebar  : </h4><input class="alamat" type="text" name="lebar"><br></td></tr>
<tr><td><h4> Tinggi : </h4><input class="alamat" type="text" name="tinggibalok"></td></tr>
<tr><td><input class="button" type="submit" name="luasbalok" value="Hitung Luas"></td></tr>
<tr><td><input class="button" type="submit" name="volumebalok" value="Hitung Volume"></td></tr>
<tr><td><h3>Rumus Balok<h3></td></tr>
<tr><td>
<p>Luas Balok :<br>
2(P x L + P x T + L x T)<br><br>
Volume Balok :<br>
P x L x T<br><br>
Ket :<br>
P = Panjang Balok<br>
L = Lebar Balok<br>
T = Tinggi Balok<br></p>
</td></tr>
</table></form>

</td>

<td>

<form method="POST" action="http://pfw2017k01.000webhostapp.com/index.php/bangun/hasil">
<div align="center"></div>
<table width="366" border="0" align="center">
<tr><td colspan="2">
<div align="center"> <h2>BANGUN TABUNG</h2>
<p>.....................................................</p>
</div>
</td></tr>
<tr><td width="354"><h4> Jari-Jari  : </h4><input class="alamat" type="text" name="jari2luas"></td></tr>
<tr><td><input class="button" type="submit" name="luastabung" value="Hitung Luas"></td></tr>
<tr><td><h4> Jari-Jari  : </h4><input class="alamat" type="text" name="jari2volume"><br></td></tr>
<tr><td><h4> Tinggi : </h4><input class="alamat" type="text" name="tinggitabung"></td></tr>
<tr><td><input class="button" type="submit" name="volumetabung" value="Hitung Volume"></td></tr>
<tr><td><h3>Rumus Tabung<h3></td></tr>
<tr><td>
<p>Luas Tabung :<br>
3.14 x R x R<br><br>
Volume Tabung :<br>
3.14 x R x R x T<br><br>
Ket :<br>
R = Jari-jari Tabung<br>
T = Tinggi Tabung<br><br></p>
</td></tr>
</table></form>

</td>

</tr>

<tr>
<td>

<form method="POST" action="http://pfw2017k01.000webhostapp.com/index.php/bangun/hasil">
<div align="center"></div>
<table width="366" border="0" align="center">
<tr><td colspan="2">
<div align="center"> <h2>BANGUN LIMAS SEGIEMPAT</h2>
<p>.....................................................</p>
</div>
</td></tr>
<tr><td width="354"><h4> Sisi  : </h4><input class="alamat" type="text" name="sisilimas"></td></tr>
<tr><td><h4> Lebar  : </h4><input class="alamat" type="text" name="alaslimas"><br></td></tr>
<tr><td><h4> Tinggi : </h4><input class="alamat" type="text" name="tinggilimas"></td></tr>
<tr><td><input class="button" type="submit" name="luaslimas" value="Hitung Luas"></td></tr>
<tr><td><input class="button" type="submit" name="volumelimas" value="Hitung Volume"></td></tr>
<tr><td><h3>Rumus Limas Segiempat<h3></td></tr>
<tr><td>
<p>Luas Alas :<br>
S x S<br>
Luas Sisi :<br>
(0.5 x A x T) x 4<br>
Luas Limas :<br>
LA + (4 x LS)<br><br>

Volume Limas :<br>
1/3 x LA x T<br><br>
Ket :<br>
LA = Luas Alas<br>
LS = Luas Sisi<br>
S = Sisi Segitiga<br>
A = Alas Segitiga<br>
T = Tinggi Limas<br><br></p>
</td></tr>
</table></form>

</td>

<td>

<form method="POST" action="http://pfw2017k01.000webhostapp.com/index.php/bangun/hasil">
<div align="center"></div>
<table width="366" border="0" align="center">
<tr><td colspan="2">
<div align="center"> <h2>BANGUN PRISMA SEGITIGA</h2>
<p>.....................................................</p>
</div>
</td></tr>
<tr><td width="354"><h4> Alas Segitiga  : </h4><input class="alamat" type="text" name="alassegitiga"></td></tr>
<tr><td><h4> Tinggi Segitiga  : </h4><input class="alamat" type="text" name="tinggisegitiga"><br></td></tr>
<tr><td><h4> Tinggi Prisma : </h4><input class="alamat" type="text" name="tinggiprisma"></td></tr>
<tr><td><input class="button" type="submit" name="luasprisma" value="Hitung Luas"></td></tr>
<tr><td><input class="button" type="submit" name="volumeprisma" value="Hitung Volume"></td></tr>
<tr><td><h3>Rumus Prisma Segitiga<h3></td></tr>
<tr><td>
<p>Luas Prisma :<br>
TS x (A + (3 x TP ))<br><br>

Volume Prisma :<br>
0.5 x A x TS x TP<br><br>
Ket :<br>
A = Alas Segitiga<br>
TS = Tinggi Segitiga<br>
TP = Tinggi Prisma<br><br><br><br><br><br><br><br></p>
</td></tr>
</table></form>

</td>

</tr>
</table>

</table></form>
</body>
</html>


3.  Selanjutnya untuk menangkap hasil data luas dan volume pada file controler bangun.php, buat file view hasil.php seperti berikut

<!doctype html>
<html>
    <head>
    <meta charset="utf-8">
        <title>Demo Tugas</title>

</head>
<body>

<table align="center">

<tr>
<td>

<div align="center"></div>
<table width="366" border="0" align="center">
<tr><td colspan="2">
<div align="center"> <h2><?php echo $bangun; ?></h2>
<p>.....................................................</p>
</div>
</td></tr>
<tr><td width="354"><h4 align="center"><?php echo $jenis; ?></h4></td></tr>
<tr><td><h4 class="alamat" align="center"><?php echo $jawaban;?></h4></td></tr>
<tr><td> <a href="http://pfw2017k01.000webhostapp.com/index.php/bangun" style="text-decoration:none"><h2 class="button" align="center">Hitung Lagi </h2></tr></td>
<table>

</td>
</tr>
</table>

</table>
</body>
</html>


  • Berikut Hasil Implementasi Framework CI (CodeIgniter)

Gambar 1.1 Tampilan Web Menghitung Luas danVolume Bangun

Gambar 1.1 ini merupakan tampilan awal web menghitung luas dan volume bangunan. Dimana pada gambar ini terdapat 4 pilihan fitur, diantaranya fitur “Bangun Balok”, “Bangun Tabung”, “Bangun Limas Segiempat”, “Bangun Prisma Segitiga”. Dari fitur tersebut terdapat rumus perhitungannya masing – masing.

Gambar 1.2 Menu Bangun Balok

Gambar 1.2 merupakan fitur perhitungan bangun balok, dimana terdapat 3 kriteria yaitu panjang, lebar, dan tinggi. Dari kriteria tersebut dapat dimunculkan hasil yaitu “luas” dan “volume”.



Gambar 1.3 Bangun Tabung

Gambar 1.3 merupakan fitur bangun tabung. bangun tabung memiliki kriteria menghitung luas dengan mengacu pada jari – jari bangunan. kemudian untuk menghitung volume bangun tabung dengan mengacu jari – jari dan tinggi.


Gambar 1.4 Bangun Limas Segiempat

Gambar 1.4 merupakan fitur bangun limas segiempat yang memiliki perihitungan sisi, lebar, dan tinggi. dari 3 kriteria tersebut dapat dihitung luas bangun dan volume bangun limas segiempat.

Gambar 1.5 Bangun Prisma Segitiga

Gambar 1.5 merupakan fitur bangun prisma segitiga yang memiliki perhitungan luas segitiga, tinggi segitiga, dan tinggi prisma. kemudian output yang dihasilkan adalah perhitungan luas prisma dan volume prisma.

Gambar 1.6 Contoh input data bangun balok

Gambar 1.6 merupakan tampilan penginputan data (nilai) yang akan dihitung. Diantaranya panjang 3, lebar 2, dan tinggi 4.


Gambar 1.7 Hasil Luas Bangun Balok

Gambar 1.7 merupakan tampilan hasil dari perhitungan Luas bangun balok yaitu bangun balok dengan luas 52.


Gambar 1.8 Hasil Volume Bangun Balok

Gambar 1.8 merupakan tampilan hasil dari perhitungan volume bangun balok yaitu 24.

NB : Pada softcopy yang saya share base url http://pfw2017k01.000webhostapp.com/ silahkan ganti base url local kalian masing-masing. Misal : http://localhost/ci2c/

Untuk file silahkan unduh disini, dan jangan lupa tinggalkan jejak jika artikel ini bermanfaat :)
Jika ada pertanyaan email ke danifwahyudi@gmail.com