Membuat CRUD dengan Java Web : Menampilkan Data dari Database

Membuat CRUD dengan Java Web : Menampilkan Data dari Database – Pada artikel sebelumnya kita sudah menyiapkan tool-tool apa saja yang akan digunakan untuk membuat crud dengan java web ini. Jika anda terlewat pada artikel sebelumnya, sebaiknya anda membaca terlebih dahulu artikel Membuat CRUD dengan Java Web : Persiapan Awal. Karena ada beberapa hal yang harus anda siapkan terlebih dahulu untuk melangkah pada tutorial membuat crud dengan java web menampilkan data dari database. Seperti menyiapkan library dan juga package. Seperti yang sudah saya jelaskan pada artikel sebelumnya kita akan Membuat CRUD dengan Java Web menggunakan pattern MVC.

Cara Menampilkan Data dari Database

Langkah pertama yang harus disiapkan untuk membuat crud dengan java web adalah menampilkan data dari database, tapi sebelumnya kita membuat database terlebih dahulu dengan nama latihan_crud dan table dengan nama tb_user, lalu mengisi beberapa record yang nantinya akan di tampilkan dari database melalui browser. Anda bisa dumping sql berikut ini:

-- phpMyAdmin SQL Dump
-- version 4.2.7.1
-- http://www.phpmyadmin.net
--
-- Host: 127.0.0.1
-- Generation Time: Nov 21, 2016 at 12:51 PM
-- Server version: 5.6.20
-- PHP Version: 5.5.15

SET SQL_MODE = "NO_AUTO_VALUE_ON_ZERO";
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 utf8 */;

--
-- Database: `latihan_crud`
--

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

--
-- Table structure for table `tb_user`
--

CREATE TABLE IF NOT EXISTS `tb_user` (
`id` int(5) NOT NULL,
  `nama` varchar(20) NOT NULL,
  `alamat` text NOT NULL
) ENGINE=InnoDB  DEFAULT CHARSET=latin1 AUTO_INCREMENT=3 ;

--
-- Dumping data for table `tb_user`
--

INSERT INTO `tb_user` (`id`, `nama`, `alamat`) VALUES
(1, 'Tutorialpedia', 'Jakarta'),
(2, 'Fikriansyah', 'Bandar Lampung');

--
-- Indexes for dumped tables
--

--
-- Indexes for table `tb_user`
--
ALTER TABLE `tb_user`
 ADD PRIMARY KEY (`id`);

--
-- AUTO_INCREMENT for dumped tables
--

--
-- AUTO_INCREMENT for table `tb_user`
--
ALTER TABLE `tb_user`
MODIFY `id` int(5) NOT NULL AUTO_INCREMENT,AUTO_INCREMENT=3;
/*!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 */;

Membuat Class Koneksi

Untuk membuat koneksi ke database kita membuat class koneksi terlebih dahulu pada package model.

Klik kanan pada package net.tutorialpedia.model yang sebelumnya telah kita buat pada artikel Membuat CRUD dengan Java Web : Persiapan Awal, lalu pilih New > Java Class dan beri nama dengan Koneksi. Lihat gambar dibawah ini

Lalu isi dengan kode berikut ini.

Koneksi.java

/*
 * To change this license header, choose License Headers in Project Properties.
 * To change this template file, choose Tools | Templates
 * and open the template in the editor.
 */
package net.tutorialpedia.model;

import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.ResultSet;
import java.sql.Statement;

/**
 *
 * @author PH4NTHOM
 */
public class Koneksi {
    private Connection conn;
    private Statement st;

    public static void ambilKoneksi() {
        try {
            String db = "jdbc:mysql://localhost:3306/latihan_crud";
            String user = "root";
            String pass = "";
            Class.forName("com.mysql.jdbc.Driver");
            Connection con = DriverManager.getConnection(db, user, pass);
        } catch (Exception x) {
            System.out.println("Terjadi kesalahan ambil koneksi : " + x);
        }
    }

    public void koneksi() {
        try {
            String db = "jdbc:mysql://localhost:3306/latihan_crud";
            String user = "root";
            String pass = "";
            Class.forName("com.mysql.jdbc.Driver");
            conn = DriverManager.getConnection(db, user, pass);
            st = conn.createStatement();
        } catch (Exception x) {

            System.out.println("Terjadi kesalahan koneksi : " + x);
        }
    }

    public void diskonek(ResultSet rs) {
        try {
            if (rs != null) {
                rs.close();
            }
            st.close();
            conn.close();
        } catch (Exception x) {
            System.out.println("Terjadi kesalahan diskoneksi : " + x);
        }
    }

    public ResultSet ambilData(String sql) {
        ResultSet rs = null;
        try {
            koneksi();
            rs = st.executeQuery(sql);
        } catch (Exception x) {
            System.out.println("Terjadi kesalahan ambil data : " + x);
        }
        return rs;
    }

    public void simpanData(String sql) {
        try {
            koneksi();
            st.executeUpdate(sql);
        } catch (Exception x) {
            System.out.println("Terjadi kesalahan simpan data : " + x);
        }
    }
}

Penjelasan:

 String db = "jdbc:mysql://localhost:3306/latihan_crud";

String db digunakan untuk mendeklarasikan nama database yang anda gunakan, pada tutorial ini saya menggunakan database dengan nama latihan_crud.

String user = "root";
String pass = "";

Sedangkan string user dan pass digunakan untuk mendeklar user dan password database MySQL anda. Jika MySQL anda tidak diberi password maka cukup kosongkan saja.

Membuat Class UserModel

Pada class user model ini digunakan untuk menyimpan semua query mysql yang didalamnya terdapat insert,update dan delete. yang mana ketiga query ini sangat di perlukan dalam membuat crud dengan java web

Klik kanan pada package net.tutorialpedia.model lalu klik New > Java Class. Isi nama dengan UserModel

Lalu buat setter dan getter berdasarkan field yang telah dibuat pada table tb_user. Anda bisa membuatnya dengan mudah melalui gambar bergerak berikut ini:

lalu tambahkan constructor di bawah String.

   Koneksi db = null;
       
    public UserModel() {
        db = new Koneksi();
    }

lalu tambahkan kode untuk menampilkan data dari database sebelum tanda kurung kurawal terakhir.

 public List tampil() {
        List<UserModel> data = new ArrayList<UserModel>();
        ResultSet rs = null;

        try {
            String sql = "select * from tb_user order by nama asc";
            rs = db.ambilData(sql);
            while (rs.next()) {
                UserModel um = new UserModel();
                um.setId(rs.getString("id"));
                um.setNama(rs.getString("nama"));
                um.setAlamat(rs.getString("alamat"));
                data.add(um);

            }
            db.diskonek(rs);
        } catch (Exception ex) {
            System.out.println("Terjadi Kesalahan Saat menampilkan data User" + ex);
        }
        return data;
    }

Sehingga hasil kode pada UserModel.java akan menjadi seperti dibawah ini.

/*
 * To change this license header, choose License Headers in Project Properties.
 * To change this template file, choose Tools | Templates
 * and open the template in the editor.
 */
package net.tutorialpedia.model;

import java.sql.ResultSet;
import java.util.ArrayList;
import java.util.List;

/**
 *
 * @author TutorialPedia
 */
public class UserModel {
   String id,nama,alamat;
   Koneksi db = null;
       
    public UserModel() {
        db = new Koneksi();
    }

    public String getId() {
        return id;
    }

    public void setId(String id) {
        this.id = id;
    }

    public String getNama() {
        return nama;
    }

    public void setNama(String nama) {
        this.nama = nama;
    }

    public String getAlamat() {
        return alamat;
    }

    public void setAlamat(String alamat) {
        this.alamat = alamat;
    }
    
    public List tampil() {
        List<UserModel> data = new ArrayList<UserModel>();
        ResultSet rs = null;

        try {
            String sql = "select * from tb_user order by nama asc";
            rs = db.ambilData(sql);
            while (rs.next()) {
                UserModel um = new UserModel();
                um.setId(rs.getString("id"));
                um.setNama(rs.getString("nama"));
                um.setAlamat(rs.getString("alamat"));
                data.add(um);

            }
            db.diskonek(rs);
        } catch (Exception ex) {
            System.out.println("Terjadi Kesalahan Saat menampilkan data User" + ex);
        }
        return data;
    }
}

Pada Class UserModel.java cukup sampai disini saja karena yang kita perlukan saat ini hanya koding tampilnya saja.

Sekarang kita beralih ke view (JSP) yang akan kita lakukan adalah menampilkan data pada web browser melalui halaman JSP (Java Server Pages).

Buka halaman index.jsp anda pada Web Pages. Lalu isi denga kode berikut ini:

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Latihan Java Web | TutorialPedia.NET</title>
    </head>
    <body>
    <center><h1>Membuat CRUD dengan Java Web | TutorialPedia.NET</h1></center>
  <table style="margin:20px auto;" border="1">
	<tr>
            <th>No</th>
            <th>Nama</th>
            <th>Alamat</th>
            <th>Action</th>
	</tr>
        <%
            UserModel km = new UserModel();
            List<UserModel> data = new ArrayList<UserModel>();
            String ket = request.getParameter("ket");
            if (ket == null) {
                data = km.tampil();
            } 
            for (int x = 0; x < data.size(); x++) {
        %>
        <tr>
            <td><%=x + 1%></td>
            <td><%=data.get(x).getNama()%></td>
            <td><%=data.get(x).getAlamat()%></td>
            <td>
                <a href="#">Edit</a>
                <a href="#">Hapus</a>
            </td>
        </tr>
        <%}%>
    </table>
    </body>
</html>

Penjelasan

        <%
            UserModel km = new UserModel();
            List<UserModel> data = new ArrayList<UserModel>();
            String ket = request.getParameter("ket");
            if (ket == null) {
                data = km.tampil();
            } 
            for (int x = 0; x < data.size(); x++) {
        %>

Merupakan fungsi pengulangan pada java yang terbungkus pada tag scriptlet  <%%>.  Jika terjadi error itu di karenakan anda belum mengimport package yang diperlukan anda bisa memperbaikinya dengan cara berikut ini.

lalu Save ALL

Jika sudah anda bisa melakukan testing dengan cara me run project, dengan cara klik kanan pada folder project anda lalu klik RUN.

ketika keterangan pada output sudah sukses, anda bisa menjalankannya pada browser dengan memasukkan alamat http://localhost:8084/latihan_crud pada browser.

Apabila tidak ada error maka akan tampil data yang sudah kita input tadi pada database seperti berikut ini:

Sampai disini kita telah berhasil membuat crud dengan java web menampilkan data dari database. Untuk tutorial kali ini kita belum bermain dengan controller karena kita belum membutuhkan request apapun. Pada tutorial membuat crud dengan java web selanjutnya kita akan belajar bagaimana menyimpan data ke database.

Sekian artikel Membuat CRUD dengan Java Web pada sub Menampilkan data dari database.

Sampai bertemu pada artikel berikutnya.

Baca :

1. Membuat CRUD dengan Java Web : Persiapan Awal

2. Membuat CRUD dengan Java Web : Menampilkan Data dari Database