Web Programming : Meet 7 (Membuat Daftar Biodata Mahasiswa dengan CI dan Bootstrap)

Membuat Biodata Mahasiswa dengan CodeIgniter dan Bootstrap

Download File Lengkap Disini

  1. Download bootstrap di Bootstrap v3.3.7/bootstrap-3.3.7-dist.zip
  2. Kemudian kopi bootstrap-3.3.7-dist.zip (yang sudah didownload di folder utama codeigniter pertemuan sebelumnya saya menggunakan folder wp2 (kopi disini)
  3. Extraxt Here file bootstrap-3.3.7-dist.zip, kemudian rename folder bootstrap-3.3.7-dist (hasil ekstraks) menjadi bootstrap

tambahkan librari database dan session Baris ke 61 pada file autoload.php di dalam folder config

$autoload['libraries'] = array('database','session');

Buat sebuah tabel baru dengan nama biodata di dalam database db_mhs

-- phpMyAdmin SQL Dump
-- version 4.7.7
-- https://www.phpmyadmin.net/
--
-- Host: localhost
-- Generation Time: Feb 12, 2018 at 04:32 PM
-- Server version: 10.1.30-MariaDB
-- PHP Version: 5.6.33

SET SQL_MODE = "NO_AUTO_VALUE_ON_ZERO";
SET AUTOCOMMIT = 0;
START TRANSACTION;
SET time_zone = "+00:00";


/*!40101 SET @OLD_CHARACTER_SET_CLIENT=@@CHARACTER_SET_CLIENT */;
/*!40101 SET @OLD_CHARACTER_SET_RESULTS=@@CHARACTER_SET_RESULTS */;
/*!40101 SET @OLD_COLLATION_CONNECTION=@@COLLATION_CONNECTION */;
/*!40101 SET NAMES utf8mb4 */;

--
-- Database: `db_mhs`
--

-- --------------------------------------------------------

--
-- Table structure for table `biodata`
--

CREATE TABLE `biodata` (
  `id` int(4) NOT NULL,
  `nim` varchar(15) NOT NULL,
  `nama` varchar(50) NOT NULL,
  `jk` int(1) NOT NULL COMMENT '1. Laki-Laki;2. Perempuan',
  `tempat_lahir` int(1) NOT NULL,
  `tgl_lahir` date NOT NULL,
  `alamat` text NOT NULL,
  `jur` int(1) NOT NULL,
  `no_hp` varchar(12) NOT NULL,
  `foto` varchar(50) NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=latin1;

--
-- Indexes for dumped tables
--

--
-- Indexes for table `biodata`
--
ALTER TABLE `biodata`
  ADD PRIMARY KEY (`id`);

--
-- AUTO_INCREMENT for dumped tables
--

--
-- AUTO_INCREMENT for table `biodata`
--
ALTER TABLE `biodata`
  MODIFY `id` int(4) NOT NULL AUTO_INCREMENT;
COMMIT;

/*!40101 SET CHARACTER_SET_CLIENT=@OLD_CHARACTER_SET_CLIENT */;
/*!40101 SET CHARACTER_SET_RESULTS=@OLD_CHARACTER_SET_RESULTS */;
/*!40101 SET COLLATION_CONNECTION=@OLD_COLLATION_CONNECTION */;

Buat sebuah Controller Baru dengan nama Biodata.php (dalam folder application/controllers)

<?php

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

class Biodata extends CI_Controller
{
    function __construct()
    {
        parent::__construct();
        $this->load->model('Biodata_model');
        $this->load->library('form_validation');
    }

    public function index()
    {
        $q = urldecode($this->input->get('q', TRUE));
        $start = intval($this->input->get('start'));
        
        if ($q <> '') {
            $config['base_url'] = base_url() . 'biodata/index?q=' . urlencode($q);
            $config['first_url'] = base_url() . 'biodata/index?q=' . urlencode($q);
        } else {
            $config['base_url'] = base_url() . 'biodata/index';
            $config['first_url'] = base_url() . 'biodata/index';
        }

        $config['per_page'] = 10;
        $config['page_query_string'] = TRUE;
        $config['total_rows'] = $this->Biodata_model->total_rows($q);
        $biodata = $this->Biodata_model->get_limit_data($config['per_page'], $start, $q);

        $this->load->library('pagination');
        $this->pagination->initialize($config);

        $data = array(
            'biodata_data' => $biodata,
            'q' => $q,
            'pagination' => $this->pagination->create_links(),
            'total_rows' => $config['total_rows'],
            'start' => $start,
        );
        $this->load->view('biodata/biodata_list', $data);
    }

    public function read($id) 
    {
        $row = $this->Biodata_model->get_by_id($id);
        if ($row) {
            $data = array(
    'id' => $row->id,
    'nim' => $row->nim,
    'nama' => $row->nama,
    'jk' => $row->jk,
    'tempat_lahir' => $row->tempat_lahir,
    'tgl_lahir' => $row->tgl_lahir,
    'alamat' => $row->alamat,
    'jur' => $row->jur,
    'no_hp' => $row->no_hp,
    'foto' => $row->foto,
      );
            $this->load->view('biodata/biodata_read', $data);
        } else {
            $this->session->set_flashdata('message', 'Record Not Found');
            redirect(site_url('biodata'));
        }
    }

    public function create() 
    {
        $data = array(
            'button' => 'Create',
            'action' => site_url('biodata/create_action'),
      'id' => set_value('id'),
      'nim' => set_value('nim'),
      'nama' => set_value('nama'),
      'jk' => set_value('jk'),
      'tempat_lahir' => set_value('tempat_lahir'),
      'tgl_lahir' => set_value('tgl_lahir'),
      'alamat' => set_value('alamat'),
      'jur' => set_value('jur'),
      'no_hp' => set_value('no_hp'),
      'foto' => set_value('foto'),
  );
        $this->load->view('biodata/biodata_form', $data);
    }
    
    public function create_action() 
    {
        $this->_rules();

        if ($this->form_validation->run() == FALSE) {
            $this->create();
        } else {
            $data = array(
    'nim' => $this->input->post('nim',TRUE),
    'nama' => $this->input->post('nama',TRUE),
    'jk' => $this->input->post('jk',TRUE),
    'tempat_lahir' => $this->input->post('tempat_lahir',TRUE),
    'tgl_lahir' => $this->input->post('tgl_lahir',TRUE),
    'alamat' => $this->input->post('alamat',TRUE),
    'jur' => $this->input->post('jur',TRUE),
    'no_hp' => $this->input->post('no_hp',TRUE),
    'foto' => $this->input->post('foto',TRUE),
      );

            $this->Biodata_model->insert($data);
            $this->session->set_flashdata('message', 'Create Record Success');
            redirect(site_url('biodata'));
        }
    }
    
    public function update($id) 
    {
        $row = $this->Biodata_model->get_by_id($id);

        if ($row) {
            $data = array(
                'button' => 'Update',
                'action' => site_url('biodata/update_action'),
    'id' => set_value('id', $row->id),
    'nim' => set_value('nim', $row->nim),
    'nama' => set_value('nama', $row->nama),
    'jk' => set_value('jk', $row->jk),
    'tempat_lahir' => set_value('tempat_lahir', $row->tempat_lahir),
    'tgl_lahir' => set_value('tgl_lahir', $row->tgl_lahir),
    'alamat' => set_value('alamat', $row->alamat),
    'jur' => set_value('jur', $row->jur),
    'no_hp' => set_value('no_hp', $row->no_hp),
    'foto' => set_value('foto', $row->foto),
      );
            $this->load->view('biodata/biodata_form', $data);
        } else {
            $this->session->set_flashdata('message', 'Record Not Found');
            redirect(site_url('biodata'));
        }
    }
    
    public function update_action() 
    {
        $this->_rules();

        if ($this->form_validation->run() == FALSE) {
            $this->update($this->input->post('id', TRUE));
        } else {
            $data = array(
    'nim' => $this->input->post('nim',TRUE),
    'nama' => $this->input->post('nama',TRUE),
    'jk' => $this->input->post('jk',TRUE),
    'tempat_lahir' => $this->input->post('tempat_lahir',TRUE),
    'tgl_lahir' => $this->input->post('tgl_lahir',TRUE),
    'alamat' => $this->input->post('alamat',TRUE),
    'jur' => $this->input->post('jur',TRUE),
    'no_hp' => $this->input->post('no_hp',TRUE),
    'foto' => $this->input->post('foto',TRUE),
      );

            $this->Biodata_model->update($this->input->post('id', TRUE), $data);
            $this->session->set_flashdata('message', 'Update Record Success');
            redirect(site_url('biodata'));
        }
    }
    
    public function delete($id) 
    {
        $row = $this->Biodata_model->get_by_id($id);

        if ($row) {
            $this->Biodata_model->delete($id);
            $this->session->set_flashdata('message', 'Delete Record Success');
            redirect(site_url('biodata'));
        } else {
            $this->session->set_flashdata('message', 'Record Not Found');
            redirect(site_url('biodata'));
        }
    }

    public function _rules() 
    {
  $this->form_validation->set_rules('nim', 'nim', 'trim|required');
  $this->form_validation->set_rules('nama', 'nama', 'trim|required');
  $this->form_validation->set_rules('jk', 'jk', 'trim|required');
  $this->form_validation->set_rules('tempat_lahir', 'tempat lahir', 'trim|required');
  $this->form_validation->set_rules('tgl_lahir', 'tgl lahir', 'trim|required');
  $this->form_validation->set_rules('alamat', 'alamat', 'trim|required');
  $this->form_validation->set_rules('jur', 'jur', 'trim|required');
  $this->form_validation->set_rules('no_hp', 'no hp', 'trim|required');
  $this->form_validation->set_rules('foto', 'foto', 'trim|required');

  $this->form_validation->set_rules('id', 'id', 'trim');
  $this->form_validation->set_error_delimiters('<span class="text-danger">', '</span>');
    }

}

Buat sebuah Model Baru dengan nama Biodata_model.php (dalam folder application/models)

<?php

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

class Biodata_model extends CI_Model
{

    public $table = 'biodata';
    public $id = 'id';
    public $order = 'DESC';

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

    // get data by id
    function get_by_id($id)
    {
        $this->db->where($this->id, $id);
        return $this->db->get($this->table)->row();
    }
    
    // get total rows
    function total_rows($q = NULL) {
        $this->db->like('id', $q);
  $this->db->or_like('nim', $q);
  $this->db->or_like('nama', $q);
  $this->db->or_like('tempat_lahir', $q);
  $this->db->or_like('tgl_lahir', $q);
  $this->db->or_like('alamat', $q);
  $this->db->or_like('jur', $q);
  $this->db->or_like('no_hp', $q);
  $this->db->from($this->table);
        return $this->db->count_all_results();
    }

    // get data with limit and search
    function get_limit_data($limit, $start = 0, $q = NULL) {
        $this->db->order_by($this->id, $this->order);
        $this->db->like('id', $q);
  $this->db->or_like('nim', $q);
  $this->db->or_like('nama', $q);
  $this->db->or_like('tempat_lahir', $q);
  $this->db->or_like('tgl_lahir', $q);
  $this->db->or_like('alamat', $q);
  $this->db->or_like('jur', $q);
  $this->db->or_like('no_hp', $q);
  $this->db->limit($limit, $start);
        return $this->db->get($this->table)->result();
    }

    // insert data
    function insert($data)
    {
        $this->db->insert($this->table, $data);
    }

    // update data
    function update($id, $data)
    {
        $this->db->where($this->id, $id);
        $this->db->update($this->table, $data);
    }

    // delete data
    function delete($id)
    {
        $this->db->where($this->id, $id);
        $this->db->delete($this->table);
    }

}

Buat folder baru didalam folder views (application/views) dengan nama biodata, kemudian buatlah 3 (tiga) buah file didalamnya (application/views/biodata/) dengan nama biodata_list.php, biodata_form.php dan biodata_read.php

biodata_list.php (dalam folder application/views/biodata)

<!doctype html>
<html>
    <head>
        <title>DAFTAR BIODATA</title>
        <link rel="stylesheet" href="<?php echo base_url('bootstrap/css/bootstrap.min.css') ?>"/>
        <style>
            body{
                padding: 15px;
            }
        </style>
    </head>
    <body>
        <h2 style="margin-top:0px">Biodata</h2>
        <div class="row" style="margin-bottom: 10px">
            <div class="col-md-4">
                <a href="<?php echo base_url('biodata/create');?>" class="btn btn-primary"><i class="glyphicon glyphicon-plus"></i> Tambah Data</a>
            </div>
            <div class="col-md-4 text-center">
                <div style="margin-top: 8px" id="message">
                    <?php echo $this->session->userdata('message') <> '' ? $this->session->userdata('message') : ''; ?>
                </div>
            </div>
            <div class="col-md-1 text-right">
            </div>
            <div class="col-md-3 text-right">
                <form action="<?php echo site_url('biodata/index'); ?>" class="form-inline" method="get">
                    <div class="input-group">
                        <input type="text" class="form-control" name="q" value="<?php echo $q; ?>">
                        <span class="input-group-btn">
                            <?php 
                                if ($q <> '')
                                {
                                    ?>
                                    <a href="<?php echo site_url('biodata'); ?>" class="btn btn-default">Reset</a>
                                    <?php
                                }
                            ?>
                          <button class="btn btn-primary" type="submit">Search</button>
                        </span>
                    </div>
                </form>
            </div>
        </div>
        <table class="table table-bordered" style="margin-bottom: 10px">
            <tr>
        <th>No</th>
    <th>Nim</th>
    <th>Nama</th>
    <th>Jk</th>
    <th>Tempat Lahir</th>
    <th>Tgl Lahir</th>
    <th>Alamat</th>
    <th>Jur</th>
    <th>No Hp</th>
    <th>Foto</th>
    <th>Action</th>
            </tr><?php
            foreach ($biodata_data as $biodata)
            {
                ?>
                <tr>
      <td width="80px"><?php echo ++$start ?></td>
      <td><?php echo $biodata->nim ?></td>
      <td><?php echo $biodata->nama ?></td>
      <td><?php echo $biodata->jk ?></td>
      <td><?php echo $biodata->tempat_lahir ?></td>
      <td><?php echo $biodata->tgl_lahir ?></td>
      <td><?php echo $biodata->alamat ?></td>
      <td><?php echo $biodata->jur ?></td>
      <td><?php echo $biodata->no_hp ?></td>
      <td><?php echo $biodata->foto ?></td>
      <td style="text-align:center" width="200px">
        <?php 
        echo anchor(site_url('biodata/read/'.$biodata->id),'Read'); 
        echo ' | '; 
        echo anchor(site_url('biodata/update/'.$biodata->id),'Update'); 
        echo ' | '; 
        echo anchor(site_url('biodata/delete/'.$biodata->id),'Delete','onclick="javasciprt: return confirm(\'Anda Yakin ?\')"'); 
        ?>
      </td>
    </tr>
                <?php
            }
            ?>
        </table>
        <div class="row">
            <div class="col-md-6">
                <a href="#" class="btn btn-primary">Total Record : <?php echo $total_rows ?></a>
      </div>
            <div class="col-md-6 text-right">
                <?php echo $pagination ?>
            </div>
        </div>
    </body>
</html>

biodata_form.php (dalam folder application/views/biodata)

<!doctype html>
<html>
    <head>
        <title>FORM BIODATA</title>
        <link rel="stylesheet" href="<?php echo base_url('bootstrap/css/bootstrap.min.css') ?>"/>
        <style>
            body{
                padding: 15px;
            }
        </style>
    </head>
    <body>
        <h2 style="margin-top:0px">Biodata <?php echo $button ?></h2>
        <form action="<?php echo $action; ?>" method="post">
      <div class="form-group">
            <label for="varchar">Nim <?php echo form_error('nim') ?></label>
            <input type="text" class="form-control" name="nim" id="nim" placeholder="Nim" value="<?php echo $nim; ?>" />
        </div>
      <div class="form-group">
            <label for="varchar">Nama <?php echo form_error('nama') ?></label>
            <input type="text" class="form-control" name="nama" id="nama" placeholder="Nama" value="<?php echo $nama; ?>" />
        </div>
      <div class="form-group">
            <label for="int">Jk <?php echo form_error('jk') ?></label>
            <input type="text" class="form-control" name="jk" id="jk" placeholder="Jk" value="<?php echo $jk; ?>" />
        </div>
      <div class="form-group">
            <label for="int">Tempat Lahir <?php echo form_error('tempat_lahir') ?></label>
            <input type="text" class="form-control" name="tempat_lahir" id="tempat_lahir" placeholder="Tempat Lahir" value="<?php echo $tempat_lahir; ?>" />
        </div>
      <div class="form-group">
            <label for="date">Tgl Lahir <?php echo form_error('tgl_lahir') ?></label>
            <input type="text" class="form-control" name="tgl_lahir" id="tgl_lahir" placeholder="Tgl Lahir" value="<?php echo $tgl_lahir; ?>" />
        </div>
      <div class="form-group">
            <label for="alamat">Alamat <?php echo form_error('alamat') ?></label>
            <textarea class="form-control" rows="3" name="alamat" id="alamat" placeholder="Alamat"><?php echo $alamat; ?></textarea>
        </div>
      <div class="form-group">
            <label for="int">Jur <?php echo form_error('jur') ?></label>
            <input type="text" class="form-control" name="jur" id="jur" placeholder="Jur" value="<?php echo $jur; ?>" />
        </div>
      <div class="form-group">
            <label for="varchar">No Hp <?php echo form_error('no_hp') ?></label>
            <input type="text" class="form-control" name="no_hp" id="no_hp" placeholder="No Hp" value="<?php echo $no_hp; ?>" />
        </div>
      <div class="form-group">
            <label for="varchar">Foto <?php echo form_error('foto') ?></label>
            <input type="text" class="form-control" name="foto" id="foto" placeholder="Foto" value="<?php echo $foto; ?>" />
        </div>
      <input type="hidden" name="id" value="<?php echo $id; ?>" /> 
      <button type="submit" class="btn btn-primary"><?php echo $button ?></button> 
      <a href="<?php echo site_url('biodata') ?>" class="btn btn-default">Cancel</a>
  </form>
    </body>
</html>

biodata_read.php (dalam folder application/views/biodata)

<!doctype html>
<html>
    <head>
        <title>DETAIL BIODATA</title>
        <link rel="stylesheet" href="<?php echo base_url('bootstrap/css/bootstrap.min.css') ?>"/>
        <style>
            body{
                padding: 15px;
            }
        </style>
    </head>
    <body>
        <h2 style="margin-top:0px">Biodata</h2>
        <table class="table">
      <tr><td>Nim</td><td><?php echo $nim; ?></td></tr>
      <tr><td>Nama</td><td><?php echo $nama; ?></td></tr>
      <tr><td>Jk</td><td><?php echo $jk; ?></td></tr>
      <tr><td>Tempat Lahir</td><td><?php echo $tempat_lahir; ?></td></tr>
      <tr><td>Tgl Lahir</td><td><?php echo $tgl_lahir; ?></td></tr>
      <tr><td>Alamat</td><td><?php echo $alamat; ?></td></tr>
      <tr><td>Jur</td><td><?php echo $jur; ?></td></tr>
      <tr><td>No Hp</td><td><?php echo $no_hp; ?></td></tr>
      <tr><td>Foto</td><td><?php echo $foto; ?></td></tr>
      <tr><td></td><td><a href="<?php echo site_url('biodata') ?>" class="btn btn-default">Cancel</a></td></tr>
  </table>
        </body>
</html>

 

Recommended For You

About the Author: adyrhs

Leave a Reply

Your email address will not be published. Required fields are marked *