Tutorial JSP [Dasar] – Mencari Data dengan JSP

by alfianh · December 20, 2015

Pada tutorial kali ini akan dibahas mengenai langkah-langkah membuat sebuah halaman web dengan JSP yang berfungsi untuk mencari data yang kita simpan di database.

Jika berbicara data yang sangat banyak, kita sebagai pengembang sebaiknya menyediakan fitur pencarian data sehingga dapat membantu pengguna untuk menemukan data yang diperlukan.

Berikut ini adalah langkah-langkah untuk mencari data dengan JSP :

Membuat Form HTML untuk mengetikan kata kunci alias keyword
(Form HTML untuk Pencarian)
Membuat kode JSP untuk menangkap kata kunci yang diketikan pengguna dan menampilkan hasil pencarian dari Database kedalam sebuah tabel HTML

Masih menggunakan Studi Kasus yang sama, yaitu Pengelolaan Daftar Anggota, kita akan coba untuk mencoba langkah pertama.

FORM HTML untuk Pencarian

Form HTML yang kita buat disini cukup sederhana. Form HTML yang diperlukan untuk mengetikan kata kunci, hanya terdiri dari 1 buah textfield dan 1 buah tombol. Berikut adalah kode HTMLnya :

Penjelasan Kode :

Baris 1 : Membuat sebuah kotak bergaris yang berfungsi untuk mengelompokkan elemen HTML FORM yang ada didalamnya (*Lihat Gambar : Form HTML Pencarian dibawah).
Baris 2 : Tag HTML <legend> berfungsi untuk memberikan judul dari Kotak yang dibuat oleh Tag HTML <fieldset>
Baris 3 : Tag HTML Form yang mendefinisikan bahwa data yang diisikan pada FORM akan di proses di halaman “search_result.jsp” dan dikirim menggunakan method“post”.
Baris 4 : Label dengan teks “Kata Kunci” dan sebuah Text Field untuk menuliskan kata kunci.
Baris 5 : Sebuah tombol submit yang memiliki label “Cari”.

Jika tidak terdapat kendala apapun, FORM HTML tersebut akan tampil seperti gambar berikut ini pada browser :

Kode JSP untuk Menangkap Kata Kunci

Seperti apa yang sudah dijelaskan diatas, bahwa kata kunci yang diketikan oleh pengguna pada FORM HTML, akan diproses di halaman search_result.jsp. Maka buatah terlebih dahulu halaman JSP dengan nama search_result.jsp.

Berikut ini adalah kode JSP untuk menangkap kata kunci yang diketikan oleh pengguna pda Form Pencarian :

Penjelasan Kode :

Baris 2 : Menangkap kata kunci yang diketikan oleh pengguna. (Lihat atributname=”kata_kunci” pada textfield di FORM Pencarian). nilai kata kunci yang ditangkap akan disimpan pada sebuah variabel bernama kata_kunci.
Baris 5-6 : Koneksi ke database Mysql. tepatnya koneksi ke Database yang bernama WADKelompok4 dengan menggunakan username = root dan password = null.
Baris 7 : Pengecekkan apakah koneksi ke Database berhasil atau tidak. Jika berhasil maka kode pada baris 9-16 akan dieksekusi atau dijalankan.
Baris 9 : SQL Query yang digunakan untuk mencari nama anggota yang mirip atau sama dengan kata kunci yang diketikan oleh pengguna. Bahasa lain dari SELECT * FROM daftar_anggota WHERE nama LIKE ‘%kata_kunci%’ adalah “Cari data dari tabel daftar_anggota yang namanya mirip atau sama dengan kata kunci“
Baris 10-16 : Menampilkan hasil pencarian atau data yang ditemukan kedalam sebuah tabel HTML.