Tutorial Membuat Search Pagination Session di Codeigniter

Tutorial kali ini kita akan mempelajari cara pembuatan sistem pencarian pada tabel data yang memiliki pagination dengan bantuan session di Codeigniter,tentu kalian akan bertanya untuk apa session dalam pagination akan lebih mudah dipahami setelah kalian membandingkan pagination biasa denganpagination session, cukup pembahasannya sekarang kita akan mulai.

codeigniter search pagination session

Ilustrasi Foto via cnblogs.com

Pertama buat database dengan nama latihan, tabel dan masukan beberapa data, berikut sqlnya :

--
-- Database: `latihan`
--

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

--
-- Struktur dari tabel `pagination`
--

CREATE TABLE IF NOT EXISTS `pagination` (
`nim` bigint(20) NOT NULL,
  `nama` varchar(50) NOT NULL,
  `jurusan` varchar(30) NOT NULL,
  `alamat` text NOT NULL
) ENGINE=InnoDB AUTO_INCREMENT=111999030 DEFAULT CHARSET=latin1;

--
-- Dumping data untuk tabel `pagination`
--

INSERT INTO `pagination` (`nim`, `nama`, `jurusan`, `alamat`) VALUES
(111999014, 'Rahmayanti', 'PGSD', 'Kp. Mekarsari RT.15/03 No.33'),
(111999021, 'Muhammad Yusuf Hamdani', 'Teknik Informatika', 'Jln. Cipaku Haji RT.02/07 No.15'),
(111999023, 'Putri Andini', 'Sistem Informasi', 'Kp. Mekarsari RT/RW 22/55 No.34'),
(111999025, 'Anggra Triawan Skom', 'Teknik Infirmatika S2', 'Kp. Buntar RT.02 / RW.09 Kel. Ciawi Kec.Bogor Selatan'),
(111999027, 'Alisya Rahmadani', 'PGBK', 'Perumahan Pakuan Hill, Monte carlo, Ciawi Bogor Selatan'),
(111999029, 'Muhammad Afnan', 'Hukum', 'Perumahan Pakuan Hill, Monte carlo, Ciawi Bogor Selatan');

--
-- Indexes for dumped tables
--

--
-- Indexes for table `pagination`
--
ALTER TABLE `pagination`
 ADD PRIMARY KEY (`nim`);

--
-- AUTO_INCREMENT for dumped tables
--

--
-- AUTO_INCREMENT for table `pagination`
--
ALTER TABLE `pagination`
MODIFY `nim` bigint(20) NOT NULL AUTO_INCREMENT,AUTO_INCREMENT=111999030;
SQL Database

Stuktur database pada phpmyadmin akan terlihat seperti dibawah ini

ps1

Tabel yang sudah diisi akan tampak seperti dibawah ini

ps2

Dalam tutorial kali ini kita membutuhkan file .htaccess (file ini tidak memiliki nama, hanya memiliki ekstensi .htaccess) untuk menghapus index.php pada url, silahkan buat file baru kemudian simpan file tersebut pada dalam folder pagination_session_ci / project.

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

Untuk mempermudah sahabat bisa download .htaccess

Buka file autoload.php, yang berlokasi di application/config/autoload.php, kemudian cari dan ubah bagian helper dan libraries seperti ini:

$autoload['libraries'] = array('database', 'session', 'pagination');
$autoload['helper'] = array('url', 'file', 'form');
application/config/autoload.php

Buka file config.php, yang berlokasi di application/config/config.php, kemudian cari dan ubah seperti ini :

$config['base_url'] = 'http://localhost/pagination_session_ci/';

$config['encryption_key'] = 'TWD';
application/config/config.php

Buka file database.php, yang berlokasi di application/config/database.php, kemudian cari dan ubah seperti ini :

$active_group = 'default';
$active_record = TRUE;

$db['default']['hostname'] = 'localhost';
$db['default']['username'] = 'root';
$db['default']['password'] = '';
$db['default']['database'] = 'latihan';
$db['default']['dbdriver'] = 'mysql';
$db['default']['dbprefix'] = '';
$db['default']['pconnect'] = TRUE;
$db['default']['db_debug'] = TRUE;
$db['default']['cache_on'] = FALSE;
$db['default']['cachedir'] = '';
$db['default']['char_set'] = 'utf8';
$db['default']['dbcollat'] = 'utf8_general_ci';
$db['default']['swap_pre'] = '';
$db['default']['autoinit'] = TRUE;
$db['default']['stricton'] = FALSE;
application/config/database.php

Kemudian buka file welcome.php, controllers/welcome.php dan edit seperti dibawah ini :

<?php if ( ! defined('BASEPATH')) 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 http://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_ringkasan');
		}


		// 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>
application/controllers/welcome.php

Buat file baru modul.php didalam folder models, kemudian masukan script dibawah ini :



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;
	}

}

?>
application/models/modul.php

Untuk menampilkan data buat file baru index.php didalam folder views, kemudian masukan script dibawah ini :


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

	div class="wrap">
		h1>Search Pagination Session dengan Codeigniterh1>

		form action=" 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>NIMth>
					th>Namath>
					th>Jurusanth>
					th>Alamatth>
				tr>
			thead>
			tbody>
				
				if (count($ListBerita) > 0) {
					foreach($ListBerita as $row)
					{
						echo "
"; ?> tr> td valign="top"> echo $row['nim']; ?>td> td valign="top"> echo $row['nama']; ?>td> td valign="top"> echo $row['jurusan']; ?>td> td valign="top"> echo $row['alamat']; ?>td> tr> echo "
"
; } 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; 2015 - Tutorial Web Design</p></center> </div> </body> </html>
application/views/index.php

Terakhir kita perlu css untuk mengatur desain agar terlihat lebih menarik, buat folder assets/css/ berinama file tersebuh default.css :

body {
	font-family: verdana,arial,sans-serif;
	margin: 0px;
	padding: 0px;
}

* {
	font-size: 13px;
}

.wrap {
	position: relative;
	top: 20px;
	width: 780px;
	margin: auto;
}


h1 {
	text-align: center;
	font-size: 24px;
}

input.nama {
	font-size:28px; 
	width:380px;
}

input, textarea {
    border: 1px solid #CCC;
    padding: 5px;
}
assets/css/default.css

Berikut stuktur file dan folder Search pagination session dengan codeigniter :

ps3

 

Jika semua sudah tersetuktur seperti gambar diatas dan kalian sudah menyelesaikan semua tutorial dengan baik, sekarang kita coba menjalankan aplikasi buka browser dan lihat hasilnya akan seperti ini :

ps4 ps5 ps6

 

Download Search Panination Session Dengan Codeigniter

Sekian tutorial saya kali ini semoga bisa menambah pengetahuan sahabat ^_^

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: