Programers – Inspirasi Ku

Membuat Database untuk Codeigniter

Silahkan buka PHP Myadmin, kemudian buatlah database baru dengan nama mahasiswa

Setelah itu, buat tabel siswa dengan 6 kolom. Tabel ini nanti akan menyimpan data siswa

Kolom yang dibutuhkan:

id (Primary Key) bertipe string dengan panjang 11;
nim bertipe string dengan panjang 30.
nama bertipe string dengan panjang 30.
tmplahir bertipe string dengan panjang 30.
tgllahir bertipe date.
prodi bertipe string dengan panjang 5.

Konfigurasi Codeigniter

Silahkan buka config/database.php, kemudian isi seperti ini:

$db['default'] = array(
	'dsn'	=> '',
	'hostname' => 'localhost',
	'username' => 'root',
	'password' => '',
	'database' => 'mahasiswa',
	'dbdriver' => 'mysqli',
	'dbprefix' => '',
	'pconnect' => FALSE,
	'db_debug' => (ENVIRONMENT !== 'production'),
	'cache_on' => FALSE,
	'cachedir' => '',
	'char_set' => 'utf8',
	'dbcollat' => 'utf8_general_ci',
	'swap_pre' => '',
	'encrypt' => FALSE,
	'compress' => FALSE,
	'stricton' => FALSE,
	'failover' => array(),
	'save_queries' => TRUE
);

Berikutnya, silahkan buka config/autoload.php.

Kemudian cari $autoload['libraries'] dan tambahkan database dan session di sana.

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

Ini artinya, kita akan me-load library database dan session secara otomatis.

Apa fungsinya?

Library database akan menyediakan fungsi-fungsi untuk operasi database. Kita butuh ini, karena kita akan menggunakan database dalam aplikasi;
Library session menyediakan fungsi-fungsi untuk mengakses variabel $_SESSION. Kita butuh ini untuk menampilkan flash message dan membuat login.

Membuat Model untuk Tabel

Model merupakan class atau kode yang berhubungan dengan data.

Di dalam model, kita akan membuat pemodelan data dari database. Sehingga kita akan lebih mudah mengaksesnya.

Biasanya satu tabel, dibuatkan satu modelnya.

Silahkan buat file baru di dalam direktori application/model/ dengan nama Siswa_m.php.

Silahkan ketik kode berikut…

(ketik ya! jangan copas, agar dapat pengalaman coding, bukan pengalaman copas )

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

class Siswa_m extends CI_Model {

	public function delete()
	{
		$id = $this->input->post('id');

		$this->db->where('id', $id);
		$this->db->delete('siswa');

		return 'Data berhasil Dihapus';
	}

	public function add()
	{
		$data = array(
	        'nim' => $this->input->post('nim'),
	        'nama' => $this->input->post('nama'),
	        'tmplahir' => $this->input->post('tmplahir'),
	        'tgllahir' => $this->input->post('tgllahir'),
	        'prodi' => $this->input->post('prodi'),
		);

		$this->db->insert('siswa', $data);

		return "Data Sudah Disimpan";	
	}

	public function update()
	{
		$data = array(
	        'nim' => $this->input->post('nim'),
	        'nama' => $this->input->post('nama'),
	        'tmplahir' => $this->input->post('tmplahir'),
	        'tgllahir' => $this->input->post('tgllahir'),
	        'prodi' => $this->input->post('prodi'),
		);
		$id = $this->input->post('id');

		$this->db->where('id', $id);
		$this->db->update('siswa', $data);

		return "Data Berhasil Diupdate";
	}

	public function proses()
	{
		$p = $this->input->post('proses');
				if($p=='add')
		{
			$pesan = $this->add();
		}

		if($p=='del')
		{
			$pesan = $this->delete();
		}

		if($p=='edit')
		{
			$pesan = $this->update();
		}

		echo $pesan;
	}

}

Sudah selesai ngetiknya?

Membuat Controller

Pada Controller, kita akan memanggil method-method yang ada di dalam model untuk mendapatkan data. Setelah itu data tersebut di-render ke dalam view dengan me-load-nya. Untuk lebih jelasnya… Mari kita mulai coding.

Silahkan buat file baru di dalam folder application/controllers/ dengan nama Siswadgm.php.

Kemudian isi file Siswadgm.php dengan kode berikut:

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

class Siswadgm extends CI_Controller {

	public function __construct() 
	//fungsi auto class ketika di load
	{
		parent::__construct();
		$this->load->model('Siswa_m', 'sismod');
	}

	public function index()
	{
		$data['siswa'] = $this->db->get('siswa')->result_array();
		$this->load->view('siswadgm', $data);
	}

	public function getdata($id="")
	{
		if($id==0)
		{
			//kita kirim data kosong
			$data = array(
	        'nim' => "",
	        'nama' => "",
	        'tmplahir' => "",
	        'tgllahir' => "",
	        'prodi' => "",
		);

		}else{

		$this->db->where('id', $id);
		$data = $this->db->get('siswa')->row_array();
		// print_r($data);

		}
		echo json_encode($data);
	}

	public function proses()
	{
		$p = $this->input->post('proses');
				if($p=='add')
		{
			$pesan = $this->sismod->add();
		}

		if($p=='del')
		{
			$pesan = $this->sismod->delete();
		}

		if($p=='edit')
		{
			$pesan = $this->sismod->update();
		}

		echo $pesan;
	}

}

Membuat View

View merupakan bagian yang bertugas mengurus tampilan.

Buatlah file baru dengan nama siswa.php di dalam folder views/ Setelah itu, isi dengan kode berikut:

<!DOCTYPE html>
<html>
<head>
	<title>Identitas Mahasiswa</title>
	<link href="../css/w3.css" rel="stylesheet">
	<link rel="icon" type="text/css" href="../images/logo.png">
  	<script type="text/javascript" src="../js/jquery.js"></script>
	 <script type="text/javascript">
	    $(document).ready(function(){
	      $('a').click(function(){
	        var id = $(this).data('id');
	        var proses = $(this).data('proses');
	        // alert('saya diklik');
	        $.post('http://localhost/mahasiswa/index.php/siswadgm/getdata/'+id,
	          //{'id': id, 'proses': proses},
	          function(data, status){
	            // alert(rows);

	            var x = JSON.parse(data);

	            $('#nim').val(x.nim);
	            $('#nama').val(x.nama);
				$('#tmplahir').val(x.tmplahir);
	            $('#tgllahir').val(x.tgllahir);
	            $('#prodi').val(x.prodi);
	            $('#id').val(x.id);
	            $('#proses').val(proses);
	            document.getElementById('id01').style.display='block'
	          });
	        return false;// --> membatalkan submit default dari form
	        });
	      $('#submit').click(function(){
	      	//alert('saya di klik');
	      	$.post(
	      		'http://localhost/mahasiswa/index.php/siswadgm/proses',
	      		$('#fsiswa').serialize(),
	      		function(data, status){
	      			alert(data);
	      			window.location = 'http://localhost/mahasiswa/index.php/siswadgm';
	      		});
	      });
	    })
	 </script>
</head>
<body>
	<div class="w3-container w3-teal w3-center">
		<h1>Table Siswa</h1>
	</div>
	<div class="w3-container">
		<!--<p><a class="w3-button w3-grey w3-round-large" href="$rows[id]">Add Record</a></p>-->
		<a class="w3-button w3-green w3-round-large" data-id="0" data-proses="add">Add Record</a>
		<table class="w3-table w3-table-all">
			<tr>
				<th>No.</th>
				<th>Nim</th>
				<th>Nama</th>
				<th>Tempat Lahir</th>
				<th>Tanggal Lahir</th>
				<th>Prodi</th>
				<th>Opsi</th>
			</tr>

			<?php 
				$nomor = 1;
				foreach ($siswa as $rows) {
					echo 
					"<tr>
						<td>$nomor</td>
						<td>$rows[nim]</td>
						<td>$rows[nama]</td>
						<td>$rows[tmplahir]</td>
						<td>$rows[tgllahir]</td>
						<td>$rows[prodi]</td>
						<td>
						 <a class=\"w3-button w3-green w3-round-large\" data-id=\"$rows[id]\" data-proses=\"edit\">Edit</a>
						 <a class=\"w3-button w3-red w3-round-large\" data-id=\"$rows[id]\" data-proses=\"del\">Delete</a>
						</td>
					</tr>";		
					$nomor++;
				}

			?>
		</table><br>
	</div>

	<footer class="w3-container w3-teal w3-center">
		<p>Powered By <b>Achmad Faturohman</b></p>
    </footer>

    <!-- The Modal -->
	<div id="id01" class="w3-modal w3-animate-opacity">
		<div class="w3-modal-content w3-card-4">
	      <header class="w3-container w3-teal"> 
	        <span onclick="document.getElementById('id01').style.display='none'" 
	        class="w3-button w3-large w3-display-topright">×</span>
	        <h2>Identitas Mahasiswa</h2>
	      </header>
	      <div class="w3-container">
	        <form id="fsiswa" class="w3-container">
	              <p><label>Nim</label></p>
	              <input class="w3-input w3-border" type="text" id="nim" name="nim" value=""></td>
	              
	              <p><label>Nama</label></p>
	              <input class="w3-input w3-border" type="text" id="nama" name="nama" value=""></td>
	              
	              <p><label>Tempat Lahir</label></p>
	              <input class="w3-input w3-border" type="text" id="tmplahir" name="tmplahir" value=""></td>
	            
	              <p><label>Tanggal Lahir</label></p>
	              <input class="w3-input w3-border" type="text" id="tgllahir" name="tgllahir" value=""></td>
	              
	              <p><label>Prodi</label></p>
	              <input class="w3-input w3-border" type="text" id="prodi" name="prodi" value=""></td><br>

	              <input class="w3-input w3-border" type="hidden" id="id" name="id" value=""></td>
	              <input class="w3-input w3-border" type="hidden" id="proses" name="proses" value=""></td>
	        </form>
	      </div>
	      <footer class="w3-container w3-bar w3-teal">
	      	<p>
	      		<button id="submit" class="w3-button w3-green w3-round-large">Submit</button>
	      	</p>
	      </footer>
	      </div>
	  	</div>
	</div>
</body>
</html>

Buatlah file baru dengan nama getdata.php di dalam folder views/ Setelah itu, isi dengan kode berikut:

<!DOCTYPE html>
<html>
<head>
  <title>Identitas mahasiswa</title>
  <link href="/mahasiswa/css/w3.css" rel="stylesheet">
  <script type="text/javascript" src="/mahasiswa/js/jquery.js"></script>
  <!--<script type="text/javascript" src="<?php //echo base_url('js/jquery.js') ?>"></script>-->
  <script type="text/javascript">
    $(document).ready(function(){
      $('#myform').submit(function(){
        var id = $('#myid').val();
        // alert('saya diklik');
        $.post('http://localhost/mahasiswa/index.php/siswa/getdata/'+id,
          {},
          function(data, status){
            // alert(dt);

            var x = JSON.parse(data);

            $('#nim').val(x.nim);
            $('#nama').val(x.nama);
            $('#tmplahir').val(x.tmplahir);
            $('#tgllahir').val(x.tgllahir);
            $('#prodi').val(x.prodi);
            document.getElementById('id01').style.display='block'
          });
        return false;// --> membatalkan submit default dari form
        });
    })
  </script>
</head>
<body>
  <div class="w3-container">
    <br>
    <td><label>Search ID</label></td>
    <td>:</td>
    <form id="myform"><input type="text" id="myid" value=""></form>
    <hr>
    
  </div>

  <!-- The Modal -->
  <div id="id01" class="w3-modal">
    <div class="w3-modal-content">
      <div class="w3-container">
        <span onclick="document.getElementById('id01').style.display='none'"
        class="w3-button w3-display-topright">×</span>
        <form class="w3-container">
              <p><label>Nim</label></p>
              <input class="w3-input w3-border" type="text" id="nim" name="nim" value=""></td>
              
              <p><label>Nama</label></p>
              <input class="w3-input w3-border" type="text" id="nama" name="nama" value=""></td>
              
              <p><label>Tempat Lahir</label></p>
              <input class="w3-input w3-border" type="text" id="tmplahir" name="tmplahir" value=""></td>
            
              <p><label>Tanggal Lahir</label></p>
              <input class="w3-input w3-border" type="text" id="tgllahir" name="tgllahir" value=""></td>
              
              <p><label>Prodi</label></p>
              <input class="w3-input w3-border" type="text" id="prodi" name="prodi" value=""></td>
              <br>
        </form>
      </div>
    </div>
  </div>
</body>
</html>

Perobaan Aplikasi Aplikasi

Coba buka: http://localhost/mahasiswa/index.php/siswadgm Jika kamu tidak melihat error, maka itu artinya berhasil.

https://drive.google.com/open?id=1AdKyD3xRfZMqJ55tLjsp_yGJM7ywAr3S

silahkan gunakan link diatas untuk mendownload nya..

S	S	R	K	J	S	M
						1
2	3	4	5	6	7	8
9	10	11	12	13	14	15
16	17	18	19	20	21	22
23	24	25	26	27	28

Tag: Programers

Membuat Crud Dengan Mudah Menggunakan CodeIgniter dan My SQL