SlideShare a Scribd company logo
KUTUONLINE 1
JAVAWEB – LATIHAN TUGAS 1 JSP (Form Pendaftaran)
Dalam paket instalasi Netbeans terdapat local server yang include dalam proses instalasi,
yaitu Glassfish. Glassfish digunakan ketika user melakukan pemrograman yang
membutuhkan local server dalam menampilkan hasil pemrogramannya kedalam
browser, salah satunya adalah pemrograman web aplikasi. Namun kendalanya adalah
banyak user yang tidak berhasil menampilkan hasil pemrogramannya kedalam browser.
Solusinya adalah user dapat menggunakan Tomcat, yaitu local server untuk
pemrograman Java selain Glassfish. Untuk menginstal Tomcat, cukup jalankan file
instalasi Netbeans dan beri tanda centang pada pilihan Tomcat.
Apabila Tomcat sudah diinstal, cek pada IDE Netbeans kamu pada Tab Services,
kemudian pilih Servers. Perhatikan gambar dibawah ini.
Gambar 1. Apache Tomcat.
Untuk melakukan pengaturan pada Tomcat, klik menu Tools lalu pilih Servers maka kan
tampil jendela Servers seperti yang terlihat pada gambar 2. Untuk saat ini, tidak perlu
dilakukan pengaturan terhadap server Tomcat. Close jendela Servers.
Secara default ketika kamu menginstal Tomcat, Netbeans akan membuatkan username
dengan nama “ide” (tanpa tanda kutip) dan password berupa karakter random berjumlah
8 digit.
Untuk menjalankan server Tomcat, beralih ke Tab Services dalam project
WebApplication kamu, klik kanan pada Apache Tomcat. Perhatikan gambar 3.
KUTUONLINE 2
Gambar 2. Servers.
Gambar 3. Menjalankan Apache Tomcat.
KUTUONLINE 3
Selanjutnya buatlah project website kamu, sebagai contoh disini akan dibuat project
dengan nama WebTugas. Berikut langkah-langkah membuat project website JSP.
1. Klik menu File – New Project. Pada kolom Categories pilih Java Web. Pada kolom
Projects pilih Web Application lalu klik Next untuk melanjutkan ke tahap berikutnya.
Gambar 4. Choose Project.
2. Menentukan nama project yang akan dibuat, isi Project Name dengan WebTugas.
Lihat gambar 5.
3. Memilih server yang akan digunakan untuk dapat menampilkan hasil pemrograman.
Pilih Apache Tomcat. Lalu klik Next. Lihat gambar 6.
4. Menentukan Framework, untuk saat ini tidak menggunakan framework. Kosongkan
pilihan lalu klik Finish. Lihat gambar 7.
Setelah project kamu selesai dibuat, perhatikan pada panel grup (Projects, Files,
Services) yang terdapat dikiri atas, maka akan terlihat struktur seperti pada gambar 8.
KUTUONLINE 4
Gambar 5. Name and Location.
Gambar 6. Server and Settings.
KUTUONLINE 5
Gambar 7. Framework.
Gambar 8. Struktur Project WebTugas.
Berikutnya adalah membuat file JSP. File JSP yang dibuat tersimpan dalam folder Web
Pages (Web).
KUTUONLINE 6
1. Klik kanan pada folder Web Pages project kamu. Pilih New – JSP.
Gambar 9. File New JSP.
2. Isi File Name dengan tugas1 sebagai nama file JSP yang dibuat. Lalu klik Finish.
Gambar 10. Memberikan nama file JSP.
KUTUONLINE 7
3. Struktur file tugas1.jsp akan terlihat seperti pada gambar dibawah ini.
Gambar 11. Struktur file tugas1.jsp.
Selanjutnya membuat tampilan Form Pendaftaran seperti dibawah ini.
Gambar 12. Tampilan form pendaftaran.
KUTUONLINE 8
Dengan hasil output berada dibawah form, berikut tampilannya.
Gambar 13. Hasil dari form pendaftaran.
Script program tugas1.jsp
1
2
3
4
5
6
7
8
9
10
11
12
13
<%--
Document : tugas1
Created on : Oct 11, 2016, 7:16:28 PM
Author : kutuonline
--%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Form Pendaftaran</title>
</head>
KUTUONLINE 9
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
<body>
<h1>Silahkan lengkapi form dengan benar!</h1>
<form method="get">
<pre>
Nama Anda <input type="text" name="nama" size="30">
Kota Lahir <input type="text" name="kota" size="30">
Tanggal Lahir <input type="text" name="tgl" size="30">
Alamat <textarea name="alamat" cols="40" rows="3"></textarea>
Pilih yang paling Anda suka <input type="checkbox" name="hobi"
value="Olahraga">Olahraga
<input type="checkbox" name="hobi"
value="Membaca">Membaca
<input type="checkbox" name="hobi"
value="Tidur">Tidur
<input type="submit" name="submit" value="Submit">&nbsp;<input
type="reset" name="reset" value="Ulangi">
</pre>
</form>
<%
String nama = request.getParameter("nama");
String kota = request.getParameter("kota");
String tgl = request.getParameter("tgl");
String alamat = request.getParameter("alamat");
String[] hb = request.getParameterValues("hobi");
if (request.getParameter("submit") != ""){
out.println("<h2>Hasil dari input form</h2>"
+ "Nama Anda : " + nama
+ "<br>Tempat, Tanggal Lahir : " + kota + ", " + tgl
+ "<br>Alamat : " + alamat
+ "<br>Hobi Anda : ");
}
%>
<%
if (hb != null){
%>
<ul>
<%
for (int i=0; i < hb.length; i++){
%>
<li><%= hb[i]%></li>
<%
}
%>
KUTUONLINE 10
60
61
62
63
64
65
</ul>
<%
}
%>
</body>
</html>
Untuk menampilkan hasil pemrograman, jalankan Apache Tomcat. Pilih Tab Services
– Servers, klik kanan pada Apache Tomcat – Start untuk mengaktifkan server Tomcat.
Gambar 14. Start Apache Tomcat.
Kemudian tampilkan hasil pemrograman dnegan mengklik kanan pada file tugas1.jsp –
Run File.

More Related Content

PDF
Java web application 2 - membuat template web
ODP
PDF
Web 2 | CSS - Cascading Style Sheets
PPT
Css lecture notes
PPTX
html5.ppt
PPTX
Advanced angular
PPTX
PPSX
Javascript variables and datatypes
Java web application 2 - membuat template web
Web 2 | CSS - Cascading Style Sheets
Css lecture notes
html5.ppt
Advanced angular
Javascript variables and datatypes

What's hot (20)

PPTX
HTML5 audio & video
PDF
Introduction to docker
PDF
Kotlin scope functions
PDF
CSS Day: CSS Grid Layout
PPT
CSS Basics
PPSX
Introduction to Html5
PPTX
Basic Html Knowledge for students
PDF
왜 쿠버네티스는 systemd로 cgroup을 관리하려고 할까요
PPTX
Javascript functions
PPTX
Introducing CSS Grid
PPTX
Docker Container Security
PDF
Html for beginners
PPTX
Beginners css tutorial for web designers
PPTX
Bootstrap 5 ppt
PDF
helm 입문
PPTX
PDF
CSS Dasar #2 : Anatomy CSS
PPT
JavaScript Basics
HTML5 audio & video
Introduction to docker
Kotlin scope functions
CSS Day: CSS Grid Layout
CSS Basics
Introduction to Html5
Basic Html Knowledge for students
왜 쿠버네티스는 systemd로 cgroup을 관리하려고 할까요
Javascript functions
Introducing CSS Grid
Docker Container Security
Html for beginners
Beginners css tutorial for web designers
Bootstrap 5 ppt
helm 입문
CSS Dasar #2 : Anatomy CSS
JavaScript Basics
Ad

More from Doni Andriansyah (20)

PDF
e-Brochure-LionParcelCisaukLapanRaya.pdf
PDF
Ecommerce for everybody
PDF
C++ Latihan Percabangan KPR
PDF
C++ Laundry kiloan murmer
PDF
Lembar kontribusi pengerjaan tugas kelompok
PDF
Sisfo akademik #1 - data kelas
PDF
Modul web design - studi kasus website portal berita
PDF
Java web application 1
PDF
Wp2 keranjang belanja
PDF
Web Programming 1 - dbKursus
PDF
C++ Array Percabangan Rental VCD DVD Video Mart
PDF
Web Programming - DB Galeri Foto
PDF
Web Programming - Simpan Tampil Customer
PDF
Web Programming - DB Buku Tamu
PDF
Web Programming - Toko Bunga Red Flower
PDF
C++ Array Gerobak Fried Chicken
PDF
Remastering linux slax
PDF
Nuri proposal penelitian-doni andriansyah (sem)
PDF
Project charter tugas uas project management
PDF
Scope requirements tugas uas kelompok project management
e-Brochure-LionParcelCisaukLapanRaya.pdf
Ecommerce for everybody
C++ Latihan Percabangan KPR
C++ Laundry kiloan murmer
Lembar kontribusi pengerjaan tugas kelompok
Sisfo akademik #1 - data kelas
Modul web design - studi kasus website portal berita
Java web application 1
Wp2 keranjang belanja
Web Programming 1 - dbKursus
C++ Array Percabangan Rental VCD DVD Video Mart
Web Programming - DB Galeri Foto
Web Programming - Simpan Tampil Customer
Web Programming - DB Buku Tamu
Web Programming - Toko Bunga Red Flower
C++ Array Gerobak Fried Chicken
Remastering linux slax
Nuri proposal penelitian-doni andriansyah (sem)
Project charter tugas uas project management
Scope requirements tugas uas kelompok project management
Ad

Recently uploaded (20)

DOCX
CONTOH RANCANGAN MODUL PROYEK KOKURIKULER SMA 1.docx
DOCX
Modul Ajar Deep Learning PKWU Rekayasa Kelas 12 SMA Terbaru 2025
PPT
Teknologi-Pangan-Pertemuan-820728132309-.ppt
PPTX
lansia berdaya (SIDAYA) di indonesia.pptx
PDF
PPT Resources Seminar AITalks: AI dan Konseling GPT
DOCX
Modul Ajar Deep Learning PAI & BP Kelas 12 SMA Terbaru 2025
PDF
Deck Rumah Pendidikan untuk Mendukung Program Prioritas Kemendikdasmen.pdf
PPTX
Informatika_dan_Keterampilan_Generik.pptx
PPTX
Peran Staf Ritel dalam Penanganan dan Distribusi Produk
DOCX
LK Modul 3 - Menentukan Pengalaman Belajar.docx
PPTX
PPT MATERI KODING DAN KECERDASAN ARTIFISIAL UNTUK PEMBELAJARAN
DOCX
Modul Ajar Pembelajaran Mendalam Senbud Seni Teater Kelas 12 Terbaru 2025
DOCX
Modul Ajar Deep Learning PAI & BP Kelas 10 SMA Terbaru 2025
DOCX
Modul Ajar Pembelajaran Mendalam Senbud Seni Musik Kelas XII Terbaru 2025
DOCX
Modul Ajar Pembelajaran Mendalam Senbud Seni Tari Kelas XII Terbaru 2025
PDF
Gangguan Penglihatan Mata - presentasi biologi
PPTX
Bahan Presentasi Persamaan Elips .pptx
PPTX
Rancangan Kegiatan Kokurikuler SMP N 1 Karanggede
PPTX
Analisis-Kasus-PNS-Telat-Pelayanan-Publik-Terhambat Fiks.pptx
PPTX
Slide PPT Metode Ilmiah Kelas 7 SMP.pptx
CONTOH RANCANGAN MODUL PROYEK KOKURIKULER SMA 1.docx
Modul Ajar Deep Learning PKWU Rekayasa Kelas 12 SMA Terbaru 2025
Teknologi-Pangan-Pertemuan-820728132309-.ppt
lansia berdaya (SIDAYA) di indonesia.pptx
PPT Resources Seminar AITalks: AI dan Konseling GPT
Modul Ajar Deep Learning PAI & BP Kelas 12 SMA Terbaru 2025
Deck Rumah Pendidikan untuk Mendukung Program Prioritas Kemendikdasmen.pdf
Informatika_dan_Keterampilan_Generik.pptx
Peran Staf Ritel dalam Penanganan dan Distribusi Produk
LK Modul 3 - Menentukan Pengalaman Belajar.docx
PPT MATERI KODING DAN KECERDASAN ARTIFISIAL UNTUK PEMBELAJARAN
Modul Ajar Pembelajaran Mendalam Senbud Seni Teater Kelas 12 Terbaru 2025
Modul Ajar Deep Learning PAI & BP Kelas 10 SMA Terbaru 2025
Modul Ajar Pembelajaran Mendalam Senbud Seni Musik Kelas XII Terbaru 2025
Modul Ajar Pembelajaran Mendalam Senbud Seni Tari Kelas XII Terbaru 2025
Gangguan Penglihatan Mata - presentasi biologi
Bahan Presentasi Persamaan Elips .pptx
Rancangan Kegiatan Kokurikuler SMP N 1 Karanggede
Analisis-Kasus-PNS-Telat-Pelayanan-Publik-Terhambat Fiks.pptx
Slide PPT Metode Ilmiah Kelas 7 SMP.pptx

Java Web Form Pendaftaran - JSP

  • 1. KUTUONLINE 1 JAVAWEB – LATIHAN TUGAS 1 JSP (Form Pendaftaran) Dalam paket instalasi Netbeans terdapat local server yang include dalam proses instalasi, yaitu Glassfish. Glassfish digunakan ketika user melakukan pemrograman yang membutuhkan local server dalam menampilkan hasil pemrogramannya kedalam browser, salah satunya adalah pemrograman web aplikasi. Namun kendalanya adalah banyak user yang tidak berhasil menampilkan hasil pemrogramannya kedalam browser. Solusinya adalah user dapat menggunakan Tomcat, yaitu local server untuk pemrograman Java selain Glassfish. Untuk menginstal Tomcat, cukup jalankan file instalasi Netbeans dan beri tanda centang pada pilihan Tomcat. Apabila Tomcat sudah diinstal, cek pada IDE Netbeans kamu pada Tab Services, kemudian pilih Servers. Perhatikan gambar dibawah ini. Gambar 1. Apache Tomcat. Untuk melakukan pengaturan pada Tomcat, klik menu Tools lalu pilih Servers maka kan tampil jendela Servers seperti yang terlihat pada gambar 2. Untuk saat ini, tidak perlu dilakukan pengaturan terhadap server Tomcat. Close jendela Servers. Secara default ketika kamu menginstal Tomcat, Netbeans akan membuatkan username dengan nama “ide” (tanpa tanda kutip) dan password berupa karakter random berjumlah 8 digit. Untuk menjalankan server Tomcat, beralih ke Tab Services dalam project WebApplication kamu, klik kanan pada Apache Tomcat. Perhatikan gambar 3.
  • 2. KUTUONLINE 2 Gambar 2. Servers. Gambar 3. Menjalankan Apache Tomcat.
  • 3. KUTUONLINE 3 Selanjutnya buatlah project website kamu, sebagai contoh disini akan dibuat project dengan nama WebTugas. Berikut langkah-langkah membuat project website JSP. 1. Klik menu File – New Project. Pada kolom Categories pilih Java Web. Pada kolom Projects pilih Web Application lalu klik Next untuk melanjutkan ke tahap berikutnya. Gambar 4. Choose Project. 2. Menentukan nama project yang akan dibuat, isi Project Name dengan WebTugas. Lihat gambar 5. 3. Memilih server yang akan digunakan untuk dapat menampilkan hasil pemrograman. Pilih Apache Tomcat. Lalu klik Next. Lihat gambar 6. 4. Menentukan Framework, untuk saat ini tidak menggunakan framework. Kosongkan pilihan lalu klik Finish. Lihat gambar 7. Setelah project kamu selesai dibuat, perhatikan pada panel grup (Projects, Files, Services) yang terdapat dikiri atas, maka akan terlihat struktur seperti pada gambar 8.
  • 4. KUTUONLINE 4 Gambar 5. Name and Location. Gambar 6. Server and Settings.
  • 5. KUTUONLINE 5 Gambar 7. Framework. Gambar 8. Struktur Project WebTugas. Berikutnya adalah membuat file JSP. File JSP yang dibuat tersimpan dalam folder Web Pages (Web).
  • 6. KUTUONLINE 6 1. Klik kanan pada folder Web Pages project kamu. Pilih New – JSP. Gambar 9. File New JSP. 2. Isi File Name dengan tugas1 sebagai nama file JSP yang dibuat. Lalu klik Finish. Gambar 10. Memberikan nama file JSP.
  • 7. KUTUONLINE 7 3. Struktur file tugas1.jsp akan terlihat seperti pada gambar dibawah ini. Gambar 11. Struktur file tugas1.jsp. Selanjutnya membuat tampilan Form Pendaftaran seperti dibawah ini. Gambar 12. Tampilan form pendaftaran.
  • 8. KUTUONLINE 8 Dengan hasil output berada dibawah form, berikut tampilannya. Gambar 13. Hasil dari form pendaftaran. Script program tugas1.jsp 1 2 3 4 5 6 7 8 9 10 11 12 13 <%-- Document : tugas1 Created on : Oct 11, 2016, 7:16:28 PM Author : kutuonline --%> <%@page contentType="text/html" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Form Pendaftaran</title> </head>
  • 9. KUTUONLINE 9 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 <body> <h1>Silahkan lengkapi form dengan benar!</h1> <form method="get"> <pre> Nama Anda <input type="text" name="nama" size="30"> Kota Lahir <input type="text" name="kota" size="30"> Tanggal Lahir <input type="text" name="tgl" size="30"> Alamat <textarea name="alamat" cols="40" rows="3"></textarea> Pilih yang paling Anda suka <input type="checkbox" name="hobi" value="Olahraga">Olahraga <input type="checkbox" name="hobi" value="Membaca">Membaca <input type="checkbox" name="hobi" value="Tidur">Tidur <input type="submit" name="submit" value="Submit">&nbsp;<input type="reset" name="reset" value="Ulangi"> </pre> </form> <% String nama = request.getParameter("nama"); String kota = request.getParameter("kota"); String tgl = request.getParameter("tgl"); String alamat = request.getParameter("alamat"); String[] hb = request.getParameterValues("hobi"); if (request.getParameter("submit") != ""){ out.println("<h2>Hasil dari input form</h2>" + "Nama Anda : " + nama + "<br>Tempat, Tanggal Lahir : " + kota + ", " + tgl + "<br>Alamat : " + alamat + "<br>Hobi Anda : "); } %> <% if (hb != null){ %> <ul> <% for (int i=0; i < hb.length; i++){ %> <li><%= hb[i]%></li> <% } %>
  • 10. KUTUONLINE 10 60 61 62 63 64 65 </ul> <% } %> </body> </html> Untuk menampilkan hasil pemrograman, jalankan Apache Tomcat. Pilih Tab Services – Servers, klik kanan pada Apache Tomcat – Start untuk mengaktifkan server Tomcat. Gambar 14. Start Apache Tomcat. Kemudian tampilkan hasil pemrograman dnegan mengklik kanan pada file tugas1.jsp – Run File.