PEMROGRAMAN INTERNET (Java Server Pages ) · PDF filememberikan arahan tentang pelaksanaan...

37
MODUL PRAKTIKUM PEMROGRAMAN INTERNET (Java Server Pages) Oleh Team Laboratorium JURUSAN TEKNIK INFORMATIKA FAKULTAS TEKNIK UNIVERSITAS DR.SOETOMO SURABAYA 2005

Transcript of PEMROGRAMAN INTERNET (Java Server Pages ) · PDF filememberikan arahan tentang pelaksanaan...

Page 1: PEMROGRAMAN INTERNET (Java Server Pages ) · PDF filememberikan arahan tentang pelaksanaan praktikum ... adalah teknologi Web berbasis bahasa pemrograman Java dan berjalan pada ...

MODUL PRAKTIKUM

PEMROGRAMAN INTERNET (Java Server Pages)

Oleh

Team Laboratorium

JURUSAN TEKNIK INFORMATIKA FAKULTAS TEKNIK

UNIVERSITAS DR.SOETOMO SURABAYA 2005

Page 2: PEMROGRAMAN INTERNET (Java Server Pages ) · PDF filememberikan arahan tentang pelaksanaan praktikum ... adalah teknologi Web berbasis bahasa pemrograman Java dan berjalan pada ...

Modul Praktikum Pemrograman Internet 2

Laboratorium Teknik Informatika Fakultas Teknik - Univers itas Dr. Soetomo Surabaya

Tata Tertib Praktikum Laboratorium Teknik Informatika

Fakultas Teknik Universitas Dr. Soetomo Surabaya

PEMAKAIAN LABORATORIUM

1. Yang diperbolehkan menggunakan fasilitas Laboratorium adalah Mahasiswa Teknik Informatika Fakultas Teknik Universitas Dr. Soetomo Surabaya yang terdaftarpada BAAK dan aktif paling tidak pada ta hun akademik yang sedang berlangsung.

2. Laboratorium Teknik Informatika hanya dapat digunakan pada jam kerja yang telah ditentukan . Di luar jam tersebut, pemkaian Laboratorium harus seijin pejabat yang berwenang.

3. Peralatan dan semua fasilitas Laboratorium tidak diperbolehkan dipindah tempatkan, kecuali atas seijin pejabat yang berwenang.

4. Mahasiswa yang sedang menggunakan laboratorium dilarang membawa keluar fasilitas tanpa ijin pejabat yang berwenang

5. Mahasiswa dilarang membawa teman/Mahasiswa luar kedalam Laboratorium tanpa ijin pimpinan/penanggung jawab Laboratorium.

KEWAJIBAN PRAKTIKAN

1. Hadir selambat-lambatnya 10 menit sebelum praktikum dimulai. 2. Hadir untuk seluruh acara praktikum agar dapat memenuhi keutuhan absensi

sebagai persyaratan kelulusan. 3. Mengikuti test/ujian/quiz praktikum yang dilakukan oleh asisten yang

bersangkutan. 4. Mengumpulkan laporan dan tugas lain yang diberikan oleh asisten/dosen. 5. Kerusakan alat akibat keteledoran dan kesengajaan pemakain menjadi

tanggung jawab pemakai. 6. Menjaga keserasian, ketenangan dan kebersihan ruangan Laboratorium. 7. Merapikan kembali semua peralatan setelah selesai memakainya. 8. Minimal mengikuti 80% (delapan puluh persen) dari seluruh kegiatan

praktikum dalam 1 semester.

LARANGAN PRAKTIKAN BAGI PRAKTIKAN SELAMA PRAKTIKUM 1. Dilarang makan, minum dan merokok didalam Laboratorium. 2. Membuat gaduh selama jalannya praktikum, sehingga mengganggu konsntrasi

praktikan lainnya. 3. Keluar masuk laborattorium tanpa seijin asisten.

SANKSI

1. Terhadap pelanggaran TATA TERTIB diatas, asisten berhak menjatuhkan sanksi dengan peraturan berlaku :

2. Pelanggaran Point II.4. tidak diperbolehkan mengikuti praktikum 3. Pelanggaran Point II.8. Tidak diperkenankan mengikuti ujian. 4. Pelanggaran Point lainnya dikenakan sanksi teguran sampai sanksi akademik.

Page 3: PEMROGRAMAN INTERNET (Java Server Pages ) · PDF filememberikan arahan tentang pelaksanaan praktikum ... adalah teknologi Web berbasis bahasa pemrograman Java dan berjalan pada ...

Modul Praktikum Pemrograman Internet 3

Laboratorium Teknik Informatika Fakultas Teknik - Univers itas Dr. Soetomo Surabaya

KATA PENGANTAR

Puji syukur kehadirat Tuhan YME atas terselesaikannya buku petunjuk

praktikum Pemrograman Internet. Sesuai dengan motto kami yaitu “Tiada Hari

Tanpa Peningkatan Mutu”, maka buku ini adalah suatu realisasi untuk terus

berusaha meningkatkan mutu praktikum.

Struktur dari buku ini diharapkan memenuhi standar dari sebuah buku

petunjuk praktikum dengan bagian pada setiap BABnya terdapat: tujuan, materi,

teori, alat dan bahan, prosedur praktikum, percobaan dan latihan. Untuk peserta

praktikum diharapkan sudah membaca seluruh bagian dari buku petunjuk

praktikum ini sebelum praktikum dimulai dan melakukan praktikum sesuai

dengan prosedur yang ditetapkan. Instruktur praktikum mempunyai tugas

memberikan arahan tentang pelaksanaan praktikum sekaligus memberikan

bimbingan dalam penyelesaian setiap percobaan maupun latihan.

Demikian kata pengantar ini yang mencoba memberikan sedikit arahan

tentang tujuan dibuatnya buku petunjuk praktikum ini. Selanjutnya untuk masa

yang mendatang akan terus dikembangkan kualitasnya, baik dari segi substansi

maupun metode penyusunan dan penyampaiannya. Akhir kata tiada gading yang

tak retak, dan demi peningkatan kualitas dari buku petunjuk praktikum ini, kami

selalu mengharapkan saran dan kritik membangun dari para pembaca.

Surabaya, Agustus 2005

Team Laboratorium

Page 4: PEMROGRAMAN INTERNET (Java Server Pages ) · PDF filememberikan arahan tentang pelaksanaan praktikum ... adalah teknologi Web berbasis bahasa pemrograman Java dan berjalan pada ...

Modul Praktikum Pemrograman Internet 4

Laboratorium Teknik Informatika Fakultas Teknik - Univers itas Dr. Soetomo Surabaya

DAFTAR ISI

Halaman TATA TERTIB PRAKTIKUM KATA PENGANTAR DAFTAR ISI BAB I Pe ngenalan dan Instalasi Java Se rver Pages .................. BAB II Pe nggunaan Tag-tag JSP.................................................. BAB III Pe mrograman Java dalam JSP ....................................... BAB IV Ve ctor dan Session ........................................................... BAB V JDBC .................................................................................

Page 5: PEMROGRAMAN INTERNET (Java Server Pages ) · PDF filememberikan arahan tentang pelaksanaan praktikum ... adalah teknologi Web berbasis bahasa pemrograman Java dan berjalan pada ...

Modul Praktikum Pemrograman Internet 5

Laboratorium Teknik Informatika Fakultas Teknik - Univers itas Dr. Soetomo Surabaya

Bab I Pengenalan & Instalasi Java Server Pages

1.1.Tujuan

a. Mahasiswa dapat memahami bagaimana JSP bekerja.

b. Mahasiswa dapat mengetahui komponen-komponen yang

diperlukan untuk pemrograman internet.

c. Mahasiswa mampu melaksanakan instalasi sendiri.

d. Mahasiswa mampu mengaplikasikan script-script sederhana.

1.2.Materi

a. Pengertian dasar JSP

b. Keunggulan JSP

c. Instalasi dan Setup

d. Sample JSP Page

1.3.Alat dan bahan

a. PC yang telah terinstall system operasi Linux SuSE 9.1 / Linux

Redhat.

b. Paket instalasi Tomcat (binary distribution)

c. Java virtual mechine

d. Web browser (Opera, Konqueror, Mozilla, etc.)

1.4. Teori

a. Pengertian JSP

JavaServer PagesTM(JSP) adalah teknologi Web berbasis bahasa

pemrograman Java dan berjalan pada Platform Java yang diproduksi

oleh Sun microsystem. JSP memungkinkan kita menggabungkan static

HTML dengan dynamic content yang dihasilkan dari Servlet. JSP juga

merupakan bagian dari teknologi J2EE (Java 2 Enterprise Edition).

J2EE merupakan platform Java untuk penge mbangan aplikasi enterprise

dengan dukungan API (Application Program Interface) yang lengkap

dan portabilitas serta memberikan sarana untuk membuat aplikasi

multi tier yang memisahkan antara Presentation layer, Application

layer dan Data Layer.

Page 6: PEMROGRAMAN INTERNET (Java Server Pages ) · PDF filememberikan arahan tentang pelaksanaan praktikum ... adalah teknologi Web berbasis bahasa pemrograman Java dan berjalan pada ...

Modul Praktikum Pemrograman Internet 6

Laboratorium Teknik Informatika Fakultas Teknik - Univers itas Dr. Soetomo Surabaya

b. Arsitektur JSP

JSP pada dasarnya juga hala man HTML dengan tambahan tag-tag

JSP yang berupa Java Code. File JSP mempunyai extension .jsp

bukan .htm atau html. JSP engine (Java virtual mechine) melakukan

proses parsing pada file .jsp selanjutnya men-generate Java servlet

source file. Kemudian mengkompilasi source file ini menjadi class file,

hal ini dilakukan pada saat perta ma kali file .jsp dijalankan. Hal ini

yang membuat lebih lambat ketika .jsp file pertama kali diakses,

selanjutnya setelah servlet source file terkompile semuanya berjalan

lebih cepat.

Berikut ini ilustrasi bagaimana tahapan request jsp sampai dengan

terlihat pada hala man browser.

1. User menjalankan file .jsp pada browsernya, selanjutnya web browser yang melakukan request via Internet/Intranet.

2. JSP file dikirim ke Web Server 3. Web Server mengirimkan file .jsp ke JSP servlet engine 4. Jika JSP file baru pertama kali dijalankan maka dilakukan proses

parsing, jika tidak maka langsung dijalankan step ke 7. 5. Tahap selanjutnya adalah men-generate special servlet dari .jsp file.

Semua HTML yang dibutuhkan dikonversi ke perintah println. 6. Servlet code selanjutnya dicompile menjadi class-class java. 7. Servlet kemudian memanggil method init dan service 8. HTML dari servlet selanjutnya dikirim ke melalui internet atau

intranet. 9. Selanjutnya HTML dita mpilkan pada web browser.

Request

Response

JDBC Database PostgreSQL

Page 7: PEMROGRAMAN INTERNET (Java Server Pages ) · PDF filememberikan arahan tentang pelaksanaan praktikum ... adalah teknologi Web berbasis bahasa pemrograman Java dan berjalan pada ...

Modul Praktikum Pemrograman Internet 7

Laboratorium Teknik Informatika Fakultas Teknik - Univers itas Dr. Soetomo Surabaya

c. Keunggulan JSP

JSP mudah dipelajari dan memungkinan develope r membuat Web

Site dan aplikasi dengan cepat. JSP berjalan diatas Java yang

merupakan object oriented Programming sehingga JSP berada pada

platform yang kuat untuk penge mbangan aplikasi.

Alasan utama mengapa menggunakan JSP:

1. Multi Platform

Kita dapat merubah system operasi kita tanpa harus merubah kode-

kode jsp yang telah dibuat misalnya dari Linux ke Windows

atau ke Unix. Demikian juga dari IIS ke Apache atau ke IBM

Websphere.

2. Reusable code dengan memanfaatkan Javabeans

3. Dengan JSP berarti kita mendapat semua keunggulan dari Java.

d. JSP dibandingkan dengan ASP

ASP merupakan teknologi yang dibangun oleh Microsoft. Kelebihan JSP adalah:

1. Bagian web dinamis ditulis dengan Java, bukan VBScript atau

JavaScript ataupun bahasa lain, sehingga lebih powerful dan

lebih baik dalam pembuatan aplikasi serta komponennya

dapat dimanfaatkan kembali (Reusable Code)

2. JSP portable pada semua system operasi dan web server

sehingga tidak terkunci pada windows NT dan IIS saja.

Page 8: PEMROGRAMAN INTERNET (Java Server Pages ) · PDF filememberikan arahan tentang pelaksanaan praktikum ... adalah teknologi Web berbasis bahasa pemrograman Java dan berjalan pada ...

Modul Praktikum Pemrograman Internet 8

Laboratorium Teknik Informatika Fakultas Teknik - Univers itas Dr. Soetomo Surabaya

e. JSP dibandingkan dengan PHP

PHP merupakan freeware dan open source, PHP juga HTML-scripting

language seperti halnya JSP dan ASP. Keunggulan JSP terletak pada

bagian dyna mic-nya dibangun dengan java sehingga secara automatis

didukung dengan API untuk networking, database access, object yang

terdistribusi, reusable component dan lainya. 1.5. Instalasi dan Setup

Sebelum memulai perograman JSP, kita perlu mempersiapkan Java Virtual

Machine (JVM) dan To mcat. Berikut ini tahap-tahap instalasi:

1. Instalasi JDK 1.5.0

Untuk menginstal Java Virtual Machine kita harus mempunyai file

JVM bernama jdk-1_5_0_01-linux-i586.bin apabila anda belum

mempunyai file ini anda bisa download di alamat situs sbb:

• Untuk JDK 1.5.0 di http://java.sun.com/j2se/1.5.0/

- Untuk OS Linux Anda pilih file jdk -1_5_0_01-linux-i586.bin

Misal file jdk -1_5_0_01 -linux-i586.bin berada di direktori /usr/local/src # cd /usr/local

# src/jdk-1_5_0_01-linux-i586.bin

akan terdapat folder jdk1.5.0_01 dalam direktori /usr/local

- Untuk OS Windows Anda pilih file jdk-1_5_0_01 -windows-i586-p.exe

Jalankan file jdk -1_5_0_01-windows-i586 -p.exe, ikuti langkah-langkah

instalasi. Selanjutnya kita harus tahu di folder mana JDK dinstall,

secara otomatis JDK di-install pada folder C:\Program

Files\Java\jdk1.5.0_01 dan JRE di-install pada folder C:\Program

Files\Java\jre1.5.0_01.

2. Instalasi To mcat

Setelah kita melakukan instalasi JDK 1.5.0, agar JSP dapat berjalan

kita harus melakukan instalasi Tomcat. Software Tomcat (binary

distribution ) dapat di download di URL :

http://apache.the.net.id/jakarta/tomcat-5/v5.5.7/bin

Untuk OS Linux kita download adalah jakarta -tomcat-5.5.7.tar.gz,

Page 9: PEMROGRAMAN INTERNET (Java Server Pages ) · PDF filememberikan arahan tentang pelaksanaan praktikum ... adalah teknologi Web berbasis bahasa pemrograman Java dan berjalan pada ...

Modul Praktikum Pemrograman Internet 9

Laboratorium Teknik Informatika Fakultas Teknik - Univers itas Dr. Soetomo Surabaya

langkah selanjutnya adalah sebagai berikut:

# gunzip –dv jakarta-tomcat-5.5.7.tar.gz # tar –xvfz jakarta-tomcat-5.5.7.tar

akan terdapat folder jakarta-tomcat-5.5.7 dalam direktori aktif

copy folder jakarta-tomcat-5.5.7 ke /usr/local dengan perintah :

# cp –r jakarta-tomcat-5.5.7 /usr/local

Untuk OS Windows kita pilih file jakarta -tomcat-5.5.7.exe

Jalankan file jakarta-tomcat-5.5.7.exe, ikuti langkah- langkah instalasi.

S ecara oto matis installer minta JRE pada folder yang barusan kita

install. Selanjutnya kita dapat (tidak harus) mengganti port ke port:80.

Dan kita lanjutkan langkah-langkah instalasi sampai Finish .

3. Mengganti konfigurasi port Tomcat ke port 80

Penggantian port ini memang tidak terlalu penting untuk

dilakukan, tetapi dengan mengganti port:8080 (default port) ke

port:80, akan memudahkan kita mengakses URL local. Jika dengan

port:8080 untuk mengakses URL local pada

web browser di URL address harus kita

ketikkan: http://localhost:8080 /index.html Maka dengan port:80

cukup kita ketikkan: http://localhost/index.html

Untuk mengganti port tersebut, kita perlu mengedit file server.xml

pada folder /usr/local/jakarta-tomcat-5.5.7 /conf. Buka file server.xml

dengan editor teks, selanjutnya cari bagian berikut: <!-- Define a non-SSL HTTP/1.1 Connector on port 8080 -->

<Connector port="8080" port="80"

maxThreads="150" minSpareThreads="25" maxSpareThreads="75" enableLookups="false" redirectPort="8443" acceptCount="100" connectionTimeout="20000" disableUploadTimeout="true" />

Setelah anda mengganti port="8080" menjadi port=”80” simpan dengan

nama yang sama.

4. Mengatur variable JAVA_HOME untuk OS Linux

Buka file /etc/profile dan ta mbahkan script sebagai berikut:

export PATH=$PATH:/usr/local/jdk1.5.0_01/bin export JRE_HOME=/usr/local/jdk1.5.0_01/jre

5. Menjalankan & Men-shutdown server Tomcat untuk OS Linux

Menjalankan server Tomcat

Page 10: PEMROGRAMAN INTERNET (Java Server Pages ) · PDF filememberikan arahan tentang pelaksanaan praktikum ... adalah teknologi Web berbasis bahasa pemrograman Java dan berjalan pada ...

Modul Praktikum Pemrograman Internet 10

Laboratorium Teknik Informatika Fakultas Teknik - Univers itas Dr. Soetomo Surabaya

# sh /usr/local/jakarta-tomcat-5.5.7/bin/startup.sh

Men-shutdown server Tomcat

# sh /usr/local/jakarta-tomcat-5.5.7/bin/shutdown.sh

6. Test To mcat server

Setelah tomcat server dapat berjalan dengan benar kita dapat

mencoba file HTML atau JSP sederhana pada web browser.

URL untuk localhost adalah http://localhost yang menunjuk pada folder

/usr/local/jakarta -tomcat-5.5.7 /webapps/ROOT

Pada folder itu anda harus meletakkan file-file html atau jsp anda. 1.6. Percobaan

1. Buka text editor 2. Ketikkan jsp berikut dan simpan dengan nama coba.jsp pada

folder /usr/local/jakarta -tomcat-5.5.7/webapps/ROOT

<html> <head> <title>My first JSP page </title> </head> <body> <H1> Hello Word </H1> <B> Your Host Name: <%= Request.getRemoteHost()%> <br> </B> Current Time: <%= new java.util.Date()%> </body> </html>

3. Jalankan pada browser anda dengan URL : http://localhost/coba .jsp 4. Hasilnya seperti pada gambar berikut :

Gambar 1.1 Tampilan percobaan ServerTomcat

Page 11: PEMROGRAMAN INTERNET (Java Server Pages ) · PDF filememberikan arahan tentang pelaksanaan praktikum ... adalah teknologi Web berbasis bahasa pemrograman Java dan berjalan pada ...

Modul Praktikum Pemrograman Internet 11

Laboratorium Teknik Informatika Fakultas Teknik - Univers itas Dr. Soetomo Surabaya

Bab II Penggunaan Tag-Tag JSP

2.1.Tujuan

Mahasiswa mengetahui dan dapat mengimplementasikan tag-tag dalam JSP

2.2.Materi

a. Declaration tag

b. Expression tag

c. Directive Tag

d. Scriptlet Tag

e. Action Tag 2.3.Alat dan bahan

a. PC yang telah terinstall system operasi Linux SuSE 9.1 / Linux

Redhat. b. Text Editor CoffeCup/BlueFish/Quanta c. Web browser (Opera, Konqueror, etc.)

2.4. Teori

2.4.1. Declaration Tag (<% … %>)

Declaration Tag digunakan untuk mendeklarasikan variable atau

method. Sebelum pendeklarasian diawali dengan <%! dan akhir

diakhiri dengan %>

hampir sama dengan semua syntax d i java selalu diakhiri dengan semicolon( ; ) Contoh:

<% private int counter = 0 ; private String get Account ( int accountNo) ; %>

2.4.2. Expression tag ( <%= … %>)

Expression tag digunakan untuk ekspresi dala m Java dan

menampilkannya sebagai String dala m browser.

Sebelum ekspresi diawali dengan <%= dan akhir diakhiri dengan %>

Semicolon ( ; ) tidak diperlukan dala m ekspresi.

Contoh :

Tanggal : <%= new java.util.Date() %> 2.4.2. Directive tag ( <%@ directive … %>)

Page 12: PEMROGRAMAN INTERNET (Java Server Pages ) · PDF filememberikan arahan tentang pelaksanaan praktikum ... adalah teknologi Web berbasis bahasa pemrograman Java dan berjalan pada ...

Modul Praktikum Pemrograman Internet 12

Laboratorium Teknik Informatika Fakultas Teknik - Univers itas Dr. Soetomo Surabaya

Directive merupakan salah satu komponen utama dan sering

digunakan dalam pemrograman JSP, yang terdiri dari:

- Page

- Include

- Tag Library

Directive tidak menghasilkan output yang dapat dilihat langsung pada

browser akan tetapi directive merubah cara JSP engine memproses

hala man Web.

2.4.2.1. Page Directive

Page Directive (<%@page attribute…%>) digunakan untuk

mendefinisikan atribut yang penting bagi keseluruhan kode dala m

halaman yang bersangkutan. Misalnya mendefinisikan halaman

pemrograman yang digunakan atau melakukan import class java.

JSP memiliki 11 Page Directive seperti pada table berikut:

Page Attribute Description Example

language

Menentukan bahasa sripting apa yang digunakan, sementara ini hanya Java dan JavaScript

<%@page language = “java” %>

extends

Digunakan untuk men-generate superclass

<%@page extends = com.taglib…” %>

import Digunakan untuk mengambil (import) class-class atau package Java

<%@page import = “java.util.*” %>

session Digunakan untuk menentukan halaman JSP menggunakan HTTP session atau tidak.

<%@ page session = “true” %> <%@ page session = “false” %>

buffer

Menentukan besarnya buffer untuk output pada halaman JSP(output stream ke client) defaultnya 8Kb

<%@ page buffer = “none” %>

autoFlush Apabila true output buffer akan dikeluarkan setelah buffer penuh. Jika false pesan exception akan dikeluarkan untuk mengindikasikan jika buffer telah penuh

<%@ page autoFlush = “true” %>

isThreadSafe Apakah Servlet boleh mengenerate multiple request? Jika true maka urutan (thread) baru akan dimulai dan selanjutnya akan diproses secara simultan, jika false request akan diproses sebagai

<%@ page isThreadSafe = “true” %>

Page 13: PEMROGRAMAN INTERNET (Java Server Pages ) · PDF filememberikan arahan tentang pelaksanaan praktikum ... adalah teknologi Web berbasis bahasa pemrograman Java dan berjalan pada ...

Modul Praktikum Pemrograman Internet 13

Laboratorium Teknik Informatika Fakultas Teknik - Univers itas Dr. Soetomo Surabaya

singgle thread.

info Digunakan untuk menambahkan informasi atau dokumen pada halaman JSP. Biasanya digunakan untuk menambahkan informasi author, version, copyright dan tanggal.

<%@ page info =“Author :Lab FTI, Version:1.2, copyright 2003. “ %>

errorPage Mendefinisikan URL dari JSP file lain yang dipanggil ketika terjadi kesalahan

<%@page errorPage=“/error/error.jsp” %>

isErrorPage Menentukan apakah halaman JSP ini merupakan halaman error dari JSP lain defaultnya "false"

<%@ page IsErrorPage =“true” %>

contentType Menentukan tipe MIME dan karakter Set..Untuk informasi lebih jelas lihat di http://www.iana.org

<%@ page contentType =“TYPE=text/html; CHARSET=ISO- 8859-1” %>

2.4.2.2. Include Directive <%@ include … %>

Digunakan untuk menyisipkan file lain dala m

halaman JSP. Contoh: <%@ include fi le = “include/screet.html %> atau <%@ include file = “menu.jsp %>

2.4.2.3. Tag Lib directive <%@ taglib … %>

Digunakan untuk tag tambahan atau digunakan untuk

menyembunyikan kode pada server side dari web designer.

Contoh: <%@ taglib url = “http: //unitomo.ac.id/mytag prefix = “myProses” %> <myProses:proses> … </myProses:proses>

Untuk lebih jelasnya dapat dilihat di http://www.visualbuilder.com

2.4.3. Scriptlet tag ( <% … %> )

Tag antara <% dan %> diguanakan untuk mendeklarasikan

variable, bean atau kode lain

Contoh: <% String username = “Hengki” ; out.pr intln ( username ) ; %>

Page 14: PEMROGRAMAN INTERNET (Java Server Pages ) · PDF filememberikan arahan tentang pelaksanaan praktikum ... adalah teknologi Web berbasis bahasa pemrograman Java dan berjalan pada ...

Modul Praktikum Pemrograman Internet 14

Laboratorium Teknik Informatika Fakultas Teknik - Univers itas Dr. Soetomo Surabaya

2.4.4. Action tag ( <% … %> ) Action tag merupakan salah satu elemen JSP berupa tag-tag. JSP memiliki dua macam tag, yaitu: - Tag Action Standar - Custom Tag Tag standar adalah tag yang didefinisikan dala m spesifikasi JSP dan Custom tag adalah tag baru yang dapat didefinisikan sendiri. Custom akan kita bahas pada bab-bab terakhir. Tag Action Standar Tag-tag action standar terdiri dari: <jsp:usebean> <jsp:setproperty> <jsp:getproperty> <jsp:include> <jsp:params> <jsp:param> <jsp:plugin> <jsp:fallback> <jsp:forward>

<jsp:usebean>

Tag ini digunakan untuk mengasosiasikan Java bean dalam JSP

sehingga kita dapat menggunakan object yang terdapat dalam Java

bean untuk diaplikasikan dala m kode JSP.

JSP syntax:

<jsp:useBean id="beanInstanceName " scope="page|request|session|application" { class="package.class" [ type=" package.clas s" ]| beanName="{package.class | <%= expression %>}" type="package.class" | type=" package.class" } { /> | > other elements </jsp:useBean> }

Contoh:

<jsp:useBean id="checking" scope="session" class="bank.Checking" />

<jsp:setproperty>

Tag ini digunakan untuk men-set nilai properti dari bean dan tag ini

digunakan untuk melengkapi tag <jsp:usebean>

JSP Syntax:

<jsp:setProperty name="beanInstanceName " { property="*" | property="propertyName" [ param="parameterName" ] | property="propertyName" value="{stringLiteral| <%= expression %>}"

Page 15: PEMROGRAMAN INTERNET (Java Server Pages ) · PDF filememberikan arahan tentang pelaksanaan praktikum ... adalah teknologi Web berbasis bahasa pemrograman Java dan berjalan pada ...

Modul Praktikum Pemrograman Internet 15

Laboratorium Teknik Informatika Fakultas Teknik - Univers itas Dr. Soetomo Surabaya

} /> Contoh:

<jsp:setProperty name="mybean" property="username"value="Steve" />

<jsp:getproperty>

Tag ini digunakan untuk mendapatkan nilai properti dari bean dan

merupakan pelengkap dari tag <jsp:usebean>.

JSP Syntax:

<jsp:getProperty name=" beanInstanceName " property="propertyName" />

Contoh:

<jsp:useBean id="calendar" scope="page" class="employee.Calendar" /> <h2> Calendar of <jsp:getProperty nam e="calendar" property="username" /> </h2>

<jsp:include>

Tag ini digunakan untuk memasukkan file lain dala m JSP saat

request dilakkukan.

JSP Syntax:

<jsp:include page="{relativeURL | %= expression %}” [ flush="true | false" ] />

Contoh:

<jsp:include page="scripts/login.jsp" /> <jsp:include page="copyright.html" /> <jsp:include page="/index.html" />

<jsp:params>

Tag ini hanya dapat digunakan bersa ma tag jsp:plugin saja.

Penggunaan di tempat lain akan menyebabkan error translation time

error

<jsp:param>

Tag ini digunakan untuk melengkapi tag <jsp:params>,

<jsp:plugin>,<jsp:forward> saja.

Penggunaan d i tempat lain akan menyebabkan error

translation error.

<jsp:fallback>

Tag ini digunakan sebagai subele men dari <jsp:plugin>, yang

Page 16: PEMROGRAMAN INTERNET (Java Server Pages ) · PDF filememberikan arahan tentang pelaksanaan praktikum ... adalah teknologi Web berbasis bahasa pemrograman Java dan berjalan pada ...

Modul Praktikum Pemrograman Internet 16

Laboratorium Teknik Informatika Fakultas Teknik - Univers itas Dr. Soetomo Surabaya

berfungsi untuk mena mpilkan pesan error apabila proses plugin

mengalami kesalahan.

<jsp:plugin>

Tag ini digunakan untuk menghasilkan kode-kode yang sesuai target

browser dalam menyisipkan komponen Java bean atau Applet secara

otomatis.

JSP Syntax:

<jsp:plugin type="bean|applet" code="classFileName" codebase="classFileDirectoryName" [ name="instanceName" ] [ archive="URIToArchive, ..." ] [ align="bottom|top|middle|left|right" ] [ height="{displayPixels | <%= expression %>}"] [ width="{displayPixels | <%= expression %>}"] [ hspace="leftRightPixels" ] [ vspace="topBottomPixels" ] [ jreversion="JREVersionNumber | 1.2" ] [ nspluginurl="URLToPlugin" ] [ iepluginurl="URLToPlugin" ] > [ <jsp:params> [ <jsp:param name="parameterName" value="{parameterValue | <%= expression %>}" /> ] </jsp:params> ] [ <jsp:fallback> text message for user </jsp:fallback> ] </jsp:plugin> Contoh:

<jsp:plugin type=applet code="Molecule.class" codebase="/html"> <jsp:params> <jsp:param name="molecule" value="molecules/benzene.mol" /> </jsp:params> <jsp:fallback> <p>Unable to load applet</p> </jsp:fallback> </jsp:plugin>

<jsp:forward>

Tag ini digunakan untuk mem-forward ke file JSP, servlet atau file statik lain.

JSP Syntax:

<jsp:forward page="{relativeURL |

Page 17: PEMROGRAMAN INTERNET (Java Server Pages ) · PDF filememberikan arahan tentang pelaksanaan praktikum ... adalah teknologi Web berbasis bahasa pemrograman Java dan berjalan pada ...

Modul Praktikum Pemrograman Internet 17

Laboratorium Teknik Informatika Fakultas Teknik - Univers itas Dr. Soetomo Surabaya

<%= expression %>}" /> Contoh:

<jsp:forward page="/servlet/login" /> 2.5. Percobaan

2.5.1 Percobaan Untuk Declaration, Expression dan Page Directive

Percobaan berikut ini adalah contoh dari penggunaan declaration,

expression dan page directive. Ketikkan script di bawah ini dan

simpan dengan na ma coba2.js p.

Listing 2.1 – coba2.jsp <%@ page language="java" %> <%@ page import="java.util.*" %> <%@ page session = "true" %> <%@ page buffer = "12kb" %> <%@ page autoFlush = "true" %> <%@ page isThreadSafe = "false" %> <%@ page info ="Author :Lab FTI, Version:1.2, copyright 2003." %> <%@ page errorPage ="error.jsp" %> <%@ page isErrorPage ="false" %> <%@ page contentType ="TYPE=text/html; CHARSET=ISO-8859-1" %> <html> <head> <title>Percobaan Untuk Declaration, Expression dan Page Directive </title> </head> <h2> Percobaan Untuk Declaration, Expression dan Page Directive </h2> <body> <% String myStr = "Variabel Jumlah bernilai: "; int Jumlah = 2 ; Date Tanggal = new Date(); %> <%= myStr + " " + Jumlah %> <br> Tanggal: <%= Tanggal %> <br> <% Jumlah++; %> <%= myStr + " " + Jumlah %> <br> </body> </html>

Page 18: PEMROGRAMAN INTERNET (Java Server Pages ) · PDF filememberikan arahan tentang pelaksanaan praktikum ... adalah teknologi Web berbasis bahasa pemrograman Java dan berjalan pada ...

Modul Praktikum Pemrograman Internet 18

Laboratorium Teknik Informatika Fakultas Teknik - Univers itas Dr. Soetomo Surabaya

Hasil dari percobaan di atas seperti tampak pada gambar berikut :

Gambar 2.1 Tampilan percobaan deklarasi, ekspresi dan direktif page

2.5.2 Percobaan Untuk Include

Percobaan berikut ini adalah contoh dari penggunaan include

directive. Proses include dengan include directive dilakukan pada saat

kompilasi hal ini dapat dilakukan dengan dengan menuliskan syntax:

<%@ include file=”namafile”%>

Untuk lebih jelasnya ikuti langkah-langkah berikut: 1. Ketikan script pada listing 2.2 dengan menggunakan text

editor/Kate/CoffeCup/BlueFish simpan dengan nama header.htm pada folder /usr/local/jakarta-tomcat-5.5.7/webapps /ROOT.

2. Ketikan script pada listing 2.3 dengan menggunakan text editor/Kate/CoffeCup/BlueFish simpan dengan nama footer.htm pada folder /usr/local/jakarta-tomcat-5.5.7/webapps/ROOT.

3. Ketikan script pada listing 2.4 dengan menggunakan text editor/Kate/CoffeCup/BlueFish simpan dengan nama myinclude.jsp pada folder /usr/local/jakarta -tomcat-5.5.7/webapps/ROOT.

4. Jalankan myinclude.jsp dengan memanggil ala mat URL: http://localhost/myinclude.jsp

5. Hasil dari script anda seperti tampak pada gambar 2.2 Listing 2.2 – header.htm

<html> <head> <title>Percobaan Include Header dan Footer</title> </head> <body> <h1 align="center"><font color="#0000A0" face="Garamond">PEMROGRAMAN INTERNET</font></h1> </body> </html>

Page 19: PEMROGRAMAN INTERNET (Java Server Pages ) · PDF filememberikan arahan tentang pelaksanaan praktikum ... adalah teknologi Web berbasis bahasa pemrograman Java dan berjalan pada ...

Modul Praktikum Pemrograman Internet 19

Laboratorium Teknik Informatika Fakultas Teknik - Univers itas Dr. Soetomo Surabaya

Listing 2.3 – footer.htm

<html> <head> <title>Untitled Document</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> </head> <body> <table width="75%" border="1" align="center" bgcolor="#CCFF00"> <tr> <td> <div align="center"> <font face="Verdana, Arial, Helvetica, sans-serif"> <em>Footer yang di include kan pada JSP</em> </font> </div> </td> </tr> </table> </body> </html>

Listing 2.4 – myinclude.jsp <%@include file="header.htm" %>

<p align="center">Bila anda melihat tulisan ini <font color="#000080" size="+2">Pemrograman Internet</font>maka percobaan directive include telah berhasil</p> <%@include file="footer.htm" %>

Gambar 2.2 Tampilan percobaan directive include

Page 20: PEMROGRAMAN INTERNET (Java Server Pages ) · PDF filememberikan arahan tentang pelaksanaan praktikum ... adalah teknologi Web berbasis bahasa pemrograman Java dan berjalan pada ...

Modul Praktikum Pemrograman Internet 20

Laboratorium Teknik Informatika Fakultas Teknik - Univers itas Dr. Soetomo Surabaya

2.5.3 Percobaan Untuk Tag Action Include

Percobaan berikut ini adalah contoh dari penggunaan tag Action

include yang dihunakan untuk menghasilkan tampilan untuk

navigation bar yang dapat memberitahukan d imana kita berada

dan memberi tampilan button yang berbeda.

Untuk lebih jelasnya ikuti langkah-langkah berikut:

1. Ketikan script pada listing 2.5 dengan menggunakan text editore simpan dengan nama mytaginclude.htm pada folder /usr/local/jakarta-tomcat-5.5.7/webapps/ROOT.

2. Ketikan script pada listing 2.6 dengan menggunakan text editor simpan dengan nama taginclude.jsp pada folder /usr/local/jakarta-tomcat-5.5.7/webapps/ROOT.

3. Ketikan script pada listing 2.7 dengan menggunakan text editor simpan dengan nama navbar.jsp pada folder /usr/local/jakarta-tomcat-5.5.7/webapps/ROOT.

4. Jalankan myinclude.jsp dengan memanggil alamat URL: http://localhost/mytaginclude.htm

5. Hasil dari script anda seperti ta mpak pada gambar 2.3 dan gambar 2.4

Listing 2.5 – mytaginclude.htm

<html> <head> <title>Penggunaan TAG ACTION INCLUDE</title> </head> <body> <div align="center"> <p> <font color="#000080" size="5" face="Georgia "> Penggunaan Tag Action Include untuk Navigation Bar</font> </p> <p>Click salah satu link di bawah ini</p> <table width="100%" border="1" cellspacing="2" cellpadding="1"> <tr bgcolor="#000033"> <td width="25%"><div align="center"> <font color="#FFFF00"> <strong><a href="taginclude.jsp?link=home">Home</a> </strong> </font> </div></td> <td width="25%"><div align="center"> <font color="#FFFF00"> <strong><a href="taginclude.jsp?link=krs">KRS</a> </strong></font></div></td> <td width="25%"><div align="center"> <font color="#FFFF00"> <strong><a href="taginclude.jsp?link=jadwal">Jadwal</a> </strong>

Page 21: PEMROGRAMAN INTERNET (Java Server Pages ) · PDF filememberikan arahan tentang pelaksanaan praktikum ... adalah teknologi Web berbasis bahasa pemrograman Java dan berjalan pada ...

Modul Praktikum Pemrograman Internet 21

Laboratorium Teknik Informatika Fakultas Teknik - Univers itas Dr. Soetomo Surabaya

</font></div></td> <td width="25%"><div align="center"> <font color="#FFFF00"> <strong><a href="taginclude.jsp?link=about">About</a> </strong></font></div></td> </tr> </table> </div> </body> </html>

Listing 2.5 – taginclude.jsp

<% String link =request.getParameter("link"); %> <html> <head> <title>Penggunaan tag action include</title> </head> <body> <jsp:include page="navbar.jsp" flush="true"> <jsp:param name="link" value="<%=link%>" /> </jsp:include> <div align="left"> <a href="mytaginclude.htm">Kembali ke menu</a> </div> </body> </html>

Listing 2.6 – navbar.jsp

<% String kliklink = request.getParameter("link"); String isi = ""; String latarhome ="#EEEEEE"; if (kliklink.equals("home")) { latarhome ="#000066"; isi="Isi Nilai"; } String latarkrs ="#EEEEEE"; if (kliklink.equals("krs")) { latarkrs ="#000066"; isi="Isi KRS"; } String latarjadwal ="#EEEEEE"; if (kliklink.equals("jadwal")) { latarjadwal ="#000066"; isi="Isi Jadwal";

Page 22: PEMROGRAMAN INTERNET (Java Server Pages ) · PDF filememberikan arahan tentang pelaksanaan praktikum ... adalah teknologi Web berbasis bahasa pemrograman Java dan berjalan pada ...

Modul Praktikum Pemrograman Internet 22

Laboratorium Teknik Informatika Fakultas Teknik - Univers itas Dr. Soetomo Surabaya

} String latarabout ="#EEEEEE"; if (kliklink.equals("about")) { latarabout ="#000066"; isi="Isi About"; } %> <div align="center"> <table width="100%" border="1" cellspacing="2" cellpadding="1"> <tr bgcolor="#000033"> <td width="25%" bgcolor="<%=latarhome%>"> <div align="center"> <font color="#FFFF00"> <strong>Home</strong></font> </div> </td> <td width="25%" bgcolor="<%=latarkrs%>"> <div align="center"> <font color="#FFFF00"><strong>KRS</strong></font> </div> </td> <td width="25%" bgcolor="<%=latarjadwal%>"> <div align="center"> <font olor="#FFFF00"><strong>Jadwal</strong></font> </div> </td> <td width="25%" bgcolor="<%=latarabout%>"> <div align="center"> <font color="#FFFF00"><strong>About</strong></font> </div> </td> </tr> </table> </div> <%=isi%>

Page 23: PEMROGRAMAN INTERNET (Java Server Pages ) · PDF filememberikan arahan tentang pelaksanaan praktikum ... adalah teknologi Web berbasis bahasa pemrograman Java dan berjalan pada ...

Modul Praktikum Pemrograman Internet 23

Laboratorium Teknik Informatika Fakultas Teknik - Univers itas Dr. Soetomo Surabaya

Gambar 2.3 Tampilan percobaan tag action include (mytaginclude.htm)

Gambar 2.4 Tampilan percobaan tag action include navbar.jsp

2.5.4 Latihan

Tambahkan program pada script d i atas sehingga pada setiap

tampilan menu muncul deskripsi tepat di bawahnya. Seperti tampak

pada gambar 2.5. Gunakan table dan satu variable untuk masing-masing

deskripsi menu.

Gambar 2.5 Tampilan latihan

Page 24: PEMROGRAMAN INTERNET (Java Server Pages ) · PDF filememberikan arahan tentang pelaksanaan praktikum ... adalah teknologi Web berbasis bahasa pemrograman Java dan berjalan pada ...

Modul Praktikum Pemrograman Internet 24

Laboratorium Teknik Informatika Fakultas Teknik - Univers itas Dr. Soetomo Surabaya

Bab III Pemrograman Java dalam JSP

3.1 Percobaan Penggunaan Form, variable, kondisi

Percobaan berikut ini adalah contoh dari penggunaan form, variable,

kondisi yang digunakan untuk mengkonversi angka (1-9) menjadi huruf

pada satu halaman JSP. Untuk lebih jelasnya ikuti langkah-langkah berikut:

1. Ketikan script pada listing 3.1 dengan

menggunakan text editor/dreamweaver/frontpage simpan dengan

nama konversi.jsp pada folder c:\tomcat\webapps\ROOT.

<html> <title>Konversi Angka 1 sampai 9</title> <h1><strong>Konversi angka 1-9</strong></h1> <body> <%! public String konversi(int angka) { String rst; switch (angka) { case 1: rst = "satu"; break; case 2: rst = "dua"; break; case 3: rst = "tiga"; break; case 4: rst = "empat"; break; case 5: rst = "lima"; break; case 6: rst = "enam"; break; case 7: rst = "tujuh"; break; case 8: rst = "delapan"; break; case 9: rst = "sembilan"; break;

default:

Page 25: PEMROGRAMAN INTERNET (Java Server Pages ) · PDF filememberikan arahan tentang pelaksanaan praktikum ... adalah teknologi Web berbasis bahasa pemrograman Java dan berjalan pada ...

Modul Praktikum Pemrograman Internet 25

Laboratorium Teknik Informatika Fakultas Teknik - Univers itas Dr. Soetomo Surabaya

rst = "Angka yang dimasukkan hanya boleh 1-9"; break; } return rst; } %>

<p>Masukkan nilai</p> <form name="form1" method="post" action="konv.jsp"> <p> <input type="text" name="angka"> </p> <p> <input type="submit" name="Submit" value="konversi"> </p> </form>

<% String stangka=request.getParameter("angka"); int nl; try {

nl = Integer.parseInt(stangka); if (stangka != null && stangka.length() >0)

{ out.println(konversi(nl));

} }

catch (Exception e) {

if (stangka != null && stangka.length() >0) { out.println("Yang anda masukkan bukan angka"); } } finally {

if (stangka != null) stangka=null; } %>

</body> </html>

2. Jalankan konversi.jsp dengan memanggil ala mat URL:

http://localhost/konversi.htm

3. Hasil dari script anda seperti ta mpak pada gambar 3.1

Page 26: PEMROGRAMAN INTERNET (Java Server Pages ) · PDF filememberikan arahan tentang pelaksanaan praktikum ... adalah teknologi Web berbasis bahasa pemrograman Java dan berjalan pada ...

Modul Praktikum Pemrograman Internet 26

Laboratorium Teknik Informatika Fakultas Teknik - Univers itas Dr. Soetomo Surabaya

Gambar 3.1 Tampilan percobaan konversi angka 1-9 3.2 Latihan

Buat script baru untuk mengkonversi semua angka (0 sampai dengan

999.999.999.999.999). Diluar itu berikan keterangan “angka diluar

jangkauan”. Apabila yang d imasukkan bukan angka berikan keterangan

“yang anda masukkan bukan angka” gunakan Try, Catch dan Finally.

Hati- hati dengan bilangan 10, 11,100,1000 (sepuluh, sebelas, seratus,

seribu). Hasilnya seperti pada ga mbar berikut:

Gambar 3.2 Tampilan latihan konversi angka.

Page 27: PEMROGRAMAN INTERNET (Java Server Pages ) · PDF filememberikan arahan tentang pelaksanaan praktikum ... adalah teknologi Web berbasis bahasa pemrograman Java dan berjalan pada ...

Modul Praktikum Pemrograman Internet 27

Laboratorium Teknik Informatika Fakultas Teknik - Univers itas Dr. Soetomo Surabaya

Bab IV Vector dan Session

4.1 Percobaan Penggunaan vector dan Session

Percobaan berikut ini adalah contoh dari penggunaan vector dan

Session yang diimple mentasikan pada entry data mahasiswa mulai

dari pena mbahan data, hapus dan edit.

Untuk lebih jelasnya ikuti langkah-langkah berikut:

1. Ketikkan script pada listing 4.1 dengan menggunakan text editor

simpan dengan nama myvektor.jsp pada folder /usr/local/Jakarta-

tomcat-5.5.7/webapps/ROOT.

<%@ page contentType="text/plain; charset=iso-8859-1" language="java" session ="true" import="java.util.*" %> <html> <head> <title>Vektor dan Session</title> </head> <body> <h1>Entry Data Mahasiswa</h1> <% String nim; String nama; Vector vnim = (Vector)session.getAttribute("vnim"); //new Vector() Vector vnama = (Vector)session.getAttribute("vnama"); //new Vector() String Submit; String[] idhapus = null; String idEdit; int indexhapus; int i = 0; %> <form name="form1" method="post" action="myvektor.jsp"> <table width="576" border="0" cellpadding="0" cellspacing="0"> <tr> <td width="103" height="23" valign="top">NIM</td> <td width="207" valign="top"><input name="nim" type="text"></td> <td width="52">&nbsp;</td> <td width="104">&nbsp;</td> <td width="110"></td>

</tr> <tr>

<td height="24" valign="top">Nama</td> <td colspan="3" valign="top"><input name="nama" type="text" size="60"></td>

Page 28: PEMROGRAMAN INTERNET (Java Server Pages ) · PDF filememberikan arahan tentang pelaksanaan praktikum ... adalah teknologi Web berbasis bahasa pemrograman Java dan berjalan pada ...

Modul Praktikum Pemrograman Internet 28

Laboratorium Teknik Informatika Fakultas Teknik - Univers itas Dr. Soetomo Surabaya

<td></td> </tr>

<tr> <td height="27">&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td align="right" valign="middle"><input name="Submit" type="submit" value="Tambah"></td> <td></td>

</tr> <tr> <td></td> <td></td> <td></td> <td></td> <td></td>

</tr> </table> </form> <% Submit = request.getParameter("Submit"); idhapus = request.getParameterValues("cbhapus"); if (idhapus == null) idhapus = new String[0]; idEdit =request.getParameter("Radio"); if (vnim==null || vnama ==null) { vnim = new Vector(); session.setAttribute("vnim",vnim); vnama = new Vector(); session.setAttribute("vnama",vnama); } if (Submit==null) Submit=""; if (Submit.equals("Tambah")) { nim = request.getParameter("nim"); nama = request.getParameter("nama"); if (nama != null && nama.length()>0 && nim != null && nim.length()>0 ) { vnim.add(nim); vnama.add(nama); } }

else if (Submit.equals("Hapus")) {

for (i = 0; i < idhapus.length ; i + + ) { indexhapus = Integer.parseInt(idhapus[i]); indexhapus=indexhapus-i; vnama.remove(indexhapus); vnim.remove(indexhapus); } }

Page 29: PEMROGRAMAN INTERNET (Java Server Pages ) · PDF filememberikan arahan tentang pelaksanaan praktikum ... adalah teknologi Web berbasis bahasa pemrograman Java dan berjalan pada ...

Modul Praktikum Pemrograman Internet 29

Laboratorium Teknik Informatika Fakultas Teknik - Univers itas Dr. Soetomo Surabaya

else if (Submit.equals("Edit") && vnim.size() > 0) { try { int idEd =Integer.parseInt(idEdit); session.setAttribute("nim", vnim.get(idEd)); session.setAttribute("nama", vnama.get(idEd)); session.setAttribute("id", idEdit); %> <jsp:forward page="editvektor.jsp" /> <%

} catch (Exception e) { out.println("Record yang diedit belum ditandai"); } finally {}

} else if (Submit.equals("Simpan")) { String enim = request.getParameter("enim"); String enama = request.getParameter("enama"); String id = (String)session.getAttribute("id"); int idEd =Integer.parseInt(id); vnim.set(idEd,enim); vnama.set(idEd,enama); } else {} %> <form name="form2" method="post" action="myvektor.jsp"> <table width="738" border="1" cellpadding="0" cellspacing="0"> <tr> <td width="149" valign="middle" bgcolor="#003333"><div

align="center"> <strong><font color="#999999">NIM</font></strong></div></td> <td width="434" valign="middle" bgcolor="#003333"><div align="center"><strong><font color="#999999">Nama</font></strong></div></td> <td width="85" height="21" valign="middle" bgcolor="#003333"><div align="center"><strong><font color="#999999">Edit?</font></strong></div></td>

<td width="90" valign="middle" bgcolor="#003333"><div align="center"><strong><font color="#FF3300">Hapus?</font></strong></div></td> </tr> <% String bgColor; for (i=0;i < vnim.size() && i < vnama.size();i++ ) { if (i % 2 == 0) bgColor="#FFFFFF"; else bgColor="#FFFF99"; out.println("<tr>"); out.println("<td valign=" + '"'+ "middle" + '"' + " bgcolor=" + '"' + bgColor + '"' + ">" + vnim.get(i) + "</td>"); out.println("<td valign=" + '"' + "middle" + '"' + " bgcolor=" + '"' + bgColor + '"' + ">" + vnama.get(i) + "</td>");

Page 30: PEMROGRAMAN INTERNET (Java Server Pages ) · PDF filememberikan arahan tentang pelaksanaan praktikum ... adalah teknologi Web berbasis bahasa pemrograman Java dan berjalan pada ...

Modul Praktikum Pemrograman Internet 30

Laboratorium Teknik Informatika Fakultas Teknik - Univers itas Dr. Soetomo Surabaya

out.println("<td height=" + '"' + "20" + '"' + " align=" + '"' + "center" + '"' + "valign=" + '"' + "middle" + '"' + " bgcolor=" + '"' + bgColor + '"' + "> "); out.println("<input name=" + '"' + "Radio" + '"' + "type=" + '"' + "radio" + '"' + " value=" + '"' + i + '"' + "> </td>"); out.println("<td height=" + '"' + "20" + '"' + " align=" + '"' +"center" + '"' + "valign=" + '"' + "middle" + '"' + " bgcolor=" + '"' + bgColor + '"' + "> "); out.println("<input name=" + '"' + "cbhapus" + '"' + " type=" + '"' + "checkbox" + '"' + " value=" + '"' + i + '"' + " > </td>"); out.println("</tr>"); }%> <tr> <td>&nbsp;</td> <td>&nbsp;</td> <td height="32" align="center" valign="middle"><input name="Submit" type="submit" id="Submit" value="Edit"></td> <td align="center" valign="middle"><input name="Submit" type="submit" value="Hapus"></td> </tr> </table> </form> </body> </html>

2. Ketikan script pada listing 4.2 dengan menggunakan text editor

simpan dengan nama editvektor.jsp pada folder /usr/local/jakarta-

tomcat-5.5.7/webapps/ROOT.

<html> <head> <title>Untitled Document</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> </head> <body> <h1>Edit Data Mahasiswa</h1> <p>

<% String nim = (String)session.getAttribute("nim"); String nama = (String)session.getAttribute("nama"); %> </p> <form name="form1" method="post" action="myvektor.jsp"> <table width="346" border="0" cellpadding="0" cellspacing="0"> <tr> <td width="96" height="22" valign="top">NIM</td>

Page 31: PEMROGRAMAN INTERNET (Java Server Pages ) · PDF filememberikan arahan tentang pelaksanaan praktikum ... adalah teknologi Web berbasis bahasa pemrograman Java dan berjalan pada ...

Modul Praktikum Pemrograman Internet 31

Laboratorium Teknik Informatika Fakultas Teknik - Univers itas Dr. Soetomo Surabaya

<td width="139" valign="top"><input name="enim" type="text" value="<%=nim%>"></td> <td width="111">&nbsp;</td> </tr> <tr> <td height="23" valign="top">NAMA</td> <td colspan="2" valign="top"><input name="enama" type="text" value="<%=nama%>" size="50"></td> </tr> <tr> <td height="25">&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> </tr> <tr> <td height="28" align="left" valign="middle"><input type="submit" name="Submit" value="Simpan"></td> <td>&nbsp;</td> <td align="right" valign="middle"><input name="submit" type="Submit" value="Batal"></td> </tr> </table> </form> </body> </html>

4. Jalankan myvektor.jsp dengan memanggil alamat URL:

http://localhost/myvektor.htm 5. Hasil dari script anda seperti ta mpak pada gambar 4.1 dan gambar

4.2

Page 32: PEMROGRAMAN INTERNET (Java Server Pages ) · PDF filememberikan arahan tentang pelaksanaan praktikum ... adalah teknologi Web berbasis bahasa pemrograman Java dan berjalan pada ...

Modul Praktikum Pemrograman Internet 32

Laboratorium Teknik Informatika Fakultas Teknik - Univers itas Dr. Soetomo Surabaya

Gambar 4.1 Tampilan latihan Vector dan session.

Gambar 4.2 Tampilan latihan Vector dan session. 4.2 Latihan

Modifikasi program di a tas untuk entry data barang dengan field-

field Kode, Nama Barang, Harga Barang, Jumlah. Ta mbahkan

konfirmasi apabila record akan dihapus serta tambahkan untuk

pengecekan data, apakah kode barang ada yang sama, bila ada berikan

peringatan.

Page 33: PEMROGRAMAN INTERNET (Java Server Pages ) · PDF filememberikan arahan tentang pelaksanaan praktikum ... adalah teknologi Web berbasis bahasa pemrograman Java dan berjalan pada ...

Modul Praktikum Pemrograman Internet 33

Laboratorium Teknik Informatika Fakultas Teknik - Univers itas Dr. Soetomo Surabaya

Bab V JDBC

5.1 Percobaan JDBC Connection, Statement dan Resultset

5.1.1. Percobaan pembuatan table dengan JDBC

Percobaan berikut ini adalah contoh dari penggunaan JDBC connection,

statement dan resultset yang digunakan untuk membuat table dengan

methode executeUpdate. Untuk lebih jelasnya ikuti langkah-langkah

berikut:

1. Buat database pada PostgreSQL Server dengan na ma Jualan.

2. Ketikan script pada listing 5.1 dengan menggunakan text editor simpan

dengan nama buatabel.jsp pada folder ..\ROOT\[nimanda]\.

<%@page contentType="text/html; charset=iso-8859-1" language="java" import="java.sql.*" errorPage="" %> <html> <head> <title>Entry Data Customer</title> </head> <% try { Class.forName("org.postgresql.Driver"); Connection conn=DriverManager.getConnection ("jdbc:postgresql://localhost:5432/mydb?user=mhs&password=unitomo"); String sQry ="CREATE TABLE customer2(CustID varchar(6), CustName varchar(50), CustAdd varchar(50), CustCity varchar(20), CustPhone varchar(20), CustFax varchar(20), CustCredLimit money)"; Statement ST = conn.createStatement(); int sukses = ST.executeUpdate(sQry); if (sukses>=0) out.println("Buat Tabel sukses <br> Jumlah Tabel yang Dibuat: "+sukses); } catch(Exception e) {out.println("Kesalahan : "+e);} %> <body> </body> </html>

3. Jalankan buatabel.jsp dengan memanggil alamat URL: http://localhost/buatabel.jsp

5.1.2. Percobaan menambah data

Percobaan berikut ini adalah contoh dari penggunaan JDBC connection,

Page 34: PEMROGRAMAN INTERNET (Java Server Pages ) · PDF filememberikan arahan tentang pelaksanaan praktikum ... adalah teknologi Web berbasis bahasa pemrograman Java dan berjalan pada ...

Modul Praktikum Pemrograman Internet 34

Laboratorium Teknik Informatika Fakultas Teknik - Univers itas Dr. Soetomo Surabaya

statement dan resultset yang digunakan untuk mena mbah data dengan

methode executeUpdate. Untuk lebih jelasnya ikuti langkah-langkah

berikut:

1. Ketikkan script pada listing 5.2 dengan menggunakan text editor

simpan dengan nama tambahdata.jsp pada folder ..\ROOT\[nimanda ]\.

<%@ page import="java.sql.*" errorPage="" %> <html> <head> <title>Entry Data Customer</title> </head> <% try Class.forName("org.postgresql.Driver"); Connection conn=DriverManager.getConnection ("jdbc:postgresql://localhost:5432/mydb?user=mhs&password=unitomo"); String sQry ="INSERT INTO customer (CustID, CustName, CustAdd, CustCity, CustPhone, CustFax, CustCredLimit) Values ('000001','Shanti','Jl. Hayam Wuruk 63','Pacet','0321-690188','0321-6901234',100000000)"; Statement ST = conn.createStatement(); int sukses = ST.executeUpdate(sQry); if (sukses>=0) out.println("Tambah data sukses <br> Jumlah record yang ditambahkan "+sukses); } catch(Exception e) {out.println("Kesalahan : "+e);} %> <body> </body> </html>

2. Jalankan tambahdata.jsp dengan memanggil alamat URL:

http://localhost/tambahdata.jsp

5.1.3. Percobaan menghapus data

Percobaan berikut ini adalah contoh dari penggunaan JDBC connection,

statement dan resultset yang digunakan untuk menghapus data

dengan methode executeUpdate. Contoh berikut menunjukkan data yang

akan dihapus adalah dengan CustID = ‘000001’. Untuk lebih jelasnya ikuti

langkah-langkah berikut:

1. Ketikan script pada listing 5.3 dengan menggunakan text editor

simpan dengan nama hapusdata.jsp pada folder

..\ROOT\[nimanda]\.

<%@ page import="java.sql.*" errorPage="" %> <html> <head> <title>Entry Data Customer</title>

Page 35: PEMROGRAMAN INTERNET (Java Server Pages ) · PDF filememberikan arahan tentang pelaksanaan praktikum ... adalah teknologi Web berbasis bahasa pemrograman Java dan berjalan pada ...

Modul Praktikum Pemrograman Internet 35

Laboratorium Teknik Informatika Fakultas Teknik - Univers itas Dr. Soetomo Surabaya

</head> <% try { Class.forName("org.postgresql.Driver"); Connection conn=DriverManager.getConnection ("jdbc:postgresql://localhost:5432/mydb?user=mhs&password=unitomo"); String sQry ="Delete customer where CustID='000001'"; Statement ST = conn.createStatement(); int sukses = ST.executeUpdate(sQry); if (sukses>=0) out.println("Delete data sukses<br>Jumlah record yang dihapus "+sukses); }catch(Exception e){out.println("Kesalahan : "+e);} %> <body>

</body> </html>

2. Jalankan hapusdata.jsp dengan memanggil alamat URL: http://localhost/hapusdata.jsp

5.1.4. Percobaan edit data

Percobaan berikut ini adalah contoh dari penggunaan JDBC connection,

statemen t dan resultset yang digunakan untuk meng-edit data dengan

methode executeUpdate. Contoh berikut menunjukkan data yang akan

diedit adalah dengan CustID =‘000001’. Untuk lebih jelasnya ikuti

langkah-langkah berikut: 1. Ketikan script pada listing 5.4 dengan menggunakan text editor

simpan dengan nama editdata.jsp pada folder

..\ROOT\[nimanda]\. <%@ page import="java.sql.*" errorPage="" %> <html> <head> <title>Entry Data Customer</title> </head> <% try { Class.forName("org.postgresql.Driver"); Connection conn=DriverManager.getConnection ("jdbc:postgresql://localhost:5432/mydb?user=mhs&password=unitomo"); String sQry ="Update customer set CustName=’Pelanggan baru’ where CustID='000001'"; Statement ST = conn.createStatement(); int sukses = ST.executeUpdate(sQry); if (sukses>=0) out.println("Edit data sukses <br> Jumlah record yang di-edit "+sukses); } catch(Exception e) {out.println("Kesalahan : "+e);} %> <body>

Page 36: PEMROGRAMAN INTERNET (Java Server Pages ) · PDF filememberikan arahan tentang pelaksanaan praktikum ... adalah teknologi Web berbasis bahasa pemrograman Java dan berjalan pada ...

Modul Praktikum Pemrograman Internet 36

Laboratorium Teknik Informatika Fakultas Teknik - Univers itas Dr. Soetomo Surabaya

</body> </html>

2. Jalankan editdata.jsp dengan memanggil ala mat URL:

http://localhost/editdata.jsp

5.1.5. Percobaan menampilkan data Percobaan berikut ini adalah contoh dari penggunaan JDBC connection,

statement dan resultset yang digunakan untuk meng-edit data dengan

methode executeQuery. Untuk lebih jelasnya ikuti langkah-langkah berikut:

1. Ketikan script pada listing 5.5 dengan menggunakan text editor simpan dengan nama sho wdata.jsp pada folder ..\ROOT\[nimanda]\. <%@ page import="java.sql.*"%> <%

Class.forName("org.postgresql.Driver"); Connection conn=DriverManager.getConnection ("jdbc:postgresql://localhost:5432/mydb?user=mhs&password=unitomo"); Statement ST = conn.createStatement(); ResultSet RS = ST.executeQuery("Select * from Customer order by CustID");

int i = 1;

//String sQry ="CREATE TABLE customer2 (CustID varchar(6), CustName varchar(50), CustAdd varchar(50), CustCity varchar(20), CustPhone varchar(20), CustFax varchar(20), CustCredLimit money)"; %>

<table width="100%" border="1" cellspacing="2" cellpadding="0"> <!--DWLayoutTable--> <tr> <td width="73" height="21" valign="top" bgcolor="#666666"><div

align="center">No</div></td> <td width="119" valign="top" bgcolor="#666666"><div

align="center">Kode</div></td> <td width="461" valign="top" bgcolor="#666666"><div

align="center">Nama </div></td> <td width="461" valign="top" bgcolor="#666666"><div

align="center">Alamat</div></td> <td width="461" valign="top" bgcolor="#666666"><div

align="center">Kota</div></td> <td width="461" valign="top" bgcolor="#666666"><div

align="center">Phone</div></td> <td width="27" valign="top" bgcolor="#666666"><div

align="center">Fax</div></td> <td width="341" valign="top" bgcolor="#666666"><div

align="right">Batas Kredit</div></td>

</tr> <% while (RS.next()) { %> <tr> <td width="73" height="21" valign="top"><div align="right"><%=i%></div></td>

<td width="119" valign="top"><div

Page 37: PEMROGRAMAN INTERNET (Java Server Pages ) · PDF filememberikan arahan tentang pelaksanaan praktikum ... adalah teknologi Web berbasis bahasa pemrograman Java dan berjalan pada ...

Modul Praktikum Pemrograman Internet 37

Laboratorium Teknik Informatika Fakultas Teknik - Univers itas Dr. Soetomo Surabaya

align="left"><%=RS.getString("CustID")%></div></td> <td width="461" valign="top"><div align="left"><%=RS.getString("CustName")%></div></td>

<td width="461" valign="top"><div align="left"><%=RS.getString("CustAdd")%></div></td>

<td width="461" valign="top"><div align="left"><%=RS.getString("CustCity")%></div></td>

<td width="461" valign="top"><div align="left"><%=RS.getString("CustPhone")%></div></td>

<td valign="top"><div align="left"><%=RS.getString("CustFax")%></div></td>

<td align="right" valign="middle"><div align="right"><%=RS.getString("CreditLimit")%></div></td>

</tr> <%

i++; } %> </table>

2. Jalankan showdata.jsp dengan memanggil ala mat URL: http://localhost/showdata.jsp

5.2. Latihan

Buatlah program untuk entry data Customer, sedemikian rupa sehingga

bentuknya sama dengan percobaan Vector dan session pada bab IV.

Tambahkan konfirmasi apabila record akan dihapus serta tambahkan

untuk validasi data, apakah kode pelanggan (CustID) ada yang sama,

bila ada berikan peringatan.