| Prime Time

Laravel #16 : Membuat Pencarian Pada Laravel

Laravel
6:32 am

Form pencarian yang akan kita buat adalah form pencarian pada data pegawai yang sudah kita buat pada tutorial sebelumnya.

Silahkan teman-teman ikuti tutorial sebelumnya jika belum, agar penjelasan tentang cara membuat pencarian pada laravel ini lebih mudah teman-teman pahami.

Persiapan

Akan saya ulang sekilas. untuk sekedar memastikan kembali. pastikan teman-teman sudah mempunyai database dan sebuah tabel yang akan kita buat pencarian data pada tabel tersebut.

Pada tutorial ini kita sudah mempunyai database dengan nama ‘belajar_laravel’. dan sebuah tabel dengan nama ‘pegawai’.

Silahkan teman-teman buat terlebih dulu jika belum.

Atau untuk menghemat waktu silahkan teman-teman import sql berikut ke database ‘belajar_laravel’.

pegawai.sql

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

— phpMyAdmin SQL Dump

— version 4.8.0.1

— https://www.phpmyadmin.net/

—

— Host: localhost

— Generation Time: Dec 16, 2018 at 01:33 PM

— Server version: 10.1.32–MariaDB

— PHP Version: 5.6.36

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: `belajar_laravel`

—

— ——————————————————–

—

— Table structure for table `pegawai`

—

CREATE TABLE `pegawai` (

`pegawai_id` int(11) NOT NULL,

`pegawai_nama` varchar(50) NOT NULL,

`pegawai_jabatan` varchar(20) NOT NULL,

`pegawai_umur` int(11) NOT NULL,

`pegawai_alamat` text NOT NULL

) ENGINE=InnoDB DEFAULT CHARSET=latin1;

—

— Dumping data for table `pegawai`

—

INSERT INTO `pegawai` (`pegawai_id`, `pegawai_nama`, `pegawai_jabatan`, `pegawai_umur`, `pegawai_alamat`) VALUES

(2, ‘Diki Alfarabi Hadi’, ‘Staff IT’, 26, ‘Jl. Merak Putih’),

(4, ‘Malas Ngoding’, ‘Programmer’, 30, ‘Jl. Cendrawasih nomor 31’),

(7, ‘Joni’, ‘Web Designer’, 25, ‘Jl. Panglateh’),

(8, ‘Elma Sudiati’, ‘quo’, 38, ‘Gg. Cikapayang No. 255, Sungai Penuh 32691, Riau’),

(9, ‘Slamet Lega Rajata S.Farm’, ‘voluptatem’, 32, ‘Gg. Supono No. 84, Sawahlunto 47885, SulSel’),

(10, ‘Jaya Naradi Situmorang’, ‘quasi’, 33, ‘Dk. Imam Bonjol No. 814, Palu 46518, SumUt’),

(11, ‘Rendy Habibi S.Psi’, ‘sit’, 37, ‘Gg. Basuki No. 314, Administrasi Jakarta Pusat 73176, NTB’),

(12, ‘Yahya Sinaga’, ‘enim’, 26, ‘Ki. Industri No. 238, Sungai Penuh 38002, SulSel’),

(13, ‘Hesti Janet Hasanah S.Sos’, ‘est’, 35, ‘Dk. Wahidin Sudirohusodo No. 637, Surabaya 44801, Banten’),

(14, ‘Sari Rahmi Melani’, ‘laborum’, 36, ‘Psr. Dipatiukur No. 227, Balikpapan 19234, SulTeng’),

(15, ‘Clara Wahyuni’, ‘eveniet’, 38, ‘Jln. Otista No. 163, Dumai 91798, KalUt’),

(16, ‘Dasa Jais Maheswara’, ‘esse’, 32, ‘Kpg. Radio No. 94, Padangpanjang 14989, Bali’),

(17, ‘Viktor Prasasta’, ‘sunt’, 27, ‘Jln. BKR No. 694, Surakarta 95932, NTB’),

(18, ‘Lurhur Damanik’, ‘nemo’, 29, ‘Psr. Salak No. 990, Bau-Bau 25079, SulSel’),

(19, ‘Zelaya Nasyidah’, ‘sit’, 29, ‘Jr. Kali No. 589, Administrasi Jakarta Barat 96388, Gorontalo’),

(20, ‘Oman Damanik’, ‘maiores’, 28, ‘Psr. Taman No. 461, Banjarbaru 37220, Maluku’),

(21, ‘Lili Anggraini’, ‘id’, 25, ‘Jr. Baranang No. 631, Pariaman 57837, JaTim’),

(22, ‘Harto Prabowo’, ‘quos’, 38, ‘Jln. Ki Hajar Dewantara No. 213, Tual 51023, Jambi’),

(23, ‘Kanda Habibi’, ‘nam’, 35, ‘Kpg. Baan No. 69, Blitar 72288, Lampung’),

(24, ‘Wani Prastuti’, ‘doloremque’, 33, ‘Gg. Bakau No. 67, Pagar Alam 78006, Papua’),

(25, ‘Vero Natsir’, ‘illum’, 34, ‘Ds. Salak No. 391, Pontianak 80916, KalTeng’),

(26, ‘Paris Hani Nuraini S.IP’, ‘quo’, 39, ‘Ds. Dahlia No. 744, Ambon 99599, KalTeng’),

(27, ‘Padma Salimah Suartini S.H.’, ‘ab’, 38, ‘Ds. Bawal No. 241, Salatiga 42046, Papua’),

(28, ‘Kasiran Pangeran Prasetyo’, ‘aut’, 35, ‘Ki. Fajar No. 272, Prabumulih 45913, Aceh’),

(29, ‘Aslijan Sirait’, ‘repellendus’, 25, ‘Gg. Ujung No. 11, Pekanbaru 57006, MalUt’),

(30, ‘Ira Nuraini’, ‘magnam’, 36, ‘Gg. Yohanes No. 441, Jambi 46510, SumSel’),

(31, ‘Kiandra Puspita’, ‘enim’, 40, ‘Dk. Kali No. 33, Pontianak 12025, MalUt’),

(32, ‘Harsaya Prayoga’, ‘esse’, 25, ‘Kpg. Dago No. 928, Kupang 92150, Bali’),

(33, ‘Mala Lailasari’, ‘cupiditate’, 25, ‘Dk. Wahidin Sudirohusodo No. 13, Cirebon 44084, Bali’),

(34, ‘Ayu Zizi Kuswandari’, ‘voluptas’, 32, ‘Psr. Laksamana No. 259, Batu 93531, KalSel’),

(35, ‘Adika Wasita’, ‘cum’, 29, ‘Jr. Ki Hajar Dewantara No. 725, Sawahlunto 19536, Gorontalo’),

(36, ‘Najib Omar Anggriawan’, ‘omnis’, 25, ‘Kpg. Suniaraja No. 917, Tanjung Pinang 37324, SumUt’),

(37, ‘Edward Tomi Saptono M.M.’, ‘praesentium’, 29, ‘Dk. Sadang Serang No. 852, Surakarta 37423, SulTeng’),

(38, ‘Ajimat Ardianto M.Kom.’, ‘excepturi’, 40, ‘Gg. Bakti No. 251, Parepare 48583, Maluku’),

(39, ‘Carub Gamblang Prasasta S.H.’, ‘inventore’, 34, ‘Gg. Cikutra Barat No. 259, Gunungsitoli 25016, SumUt’),

(40, ‘Dimaz Prabowo S.Gz’, ‘libero’, 26, ‘Ds. Baya Kali Bungur No. 472, Bitung 95442, Lampung’),

(41, ‘Siti Farida’, ‘autem’, 37, ‘Dk. Hang No. 1, Bengkulu 71277, SumUt’),

(42, ‘Uchita Astuti’, ‘recusandae’, 40, ‘Ki. Sutami No. 779, Pontianak 99497, JaTim’),

(43, ‘Zalindra Ghaliyati Puspita S.E.I’, ‘saepe’, 39, ‘Ki. Flores No. 891, Bandar Lampung 35072, SulSel’),

(44, ‘Respati Tampubolon’, ‘facere’, 31, ‘Jr. Bagas Pati No. 769, Bukittinggi 80941, SulTeng’),

(45, ‘Zulaikha Puspita’, ‘quam’, 40, ‘Gg. Baan No. 59, Pematangsiantar 98370, KalBar’),

(46, ‘Maya Andriani’, ‘voluptatibus’, 39, ‘Kpg. Warga No. 155, Payakumbuh 15521, Jambi’),

(47, ‘Tantri Putri Namaga S.T.’, ‘voluptatem’, 29, ‘Kpg. Laswi No. 427, Banjarbaru 52446, KalUt’),

(48, ‘Dimaz Rajasa M.M.’, ‘sit’, 39, ‘Gg. Madiun No. 340, Pontianak 29529, SulUt’),

(49, ‘Lintang Lalita Astuti S.Psi’, ‘beatae’, 33, ‘Kpg. Baja No. 834, Gunungsitoli 25347, PapBar’),

(50, ‘Sakura Widiastuti’, ‘exercitationem’, 35, ‘Dk. Cokroaminoto No. 844, Padangpanjang 88917, Gorontalo’),

(51, ‘Laksana Hidayat’, ‘sunt’, 40, ‘Ds. Bakau Griya Utama No. 757, Bandar Lampung 42512, SumSel’),

(52, ‘Faizah Kusmawati S.Ked’, ‘tempora’, 37, ‘Ds. Badak No. 423, Pangkal Pinang 76234, SumSel’),

(53, ‘Tami Nilam Widiastuti’, ‘esse’, 40, ‘Psr. Bahagia No. 723, Jayapura 94256, Maluku’),

(54, ‘Tina Maryati’, ‘est’, 36, ‘Jln. Lumban Tobing No. 182, Bau-Bau 47907, SumUt’),

(55, ‘Enteng Habibi S.Pd’, ‘voluptate’, 39, ‘Jr. Achmad Yani No. 211, Tasikmalaya 38586, JaBar’),

(56, ‘Waluyo Samosir’, ‘ipsum’, 39, ‘Ki. Badak No. 252, Sorong 37092, SulTeng’),

(57, ‘Malika Eli Kusmawati’, ‘exercitationem’, 32, ‘Ds. Banda No. 618, Tanjung Pinang 93287, Gorontalo’);

—

— Indexes for dumped tables

—

— Indexes for table `pegawai`

—

ALTER TABLE `pegawai`

ADD PRIMARY KEY (`pegawai_id`);

—

— AUTO_INCREMENT for dumped tables

—

— AUTO_INCREMENT for table `pegawai`

—

ALTER TABLE `pegawai`

MODIFY `pegawai_id` int(11) NOT NULL AUTO_INCREMENT, AUTO_INCREMENT=58;

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 */;

Dan jangan lupa untuk membuat konfigurasi database project laravel nya pada file .env.

Membuat Pencarian Data Pada Laravel

Oke langsung saja kita mulai

Untuk membuat pencarian menggunakan laravel, kita membutuhkan 2 buah route dan 2 buah method.

Baca lagi : Belajar Route dan View pada Laravel

Buat route untuk menampilkan data pegawai secara default (tanpa pencarian). dan 1 buah route untuk mengarahkan ke method yang menangani proses pencarian.

belajar_laravel/routes/web.php

1 2	Route::get(‘/pegawai’,‘PegawaiController@index’); Route::get(‘/pegawai/cari’,‘PegawaiController@cari’);

Perhatikan pada route di atas. pada route

1	Route::get(‘/pegawai’,‘PegawaiController@index’);

kita akan menampilkan semua data pegawai. kita juga akan membuat sebuah form pencarian pada method index. dan pada route

1	Route::get(‘/pegawai/cari’,‘PegawaiController@cari’);

kita akan menjadikan method cari sebagai method yang menangani data pencarian yang dikirim dari form pencarian yang dikirim dari method index.

oke, saya rasa teman-teman sudah familiar dengan route, method, controller dan views pada laravel. karena sudah berulang-ulang kali kita bahas pada tutorial sebelumnya.

Kemudian buat controller PegawaiController.php jika belum. untuk teman-teman yang sudah mengikuti tutorial laravel di malasngoding.com pasti sudah punya controller PegawaiController.php.

belajar_laravel/app/Http/controllers/PegawaiController.php

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

use Illuminate\Support\Facades\DB;

class PegawaiController extends Controller

{

public function index()

{

// mengambil data dari table pegawai

$pegawai = DB::table(‘pegawai’)->paginate(10);

// mengirim data pegawai ke view index

return view(‘index’,[‘pegawai’ => $pegawai]);

}

public function cari(Request $request)

{

// menangkap data pencarian

$cari = $request–>cari;

// mengambil data dari table pegawai sesuai pencarian data

$pegawai = DB::table(‘pegawai’)

–>where(‘pegawai_nama’,‘like’,“%”.$cari.“%”)

–>paginate();

// mengirim data pegawai ke view index

return view(‘index’,[‘pegawai’ => $pegawai]);

}

Seperti yang sudah kita tetapkan pada route, ada 2 buah method yang akan kita gunakan, yaitu method yang akan menampilkan data pegawai yang belum di proses. dan method cari yang melakukan proses pencarian data dan menampilkan datanya kembali.

Karena pada method index kita menampilkan data pegawai ke view index. maka sekarang buat view baru dengan nama index.blade.php

belajar_laravel/resources/views/index.blade.php

<!DOCTYPE html>

<html>

<head>

<title>Tutorial Membuat Pencarian Pada Laravel – www.malasngoding.com</title>

</head>

<body>

.pagination li{

float: left;

list-style-type: none;

margin:5px;

}

</style>

<h2><a href=“https://www.malasngoding.com”>www.malasngoding.com</a></h2>

<h3>Data Pegawai</h3>

<p>Cari Data Pegawai :</p>

</form>

<br/>

<tr>

<th>Jabatan</th>

<th>Alamat</th>

</tr>

@foreach($pegawai as $p)

<tr>

<td>{{ $p–>pegawai_nama }}</td>

<td>{{ $p–>pegawai_jabatan }}</td>

<td>{{ $p–>pegawai_umur }}</td>

<td>{{ $p–>pegawai_alamat }}</td>

</tr>

@endforeach

</table>

<br/>

Halaman : {{ $pegawai–>currentPage() }} <br/>

Jumlah Data : {{ $pegawai–>total() }} <br/>

Data Per Halaman : {{ $pegawai–>perPage() }} <br/>

</body>

</html>

Pada view index ini kita membuat sebuah form untuk pencarian data.

<p>Cari Data Pegawai :</p>

</form>

Kemudian perhatikan pada method cari.

Inti dari form pencarian ini ada pada method cari.

public function cari(Request $request)

{

// menangkap data pencarian

$cari = $request–>cari;

// mengambil data dari table pegawai sesuai pencarian data

$pegawai = DB::table(‘pegawai’)

–>where(‘pegawai_nama’,‘like’,“%”.$cari.“%”)

–>paginate();

// mengirim data pegawai ke view index

return view(‘index’,[‘pegawai’ => $pegawai]);

}

pada method cari ini kita tangkap data yang dikirim dari form pencarian.

1 2	// menangkap data pencarian $cari = $request–>cari;

kemudian kita cari data nya pada table pegawai dengan menggunakan fungsi like. untuk mencari data yang mirip dengan data yang di input pada form pencarian.

Dan terakhir kita tampilkan data nya kembali ke view index.