SlideShare a Scribd company logo
1 of 33
Download to read offline
VII
CRUD Application : Model
Model
Seperti telah dijelaskan sebelumnya dalam MVC, model menggambarkan informasi atau data beserta
aturan bisnisnya seperti validasi, relasi, tipe data, dan lain-lain. Ada dua jenis model, yaitu
1. Suatu model yang disimpan dan dikumpulkan ke dalam database
2. Suatu model yang setelah dipakai tidak disimpan ke dalam database.
Jika kita menggunakan model yang setelah dipakai tidak disimpan ke dalam database, maka kita dapat
menggunkan Form Model untuk mendefinisikannya. Sedangkan untuk model yang disimpan dan
dikumpulkan ke dalam database, kita dapat menggunakan Active Record
.
A. Analisa Kasus
B. Membuat Model Data Master
1. Membuat project baru dengan nama project myapp seperti langkah dalam gambar berikut.
2. Integrasi dengan IDE Netbeans, lakukan perintah perikut pada command prompt
play netbeansify myapp
3. Lakukanlah testing dengan menjalan aplikasi dengan reintah run.
4.Jika tidak ada masalah dengan framework maka tampilan yang akan muncul adalah seperti
dibawah ini:
5. Pengkodean dengan IDE Netbeans dilakukan dengan cara sebagai berikut
6. Pertama bukalah project dengan menu File-> Open Project. Bukalah project myapp seperti pada
gambar berikut.
Membuat Model oCabang
Model oCabang adalah merupakan menggambarkan informasi atau data tentang Cabang. Model
Cabang seperti halnya controller merupakan sebuah java class juga. Untuk membuat lakukan lakukan
langkah berikut.
1.Pada package models lakukan click kanan kemudian membuat class baru seperti pada gambar berikut.
2. Lakukan pemberian nama class baru dengan nama oCabang seperti gambar berikut.
3. Ketikan script kode berikut untuk menyusun struktur data cabang:
4. Isi dari class oCabang.class adalah seperti berikut.
5. Simpanlah kode script diatas
C. Test Model
Membuat Customize Controller
1. Buatlah class baru pada package contoller dengan melakukan click kanan submenu New=>Java
Class.
2. Berilah nama controller class tersebut dengan nama Cabang.
Membuat Halaman Index
3. Membuat folder Cabang pada folder /app/view/
4. Pada controller Cabang.java tambahkan method index() sebagai berikut.
5. Buatlah sebuah template view dengan nama index untuk halaman index
6. Lakukan setting configurasi routing untuk halaman index sebagai berikut.
7. Simpan semua script dan konfigurasi anda lakukan testing dengan web browser
Membuat Halaman Form Cabang
8. Pada controller Cabang.java tambahkan method getForm() sebagai berikut.
9. Buatlah sebuah template view dengan nama formNew.html untuk halaman form
10. Lakukan setting configurasi routing untuk halaman form sebagai berikut.
11. Simpan semua script dan konfigurasi anda lakukan testing dengan web browser
Membuat Halaman Detail Data Cabang
Halaman detail cabang sebagai test parameter untuk data yang masuk melalui form.
11. Tambah method sebagai dengan script berikut pada class Controller.java.
12. Buatlah sebuah template view dengan nama Detail.html sebagai berikut
Membuat Method Posting Form Cabang
13. Pada controller Cabang.java tambahkan method setAdd() sebagai berikut.
Method ini berfungsi sebagai penerima data dari form Cabang untuk kemudian di sampakian ke model
oCabang untuk disimpan dengan perintah data.save(). Argument selanjutnya adalah melakukan redirect
ke halaman detail dengan memanggil method getDetail(Long id)
14. Lakukan setting configurasi routing untuk halaman post form sebagai berikut.
15. Simpan semua script dan konfigurasi anda lakukan testing dengan web browser
16. Tampilan form data cabang
16. Tampilan halaman detail
17. Script lengkap untuk controller Cabang.java adalah sebagai berikut
D. Maping Aplikasi
E. Tugas V
1. Rancanglah ER Diagram kasus anda
2. Rancanglah Model Untuk sebuah Data Master anda (Ciri data master adalah jika entitas tersebut akan
menjadi acuan dari entitas lainya dan entitas tersebut tidak terdapat field kunci tamu/ foreign key)
VIII
CRUD Application : Iterasi
A. Membuat View List Data
1. Bukalah kembali project myapp dengan IDE Netbeans
Menambah Kompunen Model
2. Lakukan update pada model Cabang dengan membuka file /app/model/oCabang.java
3. Tambahkan sebuah method getAll() dengan statement sebagai berikut.
JPA ORM melakukan pembungkusan dengan library yang dimiliki. Statement tersebut indentik dengan.
Sehingga susunan Model class oCabang menjadi sebagai berikut.
Menambah Kompunen Controler
4. Lakukan update pada controller Cabang dengan membuka file /app/controller/Cabang.java
5. Lakukan penambahan methode getList(), method ini berfungsi menampilakan halaman daftar
Cabang yang sudah di masukan, dengan ini method adalah sebagai berikut.
6. Tambahkan statment berikut pada method index().
Susunan lengkap method menjadi sebagai berikut.
Menambah Template View
6. Buatlah sebuah template view dengan nama list.html untuk pada folder /app/views/Cabang. Dengan
script sebagai berikut.
7. Hasil lengkap dari script diatas adalah sebagai berikut.
Setting Konfigurasi Routes
8. Lakukan setting configurasi routing untuk halaman list sebagai berikut.
9. Simpan semua script dan konfigurasi anda lakukan testing dengan web browser
Hasil Keluaran
10. Bukalah kembali file /app/view/main.html tambahkan statement link page sebagai penghubung ke
halaman daftar cabang. Simpan update script html.
11. Tampilan awal
12. Tampilan daftar cabang masih kosong
13. Tampilan ketika tambah data cabang di klik akan menuju ke form isian data cabang.
14. Tampilan jika pengisian form sudah selesai dan akan menuju ke halaman daftar cabang.
15. Tampilan ketika link detail salah satu baris table data di klik maka akan menuju halaman detail.
C. Penjelasan
View Iterasi (Grovy Template)
IX
Play CRUD Application : Update Data
A. Fitur Update
Pada modul sebelumnya kita sudah membuat fitur untuk pegisian data. Maka pada modul berikut ini
kita akan tambahkan fasilitas untuk update dan penghapusan data yang sudah masuk.
1. Bukalah kembali project myapp dengan IDE Netbeans
Fitur Update Data
1. kemudian buka Controller Cabang di /app/controller/Cabang.java.
2. Ubahlah method getForm() dari yang sebelumnya hanya mengarahkan ke satu template.
Sehingga memiliki kemampuan seleksi berdasarkan parameter id
Jika parameter tersebut bernilai 0 atau null maka akan diarah ke template pengisian data baru yaitu di
formNew.html. Sebaliknya jika parameter id bernilai diatas 1 maka hal tersebut menandakan update
data. Aksi akan dilakukan ke template formUpd.html. Berikut ini adalah maping untuk halaman form
3. Hasil lengkap script Cabang.java
4. Karena template pengisian data baru yang terdapat di newForm sudah ada maka langkah berikutnya
adalah membuat form update FormUpd.html. Dengan menggunakan menu new=> other => html
file
5. Berilah nama file html tersebut dengan nama formUpd
6. Lengkapilah script berikut pada file /app/view/Cabang/formUp.html
7. Script lengkap dari file /app/view/Cabang/formUpd.html adalah sebagai berikut
8. Bukalah kembali script /app/view/Cabang/list.html. Lengkapilah menjadi sebagi berikut.
9. Simpanlah semua script yang sudah ter-update. Jalankan browser arahkan url ke
http://localhost:9000/cabang/list. JIka link update dieksekusi maka anda akan diarahkan ke halaman
form update
X
Play CRUD Application : Hapus Data
A. Fitur Update dan Hapus Data
1. Bukalah kembali Controller Cabang di /app/controller/Cabang.java. tambahkan method
setHapus() sebagai berikut.
2. Isi lengkap dari script Cabang.java adalah sebagai berikut.
3. Jangan lupa melakukan update pada file list.html pada folder berikut:
4 Tambahkan link penghapusan data sebagai berikut.
5. Script lengkap list.html adala sebagai berkut.
6. Update file route jika perlu.
7. Simpan semua script dan konfigurasi anda lakukan testing dengan web browser
B. Hasil Keluaran
1. List ketika data kosong
2. Jika link tambah data di pilih makan akan dibawa ke form isi data baru
3. Halaman list yang sudah terisi

More Related Content

What's hot

SISTEM BASIS DATA
SISTEM BASIS DATASISTEM BASIS DATA
SISTEM BASIS DATARahmad Deni
 
Tutorial membuat form login dengan php mvc dan my sql
Tutorial membuat form login dengan php mvc dan my sqlTutorial membuat form login dengan php mvc dan my sql
Tutorial membuat form login dengan php mvc dan my sqlAjiDwiKusman
 
TipsTrikTrobelshootingAplikasidesktop
TipsTrikTrobelshootingAplikasidesktopTipsTrikTrobelshootingAplikasidesktop
TipsTrikTrobelshootingAplikasidesktopMuh Prio Susilo
 
Aplikasi desktop user manual
Aplikasi desktop user manualAplikasi desktop user manual
Aplikasi desktop user manualMTs DARUSSALAM
 
Modul Tutorial Membuat Class pada Visual Studio 2010
Modul Tutorial Membuat Class pada Visual Studio 2010Modul Tutorial Membuat Class pada Visual Studio 2010
Modul Tutorial Membuat Class pada Visual Studio 2010Choi Melia
 

What's hot (9)

Tugas5 1300631013
Tugas5 1300631013Tugas5 1300631013
Tugas5 1300631013
 
Manual akur 2013
Manual akur 2013Manual akur 2013
Manual akur 2013
 
SISTEM BASIS DATA
SISTEM BASIS DATASISTEM BASIS DATA
SISTEM BASIS DATA
 
Tutorial membuat form login dengan php mvc dan my sql
Tutorial membuat form login dengan php mvc dan my sqlTutorial membuat form login dengan php mvc dan my sql
Tutorial membuat form login dengan php mvc dan my sql
 
Kkpi
KkpiKkpi
Kkpi
 
TipsTrikTrobelshootingAplikasidesktop
TipsTrikTrobelshootingAplikasidesktopTipsTrikTrobelshootingAplikasidesktop
TipsTrikTrobelshootingAplikasidesktop
 
Aplikasi desktop user manual
Aplikasi desktop user manualAplikasi desktop user manual
Aplikasi desktop user manual
 
Tugas ke 1
Tugas ke 1Tugas ke 1
Tugas ke 1
 
Modul Tutorial Membuat Class pada Visual Studio 2010
Modul Tutorial Membuat Class pada Visual Studio 2010Modul Tutorial Membuat Class pada Visual Studio 2010
Modul Tutorial Membuat Class pada Visual Studio 2010
 

Viewers also liked

Ebook Cafe cùng Tony Sách Gốc
Ebook Cafe cùng Tony Sách GốcEbook Cafe cùng Tony Sách Gốc
Ebook Cafe cùng Tony Sách GốcIPMAN VN
 
ΠΡΟΛΗΨΕΙΣ ΚΑΙ ΔΕΙΣΙΔΑΙΜΟΝΙΕΣ (Eργασἰα Kειμένων)
ΠΡΟΛΗΨΕΙΣ ΚΑΙ ΔΕΙΣΙΔΑΙΜΟΝΙΕΣ (Eργασἰα Kειμένων)ΠΡΟΛΗΨΕΙΣ ΚΑΙ ΔΕΙΣΙΔΑΙΜΟΝΙΕΣ (Eργασἰα Kειμένων)
ΠΡΟΛΗΨΕΙΣ ΚΑΙ ΔΕΙΣΙΔΑΙΜΟΝΙΕΣ (Eργασἰα Kειμένων)varalig
 
vct portfolio v3aa(2)
vct portfolio v3aa(2)vct portfolio v3aa(2)
vct portfolio v3aa(2)Vanessa Tan
 
VSN Vishnu Sahasranamam , Divya namam (183-190)
VSN  Vishnu Sahasranamam , Divya namam (183-190)VSN  Vishnu Sahasranamam , Divya namam (183-190)
VSN Vishnu Sahasranamam , Divya namam (183-190)Adithyan Sogathur
 
La credibilidad del entrenador
La credibilidad del entrenadorLa credibilidad del entrenador
La credibilidad del entrenadorFutbol_Ofensivo
 
Estefania taco 4to administracion a
Estefania taco 4to administracion aEstefania taco 4to administracion a
Estefania taco 4to administracion astefaniataco
 
2015
20152015
2015RCV87
 

Viewers also liked (13)

Ebook Cafe cùng Tony Sách Gốc
Ebook Cafe cùng Tony Sách GốcEbook Cafe cùng Tony Sách Gốc
Ebook Cafe cùng Tony Sách Gốc
 
ΠΡΟΛΗΨΕΙΣ ΚΑΙ ΔΕΙΣΙΔΑΙΜΟΝΙΕΣ (Eργασἰα Kειμένων)
ΠΡΟΛΗΨΕΙΣ ΚΑΙ ΔΕΙΣΙΔΑΙΜΟΝΙΕΣ (Eργασἰα Kειμένων)ΠΡΟΛΗΨΕΙΣ ΚΑΙ ΔΕΙΣΙΔΑΙΜΟΝΙΕΣ (Eργασἰα Kειμένων)
ΠΡΟΛΗΨΕΙΣ ΚΑΙ ΔΕΙΣΙΔΑΙΜΟΝΙΕΣ (Eργασἰα Kειμένων)
 
vct portfolio v3aa(2)
vct portfolio v3aa(2)vct portfolio v3aa(2)
vct portfolio v3aa(2)
 
Galileo Dialogo 1604
Galileo Dialogo 1604Galileo Dialogo 1604
Galileo Dialogo 1604
 
VSN Vishnu Sahasranamam , Divya namam (183-190)
VSN  Vishnu Sahasranamam , Divya namam (183-190)VSN  Vishnu Sahasranamam , Divya namam (183-190)
VSN Vishnu Sahasranamam , Divya namam (183-190)
 
O estranxeiro
O estranxeiroO estranxeiro
O estranxeiro
 
La credibilidad del entrenador
La credibilidad del entrenadorLa credibilidad del entrenador
La credibilidad del entrenador
 
Estefania taco 4to administracion a
Estefania taco 4to administracion aEstefania taco 4to administracion a
Estefania taco 4to administracion a
 
Método de proyecto
Método de proyectoMétodo de proyecto
Método de proyecto
 
Prezi
PreziPrezi
Prezi
 
Activity
ActivityActivity
Activity
 
Contrato colectivo de trabajo
Contrato colectivo de trabajoContrato colectivo de trabajo
Contrato colectivo de trabajo
 
2015
20152015
2015
 

Similar to CRUD Model

Modul 3 Cara Membuat View Pada CodeIgniter
Modul 3 Cara Membuat View Pada CodeIgniterModul 3 Cara Membuat View Pada CodeIgniter
Modul 3 Cara Membuat View Pada CodeIgniterRiki Afriansyah
 
Tugas 5 1300631006
Tugas 5 1300631006Tugas 5 1300631006
Tugas 5 1300631006Ghede
 
Modul 05 Framework CodeIgniter.pdf
Modul 05 Framework CodeIgniter.pdfModul 05 Framework CodeIgniter.pdf
Modul 05 Framework CodeIgniter.pdfSetiya Nugroho
 
Modul pemograman web II pertemuan 9
Modul pemograman web II  pertemuan 9Modul pemograman web II  pertemuan 9
Modul pemograman web II pertemuan 9Alwin Fau
 
[PBO] Pertemuan 13 - Membuat Aplikasi Desktop dengan JDBC DAO MVC
[PBO] Pertemuan 13 - Membuat Aplikasi Desktop dengan JDBC DAO MVC[PBO] Pertemuan 13 - Membuat Aplikasi Desktop dengan JDBC DAO MVC
[PBO] Pertemuan 13 - Membuat Aplikasi Desktop dengan JDBC DAO MVCrizki adam kurniawan
 
Edwinprassetyo-1100631028-tugas1
Edwinprassetyo-1100631028-tugas1Edwinprassetyo-1100631028-tugas1
Edwinprassetyo-1100631028-tugas1Edwin Prassetyo
 
Cara Akses Database Menggunakan ADO.NET
Cara Akses Database Menggunakan ADO.NETCara Akses Database Menggunakan ADO.NET
Cara Akses Database Menggunakan ADO.NETVeronica Anggraini
 
Jamal aplikasicrud
Jamal aplikasicrudJamal aplikasicrud
Jamal aplikasicrudmales Aja
 
Basis Data Praktikum modul SQL
Basis Data Praktikum modul SQLBasis Data Praktikum modul SQL
Basis Data Praktikum modul SQLIhsan Nurhalim
 
270610 arm pemrograman_java_dengan_netbean_ide
270610 arm pemrograman_java_dengan_netbean_ide270610 arm pemrograman_java_dengan_netbean_ide
270610 arm pemrograman_java_dengan_netbean_ideVera Lake
 
Tutorial ci
Tutorial ciTutorial ci
Tutorial ciWira Hul
 
Tutorial Pentaho - Membuat Data base werehaouse
Tutorial Pentaho - Membuat Data base werehaouseTutorial Pentaho - Membuat Data base werehaouse
Tutorial Pentaho - Membuat Data base werehaouseJames Montolalu
 
Tutorial Aplikasi android client server menggunakan REST API Django
Tutorial Aplikasi android client server menggunakan REST API DjangoTutorial Aplikasi android client server menggunakan REST API Django
Tutorial Aplikasi android client server menggunakan REST API DjangoAbdul Aziz Subayu
 
Seri dreamweaver -_tampil_entri_edit_delete_data_mahasiswa
Seri dreamweaver -_tampil_entri_edit_delete_data_mahasiswaSeri dreamweaver -_tampil_entri_edit_delete_data_mahasiswa
Seri dreamweaver -_tampil_entri_edit_delete_data_mahasiswaIrfan Fauzi
 
training module "web application development with cms and bootstrap"
training module "web application development with cms and bootstrap"training module "web application development with cms and bootstrap"
training module "web application development with cms and bootstrap"Dewi Rahmawati
 

Similar to CRUD Model (20)

Modul 3 Cara Membuat View Pada CodeIgniter
Modul 3 Cara Membuat View Pada CodeIgniterModul 3 Cara Membuat View Pada CodeIgniter
Modul 3 Cara Membuat View Pada CodeIgniter
 
Tugas 5 1300631006
Tugas 5 1300631006Tugas 5 1300631006
Tugas 5 1300631006
 
Modul 05 Framework CodeIgniter.pdf
Modul 05 Framework CodeIgniter.pdfModul 05 Framework CodeIgniter.pdf
Modul 05 Framework CodeIgniter.pdf
 
Modul pemograman web II pertemuan 9
Modul pemograman web II  pertemuan 9Modul pemograman web II  pertemuan 9
Modul pemograman web II pertemuan 9
 
[PBO] Pertemuan 13 - Membuat Aplikasi Desktop dengan JDBC DAO MVC
[PBO] Pertemuan 13 - Membuat Aplikasi Desktop dengan JDBC DAO MVC[PBO] Pertemuan 13 - Membuat Aplikasi Desktop dengan JDBC DAO MVC
[PBO] Pertemuan 13 - Membuat Aplikasi Desktop dengan JDBC DAO MVC
 
Edwinprassetyo-1100631028-tugas1
Edwinprassetyo-1100631028-tugas1Edwinprassetyo-1100631028-tugas1
Edwinprassetyo-1100631028-tugas1
 
Cara Akses Database Menggunakan ADO.NET
Cara Akses Database Menggunakan ADO.NETCara Akses Database Menggunakan ADO.NET
Cara Akses Database Menggunakan ADO.NET
 
Jamal aplikasicrud
Jamal aplikasicrudJamal aplikasicrud
Jamal aplikasicrud
 
Web Programming Form
Web Programming FormWeb Programming Form
Web Programming Form
 
Tugas 7
Tugas 7Tugas 7
Tugas 7
 
Basis Data Praktikum modul SQL
Basis Data Praktikum modul SQLBasis Data Praktikum modul SQL
Basis Data Praktikum modul SQL
 
270610 arm pemrograman_java_dengan_netbean_ide
270610 arm pemrograman_java_dengan_netbean_ide270610 arm pemrograman_java_dengan_netbean_ide
270610 arm pemrograman_java_dengan_netbean_ide
 
Tutorial ci
Tutorial ciTutorial ci
Tutorial ci
 
Php
PhpPhp
Php
 
Laporan 6
Laporan 6Laporan 6
Laporan 6
 
Tutorial Pentaho - Membuat Data base werehaouse
Tutorial Pentaho - Membuat Data base werehaouseTutorial Pentaho - Membuat Data base werehaouse
Tutorial Pentaho - Membuat Data base werehaouse
 
Tutorial Aplikasi android client server menggunakan REST API Django
Tutorial Aplikasi android client server menggunakan REST API DjangoTutorial Aplikasi android client server menggunakan REST API Django
Tutorial Aplikasi android client server menggunakan REST API Django
 
Seri dreamweaver -_tampil_entri_edit_delete_data_mahasiswa
Seri dreamweaver -_tampil_entri_edit_delete_data_mahasiswaSeri dreamweaver -_tampil_entri_edit_delete_data_mahasiswa
Seri dreamweaver -_tampil_entri_edit_delete_data_mahasiswa
 
Tugas5 1300631009
Tugas5 1300631009Tugas5 1300631009
Tugas5 1300631009
 
training module "web application development with cms and bootstrap"
training module "web application development with cms and bootstrap"training module "web application development with cms and bootstrap"
training module "web application development with cms and bootstrap"
 

CRUD Model

  • 1. VII CRUD Application : Model Model Seperti telah dijelaskan sebelumnya dalam MVC, model menggambarkan informasi atau data beserta aturan bisnisnya seperti validasi, relasi, tipe data, dan lain-lain. Ada dua jenis model, yaitu 1. Suatu model yang disimpan dan dikumpulkan ke dalam database 2. Suatu model yang setelah dipakai tidak disimpan ke dalam database. Jika kita menggunakan model yang setelah dipakai tidak disimpan ke dalam database, maka kita dapat menggunkan Form Model untuk mendefinisikannya. Sedangkan untuk model yang disimpan dan dikumpulkan ke dalam database, kita dapat menggunakan Active Record . A. Analisa Kasus B. Membuat Model Data Master 1. Membuat project baru dengan nama project myapp seperti langkah dalam gambar berikut.
  • 2. 2. Integrasi dengan IDE Netbeans, lakukan perintah perikut pada command prompt play netbeansify myapp 3. Lakukanlah testing dengan menjalan aplikasi dengan reintah run. 4.Jika tidak ada masalah dengan framework maka tampilan yang akan muncul adalah seperti dibawah ini: 5. Pengkodean dengan IDE Netbeans dilakukan dengan cara sebagai berikut
  • 3. 6. Pertama bukalah project dengan menu File-> Open Project. Bukalah project myapp seperti pada gambar berikut. Membuat Model oCabang Model oCabang adalah merupakan menggambarkan informasi atau data tentang Cabang. Model Cabang seperti halnya controller merupakan sebuah java class juga. Untuk membuat lakukan lakukan langkah berikut. 1.Pada package models lakukan click kanan kemudian membuat class baru seperti pada gambar berikut.
  • 4. 2. Lakukan pemberian nama class baru dengan nama oCabang seperti gambar berikut. 3. Ketikan script kode berikut untuk menyusun struktur data cabang: 4. Isi dari class oCabang.class adalah seperti berikut.
  • 5. 5. Simpanlah kode script diatas C. Test Model Membuat Customize Controller 1. Buatlah class baru pada package contoller dengan melakukan click kanan submenu New=>Java Class. 2. Berilah nama controller class tersebut dengan nama Cabang.
  • 6. Membuat Halaman Index 3. Membuat folder Cabang pada folder /app/view/ 4. Pada controller Cabang.java tambahkan method index() sebagai berikut. 5. Buatlah sebuah template view dengan nama index untuk halaman index
  • 7. 6. Lakukan setting configurasi routing untuk halaman index sebagai berikut. 7. Simpan semua script dan konfigurasi anda lakukan testing dengan web browser Membuat Halaman Form Cabang 8. Pada controller Cabang.java tambahkan method getForm() sebagai berikut. 9. Buatlah sebuah template view dengan nama formNew.html untuk halaman form
  • 8. 10. Lakukan setting configurasi routing untuk halaman form sebagai berikut. 11. Simpan semua script dan konfigurasi anda lakukan testing dengan web browser
  • 9. Membuat Halaman Detail Data Cabang Halaman detail cabang sebagai test parameter untuk data yang masuk melalui form. 11. Tambah method sebagai dengan script berikut pada class Controller.java. 12. Buatlah sebuah template view dengan nama Detail.html sebagai berikut
  • 10. Membuat Method Posting Form Cabang 13. Pada controller Cabang.java tambahkan method setAdd() sebagai berikut. Method ini berfungsi sebagai penerima data dari form Cabang untuk kemudian di sampakian ke model oCabang untuk disimpan dengan perintah data.save(). Argument selanjutnya adalah melakukan redirect ke halaman detail dengan memanggil method getDetail(Long id) 14. Lakukan setting configurasi routing untuk halaman post form sebagai berikut. 15. Simpan semua script dan konfigurasi anda lakukan testing dengan web browser
  • 11. 16. Tampilan form data cabang 16. Tampilan halaman detail
  • 12. 17. Script lengkap untuk controller Cabang.java adalah sebagai berikut
  • 13.
  • 14. D. Maping Aplikasi E. Tugas V 1. Rancanglah ER Diagram kasus anda 2. Rancanglah Model Untuk sebuah Data Master anda (Ciri data master adalah jika entitas tersebut akan menjadi acuan dari entitas lainya dan entitas tersebut tidak terdapat field kunci tamu/ foreign key)
  • 15. VIII CRUD Application : Iterasi A. Membuat View List Data 1. Bukalah kembali project myapp dengan IDE Netbeans Menambah Kompunen Model 2. Lakukan update pada model Cabang dengan membuka file /app/model/oCabang.java
  • 16. 3. Tambahkan sebuah method getAll() dengan statement sebagai berikut. JPA ORM melakukan pembungkusan dengan library yang dimiliki. Statement tersebut indentik dengan. Sehingga susunan Model class oCabang menjadi sebagai berikut.
  • 17. Menambah Kompunen Controler 4. Lakukan update pada controller Cabang dengan membuka file /app/controller/Cabang.java 5. Lakukan penambahan methode getList(), method ini berfungsi menampilakan halaman daftar Cabang yang sudah di masukan, dengan ini method adalah sebagai berikut.
  • 18. 6. Tambahkan statment berikut pada method index(). Susunan lengkap method menjadi sebagai berikut. Menambah Template View 6. Buatlah sebuah template view dengan nama list.html untuk pada folder /app/views/Cabang. Dengan script sebagai berikut. 7. Hasil lengkap dari script diatas adalah sebagai berikut.
  • 19. Setting Konfigurasi Routes 8. Lakukan setting configurasi routing untuk halaman list sebagai berikut. 9. Simpan semua script dan konfigurasi anda lakukan testing dengan web browser Hasil Keluaran 10. Bukalah kembali file /app/view/main.html tambahkan statement link page sebagai penghubung ke halaman daftar cabang. Simpan update script html.
  • 20. 11. Tampilan awal 12. Tampilan daftar cabang masih kosong 13. Tampilan ketika tambah data cabang di klik akan menuju ke form isian data cabang.
  • 21. 14. Tampilan jika pengisian form sudah selesai dan akan menuju ke halaman daftar cabang. 15. Tampilan ketika link detail salah satu baris table data di klik maka akan menuju halaman detail.
  • 22. C. Penjelasan View Iterasi (Grovy Template)
  • 23. IX Play CRUD Application : Update Data A. Fitur Update Pada modul sebelumnya kita sudah membuat fitur untuk pegisian data. Maka pada modul berikut ini kita akan tambahkan fasilitas untuk update dan penghapusan data yang sudah masuk. 1. Bukalah kembali project myapp dengan IDE Netbeans
  • 24. Fitur Update Data 1. kemudian buka Controller Cabang di /app/controller/Cabang.java. 2. Ubahlah method getForm() dari yang sebelumnya hanya mengarahkan ke satu template.
  • 25. Sehingga memiliki kemampuan seleksi berdasarkan parameter id Jika parameter tersebut bernilai 0 atau null maka akan diarah ke template pengisian data baru yaitu di formNew.html. Sebaliknya jika parameter id bernilai diatas 1 maka hal tersebut menandakan update data. Aksi akan dilakukan ke template formUpd.html. Berikut ini adalah maping untuk halaman form 3. Hasil lengkap script Cabang.java 4. Karena template pengisian data baru yang terdapat di newForm sudah ada maka langkah berikutnya adalah membuat form update FormUpd.html. Dengan menggunakan menu new=> other => html file
  • 26. 5. Berilah nama file html tersebut dengan nama formUpd 6. Lengkapilah script berikut pada file /app/view/Cabang/formUp.html
  • 27. 7. Script lengkap dari file /app/view/Cabang/formUpd.html adalah sebagai berikut 8. Bukalah kembali script /app/view/Cabang/list.html. Lengkapilah menjadi sebagi berikut. 9. Simpanlah semua script yang sudah ter-update. Jalankan browser arahkan url ke http://localhost:9000/cabang/list. JIka link update dieksekusi maka anda akan diarahkan ke halaman
  • 29.
  • 30. X Play CRUD Application : Hapus Data A. Fitur Update dan Hapus Data 1. Bukalah kembali Controller Cabang di /app/controller/Cabang.java. tambahkan method setHapus() sebagai berikut. 2. Isi lengkap dari script Cabang.java adalah sebagai berikut. 3. Jangan lupa melakukan update pada file list.html pada folder berikut:
  • 31. 4 Tambahkan link penghapusan data sebagai berikut. 5. Script lengkap list.html adala sebagai berkut. 6. Update file route jika perlu.
  • 32. 7. Simpan semua script dan konfigurasi anda lakukan testing dengan web browser B. Hasil Keluaran 1. List ketika data kosong 2. Jika link tambah data di pilih makan akan dibawa ke form isi data baru
  • 33. 3. Halaman list yang sudah terisi