Sunday, February 26, 2017

Tutorial Membuat Sistem Pencarian Menggunakan Codeigniter MVC (search)

Cara Rusli

Hallo artikel ini  saya akan membahas mempelajari membuat  sistem pencarian di tabel data yang memiliki pagination dengan bantuan search di codeigniter, tentu kalian akan bertanya untuk apa session dalam pagination akan mudah sekali dipahami bila kalian mengikuti tutorial ini dan akan mengerti maksudnya setelah kalian membandingkan pagination biasa dengan pagination session, ok cukup dulu tentang penjelasan kita langsung saja ke tkp.





Pertama tama kalian membuat dulu data base dengan nama 'latihan' dan tabel dengan nama 'pagination'  lihat gambar seperti di bawah ini ok


didalam table isinya yaitu:

NamaJENISpanjangKeyword
Nimbigint(20)Auto_Increment
Namavarchar(50)
jurusanvarchar(30)
alamattext



lalu kita inset manual untuk isi nim nama dan jurusan lalu alamat dengan cara 
pertama anda klik nama table lalu anda cari meu tambah di atas toolbar lalu klik dan isikan untuk nim nama jurusan dan alamat  lihat gambar di bawah ini:


Setelah di isi semua lalu kalian klik kirim dan hasilnya seperti gambar di bawah ini dan untuk seterusnya lakukan hal yang sama agar nama di tabel lebih banyak coba ulangi saja cara seperti di atas setelah anda puas mengisi table nanti tampilannya akan seperti ini:


Dalam tutorial ini kalian membutuhkan file.htaccess(file ini tidak memiliki nama, namun hanya memiliki eksitensi ) untuk menghapus index,php pada url. silahkan kalian buat file baru dengan nama .hatccess pada folder codeigniter. oh ia lupa kalian harus download dulu file file codeigneternya disini
lalu kalian buat kodingan seperti di bawah ini lalu save dengan .htaccess dan disimpan di folder codeigniter ya;

1 | RewriteEngine on
2 | RewriteCond $1 !^(index\.php|resources|robots\.txt)
3 | RewriteCond %{REQUEST_FILENAME} !-F
4 | RewriteCond %{REQUEST_FILENAME} !-d
5 | RewriteRule ^(.*)$ index.php/$1 [L,QSA]

setelah folder codeigneter kalian download tadi buka file yang bernama autoload.php lalu cari dan ubah kode seperti di bawah ini yang berlokasi di folder application/config/autoload.php.
lalu kalian buka dan ubah file config.php yang berlokasi di application/config/config.php


1 | $config['base_url'] = 'http://localhost/codeigniter123';
2 | $config['encryption_key'] = 'TWD';

lalu kalian buka database.php yang berlokasi di application/config/database.php cari dan ubah seperti gambar di bawah ini y:


kemudian kalian bukan file welcome.php yang berada di controller/welcome.php dan edit seperti kode di bawah ini :



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

class Welcome extends CI_Controller {

/**
* Index Page for this controller.
*
* Maps to the following URL
* http://example.com/index.php/welcome
* - or -
* http://example.com/index.php/welcome/index
* - or -
* Since this controller is set as the default controller in
* config/routes.php, it's displayed at http://example.com/
*
* So any other public methods not prefixed with an underscore will
* map to /index.php/welcome/<method_name>
* @see https://codeigniter.com/user_guide/general/urls.html
*/
public function index()
{
if (isset($_POST['q'])){
$data['ringkasan']=$this->input->post('cari');
//se session userdata untuk pencarian, untuk paging pencarian
$this->session->set_userdata('sess_ringkasan', $data['ringkasan']);
}
else {
$data['ringkasan']=$this->session->userdata('sess_rimgkasan');
}

// load model
$this->load->model('modul');

$this->db->like('nama', $data['ringkasan']);
        $this->db->from('pagination');

// pagination limit
$pagination['base_url'] = base_url().'welcome/index/page/';
$pagination['total_rows'] = $this->db->count_all_results();
$pagination['full_tag_open'] = "<p><div class=\"pagination\" style='letter-spacing:2px;'>";
$pagination['full_tag_close'] = "</div></p>";
$pagination['cur_tag_open'] = "<span class=\"current\">";
$pagination['cur_tag_close'] = "</span>";
$pagination['num_tag_open'] = "<span class=\"disabled\">";
$pagination['num_tag_close'] = "</span>";
$pagination['per_page'] = "3";
$pagination['uri_segment'] = 4;
$pagination['num_links'] = 5;

$this->pagination->initialize($pagination);

$data['ListBerita'] = $this->modul->ambildata($pagination['per_page'],$this->uri->segment(4,0),$data['ringkasan']);

$this->load->vars($data);
$this->load->view('index');
}
}

/* End of file welcome.php */
/* Location: ./application/controllers/welcome.php */
?>

"; $pagination['cur_tag_open'] = ""; $pagination['cur_tag_close'] = ""; $pagination['num_tag_open'] = ""; $pagination['num_tag_close'] = ""; $pagination['per_page'] = "3"; $pagination['uri_segment'] = 4; $pagination['num_links'] = 5; $this->pagination->initialize($pagination); $data['ListBerita'] = $this->modul->ambildata($pagination['per_page'],$this->uri->segment(4,0),$data['ringkasan']); $this->load->vars($data); $this->load->view('index'); } } /* End of file welcome.php */ /* Location: ./application/controllers/welcome.php */ ?>
</body>
</html>







lalu kalian buat file baru model.php di folder models yang berada di application/models.
 lalu anda buat filenya  dan masukan kode di bawah ini llu save di folder models.




<?php

class Modul extends CI_Model {

// Model users
function ambildata($perPage, $uri, $ringkasan) {
$this->db->select('*');
$this->db->from('pagination');
if (!empty($ringkasan)) {
$this->db->like('nama', $ringkasan);
}
$this->db->order_by('nim','asc');
$getData = $this->db->get('', $perPage, $uri);

if ($getData->num_rows() > 0)
return $getData->result_array();
else
return null;
}

}

?>





untuk menampilkan data, buat file baru  yang diberi nama dengan index.php didalam folder views  kemudian masukan script di bawah ini.




<!DOCTYPE html>
<html>
<head>
<title>Search Pagination Session dengan Codeigniter | AZZURA Media</title>
<link rel="stylesheet" type="text/css" href="<?php echo base_url('assets/css/default.css'); ?>">
</head>
<body>

<div class="wrap">
<h1>Search Pagination Session dengan Codeigniter</h1>

<form action="<?php echo site_url('welcome/index/'); ?>" method="post">
<p>
<input type="search" name="cari" placeholder="Search Keyword..."> <input type="submit" name="q" value="Search">
</p>
<table border="1" width="780px">
<thead>
<tr>
<th>NIM</th>
<th>Nama</th>
<th>Jurusan</th>
<th>Alamat</th>
</tr>
</thead>
<tbody>
<?php
if (count($ListBerita) > 0) {
foreach($ListBerita as $row)
{
echo "<div class=\"letter\">";
?>

<tr>
<td valign="top"><?php echo $row['nim']; ?></td>
<td valign="top"><?php echo $row['nama']; ?></td>
<td valign="top"><?php echo $row['jurusan']; ?></td>
<td valign="top"><?php echo $row['alamat']; ?></td>
</tr>

<?php
echo "</div>";
}
echo "<tr><td colspan='6'><div style='background:000; float:right;'>".$this->pagination->create_links()."</div></td></tr>";
} else {
echo "<tbody><tr><td colspan='8' style='padding:10px; background:#F00; border:none; color:#FFF;'>Hasil pencarian tidak ditemukan.</td></tr></tbody>";
}
?>
</tbody>
</table>
</form>
<center><p>&copy; 2017 - Tutorial Web Cara Rusli</p></center>
</div>

</body>
</html>

Terakhir kita perlu css untuk mengatur desain agar telihat lebih menarik , buatlah folder dengan nama assets dan didalamnya buat lagi folder dengan nama css lalu buatlah secript dengan nama file default.css  lalu simpan di folder assets/css/default.css.




berikut gambar struktur nya bila anda sudah yakin benar seperti inilah strukturnya


jika semua sudah terstruktur seperti gambar di atas berarti kalian sudah berhasil menjalankan tutorial semanya.  nah sekarang kita tinggal mencobanya dengan menjalankan browser nya ya dan nanti hasilnya akan seperti gambar dibawah ini:



oke sekian dulu tutoial kali ini nanti kita buat tutorial berikutnya tentang codeigniter ya

semoga berhasil
salam sukses
Post a Comment