Cara Memasukan Data TextField Ke Dalam Database Pada JavaFX

Pembukaan

Pada tutorial dengan judul Cara Memasukan Data TextField Ke Dalam Database Pada JavaFX akan membahas bagaimana cara memasukan data kedalam database MySQL. Masih pada project yang sama dengan sebelumnya, jika tidak tahu bisa mengkuti tutorial dari awal. 

Pembahasan

Hal yang perlu dipersiaplan adalah sebuah database untuk project ini, sebelumnya kita juga sudah belajar mengenai koneksi database namun hanya menggunakan sample database dari bawaan MySQL. Buatlah database dengan nama javafx_historikal, dan buatlah sebuah tabel dengan nama tabel tbl_user.

SET SQL_MODE = "NO_AUTO_VALUE_ON_ZERO";
SET time_zone = "+00:00";

CREATE DATABASE IF NOT EXISTS `javafx_historikal` DEFAULT CHARACTER SET latin1 COLLATE latin1_swedish_ci;
USE `javafx_historikal`;

CREATE TABLE `tbl_user` (
  `id` int(11) NOT NULL,
  `username` varchar(30) NOT NULL,
  `password` varchar(255) NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=latin1;

ALTER TABLE `tbl_user`
  ADD PRIMARY KEY (`id`);

ALTER TABLE `tbl_user`
  MODIFY `id` int(11) NOT NULL AUTO_INCREMENT;

Diatas adalah script SQL, silahkan sesuaikan saja dengan database yang anda miliki. Selanjutnya kita akan buat sebuah form dengan isi TextField dan Button. Form ini berada pada file paneUser.fxml pada package tutorialjavafx, tambah komponen Controls TextField, PasswordField, Label dan Button seperti gambar berikut (pastikan anda ganti text nya juga).

Gambar 1

Jika sudah, kita beri id masing-masing komponen yang di anggap penting dalam transaksi yaitu TextField, PasswordField dan Button. Masing-masing beri nama id dengan txtUsername, txtPassword dan btnSimpan.

Gambar 2

Setelah sukses dengan fx:id, kita harus menentukan komponen yang menjalankan perintah simpan. Didalam kasus ini btnSimpan (Tombol Simpan) lah yang berhak. Tentukan nama method untuk btnSimpan, sebagai contoh btnSimpanClicked pada On Mouse Clicked. Terakhir simpan dan silahkan keluar dari Scene Builde.

Selanjutnya kita akan buat sebuah controller baru untuk menjalankan perintah-perintah yang ada pada file paneUser.fxml. Sebenarnya bisa saja satu controller dengan Interface_homeController.java, namun kita akan kesusahan apabila ada banyak transaksi didalam tiap file fxml. Silahkan tambah kode berikut fx:controller="controller.paneUserController" di dalam Elemen ScrollPane seperti gambar berikut.

Gambar 3

Kemudian Make Controller pada file paneUser.fxml, sehingga seara otomatis akan menggenerate Controller.

Gambar 4

Pada method btnSimpanClicked kita akan memasukan kode program untuk menginputkan data yang ada pada textfield kedalam database. Sebelumnya mari kita atur database pada file koneksi.java, ubah host yang lama menjadi yang baru.

String host = "jdbc:mysql://localhost/javafx_historikal";

Tambah beberapa baris kode untuk pemanggilan library sql, atau sebenarnya ini adalah class yang berfungsi untuk mengeksekusi perintah sql. Tambahkan tepat setelah kode program public class paneUserController implements Initializable, sehingga menjadi;

public class paneUserController implements Initializable {
    Connection conn = koneksi.koneksi();
    PreparedStatement pst;

Jika ada yang error kita silahkan import saja library yang di gunakan, bisa dengan cara klik kanan pada kode (source) kemudian pilih Fix Import. Setelah itu baru kita tambah kode program berikut didalam method btnSimpanClicked.

    private void btnSimpanClicked(MouseEvent event) {
        Alert alert = new Alert(AlertType.CONFIRMATION);
        alert.setTitle("Apakah anda akan menyimpan data");
        alert.setHeaderText(null);
        alert.setContentText("Tekan OK untuk menyimpan data, Cencel untuk batal.");
        Optional result = alert.showAndWait();
        if (result.get() == ButtonType.OK){
            try {
                String query = "INSERT INTO `tbl_user`(`username`, `password`) VALUES (?,?)";
                pst = conn.prepareStatement(query);
                pst.setString(1, txtUsername.getText());
                pst.setString(2, txtPassword.getText());
                pst.execute();
                Alert berhasil = new Alert(AlertType.INFORMATION);
                berhasil.setTitle("Informasi Database");
                berhasil.setHeaderText(null);
                berhasil.setContentText("Data "+txtUsername.getText()+" Telah Berhasil Disimpan\n\nTerima Kasih.");   
                berhasil.showAndWait();
                pst.close();
            } catch (SQLException e) {
                Alert gagal = new Alert(AlertType.ERROR);
                gagal.setTitle("Informasi Database");
                gagal.setHeaderText(null);
                gagal.setContentText("Data "+txtUsername.getText()+" Tidak Dapat Disimpan\n\nSilahkan Di Ulang.\n"
                        + "Error = "+e);
                gagal.showAndWait();
            }
        } else {
            alert.close();
        }
    }

Coba jalankan project, JANGAN LUPA DI DEBUG agar kita tahu apakah masih ada error kode program di dalam project kita. Jika dijalankan ternyata berhasil, perhatikan pada gambar dibawah jika berhasil di jalankan.

Gambar 5

Kita juga bisa lihat data yang ada pada database apabila data sudah berhasil di masukan, contohnya satu data yang ada pada gambar.

Gambar 6

Penutup

Textfield dan PasswordField adalah komponen Controls yang sangat mirip, hanya saja fungsinya yang berbeda. Dimana satu untuk text biasa dan satu lagi untuk tipe password. Sangat mudah dan tidak jauh berbeda dengan penggunaan pada Swing.