TUTORIAL CRUD WEB SERVICE

Tutorial CRUD Web Service Server dan Client dengan Java

(Menggunakan JSP dan Bootstrap)

DISUSUN UNTUK MATAKULIAH PEMROGRAMAN WEB II

DECEMBER 18, 2018

HENDRO WIJAYANTO
Tutorial CRUD Web Service Server dan Client dengan Java
(Menggunakan JSP dan Bootstrap)
1. Buat terlebih dahulu database MySQL. Dalam hal ini disiapkan database siakad
dengan nama table mahasiswa. Seperti Nampak gambar berikut ini :

2. Kemudian Buka Netbeans. Buatlah satu buah Project Web Service. Klik File –
New Project – Java Web – Web Application. Beri Project Name Siakad. Next,
gunakan server Glassfish. Kemudian Klik Finish.

3. Setelah Web Application terbentuk, saatnya membuat Web Service di dalamnya.

Caranya, Klik Kanan pada Project Siakad – New – Pilih Web Service
4. Kemudian isikan Web Service Name : Mahasiswa, dan Package
siakad.mahasiswa. Kemudian Klik Finish.

5. Langkah selanjutnya adalah membuat koneksi ke database MySQL.

6. Klik Kanan pada Package siakad.mahasiswa – New – Java Class. Beri nama
Class Name : koneksiMySQL
7. Untuk Script koneksiMySQL adalah

package siakad.mahasiswa;

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

/**
*
* @author Mr. Hendro Wijayanto, S.Kom, M.Kom
*/
public class koneksiMySQL {
String driver = "com.mysql.jdbc.Driver";
String url = "jdbc:mysql://localhost:3306/siakad";
String usern = "root";
String passw = "";
Connection con;
PreparedStatement ps;
ResultSet rs;

public Connection getCon(){

try{
Class.forName(driver);
con = DriverManager.getConnection(url, usern,
passw);
}catch(Exception ex) {
System.out.println(ex.getMessage());
}
return con;
 }
}

8. Jangan lupa masukkan library MySQL JDBC Drivernya ya

9. Agar data MySQL dapat dipanggil di Web Service, maka dibutuhkan Getter dan
Setter masing-masing data. Caranya, klik kanan pada Package siakad.mahasiswa
– New – Pilih Java Class. Beri Class Name : mhs. Kemudian tuliskan Scriptnya
seperti gambar berikut ini :

package siakad.mahasiswa;

/**
*
* @author Mr. Hendro Wijayanto, S.Kom, M.Kom
*/
public class mhs {
private int nim;
private String nama, jurusan, email, alamat;

public int getNim() {

return nim;
}

public void setNim(int nim) {

this.nim = nim;
}

public String getNama() {

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

public String getJurusan() {

return jurusan;
}

public void setJurusan(String jurusan) {

this.jurusan = jurusan;
}

public String getEmail() {

return email;
}

public void setEmail(String email) {

this.email = email;
}

public String getAlamat() {

return alamat;
}

public void setAlamat(String alamat) {

this.alamat = alamat;
}

10. Setelah itu, Kita akan membuat Method Cread, Read, Update dan Delete di dalam
Class Mahasiswa.java.
11. Untuk Scriptnya seperti Berikut ini :
Method getMahasiswa
@WebMethod(operationName = "getMahasiswa")
public ArrayList<mhs> getDosen() {
ArrayList<mhs> mhs = new ArrayList<>();
try {
con = kon.getCon();
ps = con.prepareStatement("select * from
mahasiswa");
rs = ps.executeQuery();
while (rs.next()) {
mhs mahasiswa = new mhs();
mahasiswa.setNim(rs.getInt("nim"));
mahasiswa.setNama(rs.getString("nama"));
mahasiswa.setJurusan(rs.getString("jurusan"));
mahasiswa.setEmail(rs.getString("email"));

mahasiswa.setAlamat(rs.getString("alamat"));
mhs.add(mahasiswa);
}
} catch (Exception ex) {
System.out.println(ex);
}
return mhs;
}

Method insertMahasiswa
@WebMethod(operationName = "addMahasiswa")
public void addDosen(
@WebParam(name = "nim") int nim,
@WebParam(name = "nama") String nama,
@WebParam(name = "jurusan") String jurusan,
@WebParam(name = "email") String email,
@WebParam(name = "alamat") String alamat
) {
try {
con = kon.getCon();
ps = con.prepareStatement("insert into mahasiswa
value (?,?,?,?,?)");
ps.setInt(1, nim);
ps.setString(2, nama);
ps.setString(3, jurusan);
ps.setString(4, email);
ps.setString(5, alamat);
ps.executeUpdate();
} catch (Exception ex) {
System.out.println(ex.getMessage());
}
}

Method delMahasiswa
@WebMethod(operationName = "delMahasiswa")
public void delMahasiswa(
@WebParam(name = "nim") int nim) {
try {
con = kon.getCon();
ps = con.prepareStatement("delete from mahasiswa
where nim = ?");
ps.setInt(1, nim);
ps.executeUpdate();
 } catch (Exception e) {
System.out.println("Failed to remove student
because " + e.toString());
}
}

Method editMahasiswa
@WebMethod(operationName = "editMahasiswa")
public void editMahasiswa(
@WebParam(name = "nim") int nim,
@WebParam(name = "nama") String nama,
@WebParam(name = "jurusan") String jurusan,
@WebParam(name = "email") String email,
@WebParam(name = "alamat") String alamat){
try {
con = kon.getCon();
ps = con.prepareStatement("update mahasiswa set
nama=?,jurusan=?,email=?,alamat=? where nim=?");

ps.setString(1, nama);
ps.setString(2, jurusan);
ps.setString(3, email);
ps.setString(4, alamat);
ps.setInt(5, nim);
ps.executeUpdate();
} catch (Exception e) {
System.out.println("Failed to edit student
because " + e.toString());
}
}

Method tampilMahasiswa
@WebMethod(operationName = "tampilMahasiswa")
public List tampilMahasiswa() {
List daftar = new ArrayList();

String sql_daftar = "select * from mahasiswa";

try {
Class.forName("com.mysql.jdbc.Driver");
Connection con =
DriverManager.getConnection("jdbc:mysql://localhost:3306/si
akad", "root", "");
Statement stmt = con.createStatement();
ResultSet rs = stmt.executeQuery(sql_daftar);
while (rs.next()) {
 daftar.add("<td>" + rs.getInt("nim") +
"</td><td>" + rs.getString("nama") + "</td><td>" +
rs.getString("jurusan") + "</td><td>" +
rs.getString("email") + "</td><td>" + rs.getString("alamat")
+ "</td><tr></tr>");
}
con.close();
} catch (Exception ex) {
System.out.println(ex.getMessage());
}
return daftar;
}

--- Tahapan Membuat Client Web Service ---

12. Setelah seluruh method di Server siap. Langkah selanjutnya adalah membuat
Client. Klik File pada Netbeans – New Project – Java Web - Web Application.
Beri Project Name : ClientSiakad

13. Panggil WSDL Siakad ke dalam ClientSiakad. Caranya, klik kanan Project
ClientSiakad – Pilih New – Pilih Web Service Client. Jika tidak menemukan
silakan cari di Other.
14. Kemudian Pilih Next. Pilih Project, dan Browse. Cari server Siakad dan pilih class
Mahasiswa yang didalamnya sudah ada methodnya (Method addMahasiswa,
delMahasiswa, getMahasiswa, editMahasiswa). Kemudian Klik Finish
15. Kemudian langkah selanjutnya adalah membuat Client dengan JSP. Kita akan
desain Halaman JSP agar lebih menarik menggunakan CSS. Ingat matakuliah
Pemrograman Web 1. Ada JSP, ada CSS. Atau mungkin Anda dapat
menggunakan template Bootstrap. Dalam tutorial ini digunakan Bootstrap.
Download terlebih dahulu Bootstrapnya. Setelah Anda mendownload, Extract
Bootstrap di dalam folder Web Pages. Sehingga strukturnya seperti gambar
berikut ini :

16. Buat 1 buah file header.jsp, footer.jsp dan index.jsp di Web Pages Project
ClientSiakad.

Script header.jsp (berisi menu halaman)

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=UTF-8">
<title>Siakad Mahasiswa</title>
<meta name="viewport" content="width=device-width,
initial-scale=1.0">
<!-- Bootstrap -->
<link href="css/bootstrap.min.css"
rel="stylesheet"/>
 </head>
<body>
<!--Kode Navbar-->
<nav class="navbar navbar-default">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better
mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle
collapsed" data-toggle="collapse" data-target="#bs-example-
navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle
navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Siakad
Kampus</a>
</div>

<!-- Collect the nav links, forms, and other

content for toggling -->
<div class="collapse navbar-collapse" id="bs-
example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li class="active"><a href="#">Home<span
class="sr-only">(current)</span></a></li>
<li><a href="#">Profil</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle"
data-toggle="dropdown" role="button" aria-haspopup="true"
aria-expanded="false">Menu<span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="daftar-mhs.jsp">Daftar
Mahasiswa</a></li>
<li><a href="tambah-mhs.jsp">Tambah
Mahasiswa</a></li>
<li><a href="edit-mhs.jsp">Edit
Mahasiswa</a></li>
<li><a href="hapus-mhs.jsp">Hapus
Mahasiswa</a></li>
<li role="separator"
class="divider"></li>
<li><a href="#">Separated
link</a></li>
 <li role="separator"
class="divider"></li>
<li><a href="#">One more separated
link</a></li>
</ul>
</li>
</ul>
<form class="navbar-form navbar-left">
<div class="form-group">
<input type="text" class="form-control"
placeholder="Search">
</div>
<button type="submit" class="btn btn-
default">Submit</button>
</form>
<ul class="nav navbar-nav navbar-right">
<li><a href="#">Link</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle"
data-toggle="dropdown" role="button" aria-haspopup="true"
aria-expanded="false">Dropdown <span
class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another
action</a></li>
<li><a href="#">Something else
here</a></li>
<li role="separator"
class="divider"></li>
<li><a href="#">Separated
link</a></li>
</ul>
</li>
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
<!--Akhir Navbar-->

Script footer.jsp
<script src="https://code.jquery.com/jquery.js"></script>
<script src="js/bootstrap.min.js"></script>
</body>
</html>
Script index.jsp
<%@include file="header.jsp" %>
 <h1>Halaman Mahasiswa</h1>
%@include file="footer.jsp" %

17. Kemudian Masukkan Script berikut di dalam index.jsp

<%@include file="header.jsp" %>

<h3>Daftar Mahasiswa</h3>
<table class="table">
<thead>
<tr>
<th>NIM</th>
<th>Nama</th>
<th>Jurusan</th>
<th>Email</th>
<th>Alamat</th>
</tr>
</thead>
<tbody>
<tr>

</tr>
</tbody>
</table>

%@include file="footer.jsp" %

18. Jika di running maka tampilannya akan seperti berikut ini

19. Agar data di dalam database dapat dipanggil di client, maka perlu memanggil
WSDL. Caranya, drag and drop method getMahasiswa ke dalam index.jsp. Drop
kedalam script antara <tr> dan </tr>. Sehingga script index.jsp nya menjadi

<%@include file="header.jsp" %>

<div class="container">
<h3>Daftar Mahasiswa</h3>
<table class="table table-bordered">
<thead>
<tr>
<th>NIM</th>
<th>Nama</th>
<th>Jurusan</th>
<th>Email</th>
<th>Alamat</th>
</tr>
</thead>
<tbody>
<tr>

<%
try {
siakad.mahasiswa.Mahasiswa_Service
service = new siakad.mahasiswa.Mahasiswa_Service();
siakad.mahasiswa.Mahasiswa port =
service.getMahasiswaPort();

java.util.List<java.lang.Object>
resultMhs = port.tampilMahasiswa();
for (int i = 0; i < resultMhs.size();
i++) {

out.println(resultMhs.get(i));
}
} catch (Exception ex) {

}
%>

</tr>
 </tbody>
</table>
</div>
<%@include file="footer.jsp" %>
20. Maka jika index.jsp atau ClientSiakad di running, akan muncul tampilan

21. Tambahkan link button untuk tambah mahasiswa. Tambahkan script berikut diatas
table
<a href="tambah-mhs.jsp"><button class="btn-success">Tambah
Mahasiswa</button></a>

Hasilnya :

22. Karena tombol Tambah Mahasiswa mengarah ke link tambah-mhs.jsp, maka perlu
ditambahkan file tambah-mhs.jsp

23. Script untuk tambah-mhs.jsp adalah sebagai berikut :

<%@include file="header.jsp" %>
<div class="container">
<h3>Form Tambah Mahasiswa</h3>
<form class="form-horizontal" method="post"
action="proses-tambah-mhs.jsp">
 <div class="form-group">
<label class="control-label col-sm-
1">NIM</label>
<div class="col-sm-2">
<input type="text" class="form-
control" name="nim">
</div>
</div>

<div class="form-group">
<label class="control-label col-sm-
1">Nama</label>
<div class="col-sm-2">
<input type="text" class="form-
control" name="nama">
</div>
</div>

<div class="form-group">
<label class="control-label col-sm-
1">Jurusan</label>
<div class="col-sm-2">
<input type="text" class="form-control"
name="jurusan">
</div>
</div>

<div class="form-group">
<label class="control-label col-sm-
1">Email</label>
<div class="col-sm-2">
<input type="text" class="form-control"
name="email">
</div>
</div>

<div class="form-group">
<label class="control-label col-sm-
1">Alamat</label>
<div class="col-sm-2">
<input type="text" class="form-control"
name="alamat">
</div>
</div>
<button type="submit" class="btn btn-
danger">Simpan</button>
</form>
 </div>
<%@include file="footer.jsp" %>
Hasilnya :

24. Kemudian POST Action dari form tersebut mengarah ke proses-tambah-mhs.jsp.

Sehingga diperlukan file proses-tambah-mhs.jsp

25. Kemudian panggil WSDL Reference untuk method addMahasiswa kedalam

proses-tambah-mhs.jsp (Main drag and drop saja). Scriptnya adalah

<%
try {
siakad.mahasiswa.Mahasiswa_Service service = new
siakad.mahasiswa.Mahasiswa_Service();
siakad.mahasiswa.Mahasiswa port =
service.getMahasiswaPort();
 // TODO initialize WS operation arguments here
int nim = 0;
java.lang.String nama = "";
java.lang.String jurusan = "";
java.lang.String email = "";
java.lang.String alamat = "";
port.addMahasiswa(nim, nama, jurusan, email, alamat);
} catch (Exception ex) {
// TODO handle custom exceptions here
}
%>

26. Rubah sedikit Source Codenya sehingga dapat menerima POST dari tambah-
mhs.jsp dan dapat meredirect langsung ke index.jsp jika proses tambah berhasil.

<%
try {
siakad.mahasiswa.Mahasiswa_Service service = new
siakad.mahasiswa.Mahasiswa_Service();
siakad.mahasiswa.Mahasiswa port =
service.getMahasiswaPort();

int nim =
Integer.valueOf(request.getParameter("nim"));
java.lang.String nama =
request.getParameter("nama");
java.lang.String jurusan =
request.getParameter("jurusan");
java.lang.String email =
request.getParameter("email");
java.lang.String alamat =
request.getParameter("alamat");

port.addMahasiswa(nim, nama, jurusan, email, alamat);

response.sendRedirect("index.jsp");
} catch (Exception ex) {

}
%>

27. Langkah selanjutnya adalah membuat Edit dan Delete. Dalam hal ini, edit dan
Delete bergabung menjadi satu dengan table. Seperti Nampak pada gambar di
bawah ini
28. Agar dapat memunculkan Aksi tersebut, silakan buka Web Service Server Anda.
Buka Project Siakad, Buka class Mahasiswa.java. Kemudian edit pada method
tampilMahasiswa. Sehingga source code berubah menjadi :

@WebMethod(operationName = "tampilMahasiswa")
public List tampilMahasiswa() {
List daftar = new ArrayList();

String sql_daftar = "select * from mahasiswa";

try {
Class.forName("com.mysql.jdbc.Driver");
Connection con =
DriverManager.getConnection("jdbc:mysql://localhost:3306/si
akad", "root", "");
Statement stmt = con.createStatement();
ResultSet rs = stmt.executeQuery(sql_daftar);
while (rs.next()) {
daftar.add("<td>" + rs.getInt("nim") +
"</td><td>" + rs.getString("nama") + "</td><td>" +
rs.getString("jurusan") + "</td><td>" +
rs.getString("email") + "</td><td>" + rs.getString("alamat")
+ "</td><td><button class=\"btn-info\"><a href=\"edit-
mhs.jsp&nim=" + rs.getString("nim") +
"\">Edit</a></button><br><button class=\"btn-danger\"><a
href=\"hapus-mhs.jsp?nim=" + rs.getString("nim") +
"\">Hapus</a></button></td><tr></tr>");
}
con.close();
} catch (Exception ex) {
System.out.println(ex.getMessage());
}
return daftar;
 }

29. Untuk membuat proses hapus, silakan buat 1 buah file JSP di ClientSiakad. Dalam
hal ini dibuat file hapus-mhs.jsp

30. Kemudian panggil WSDL Reference delMahasiswa ke dalam file hapus-mhs.jsp.

Pakai drag and drop boleh, pakai Call Web Service Operation juga boleh.
Sehingga Script hapus-mhs.jsp berubah menjadi :

<%
try {
siakad.mahasiswa.Mahasiswa_Service service = new
siakad.mahasiswa.Mahasiswa_Service();
siakad.mahasiswa.Mahasiswa port =
service.getMahasiswaPort();
// TODO initialize WS operation arguments here
int nim = 0;
port.delMahasiswa(nim);
} catch (Exception ex) {
// TODO handle custom exceptions here
}
%>

31. Rubah sedikit parameter int nim=0, karena fungsi ini akan digunakan untuk
menerima inputan POST berupa hapus mahasiswa berdasarkan nim. Sehingga
scriptnya berubah menjadi :
 <%
try {
siakad.mahasiswa.Mahasiswa_Service service = new
siakad.mahasiswa.Mahasiswa_Service();
siakad.mahasiswa.Mahasiswa port =
service.getMahasiswaPort();

int nim = Integer.valueOf(request.getParameter("nim"));

port.delMahasiswa(nim);
response.sendRedirect("index.jsp");
} catch (Exception ex) {

}
%>

32. Langkah terakhir adalah membuat proses Edit atau Update. Proses ini akan akan
mengambil data mahasiswa dan menampilkannya ke dalam form untuk di edit.
Sebelum mebuat file edit , rubah terlebih dahulu method getMahasiswa di Web
Service Server (Project Siakad). Sehingga berubah menjadi :

/*Get Mahasiswa*/
@WebMethod(operationName = "getMahasiswa")
public List getMahasiswa(
@WebParam(name = "nim") int nim) {
List mahasiswa = new ArrayList();
try {
Class.forName("com.mysql.jdbc.Driver");
Connection conn =
DriverManager.getConnection("jdbc:mysql://localhost:3306/si
akad", "root", "");
Statement st = conn.createStatement();
con = kon.getCon();
ps = con.prepareStatement("select * from
mahasiswa where nim=?");
ps.setInt(1, nim);
ResultSet rst = ps.executeQuery();
while (rst.next()) {
mahasiswa.add("<div class=\"form-group\">\n"
+
" <label class=\"control-label col-sm-
1\">NIM</label>\n" +
" <div class=\"col-sm-2\">\n" +
" <input type=\"text\" class=\"form-
control\" name=\"nim\" value=\""+rst.getInt("nim")+"\"
readonly=\"true\">\n" +
" </div>\n" +
" </div>\n" +
" \n" +
" <div class=\"form-group\">\n" +
" <label class=\"control-label col-sm-
1\">Nama</label>\n" +
" <div class=\"col-sm-2\">\n" +
" <input type=\"text\" class=\"form-
control\" name=\"nama\"
value=\""+rst.getString("nama")+"\">\n" +
" </div>\n" +
" </div>\n" +
" \n" +
" <div class=\"form-group\">\n" +
" <label class=\"control-label col-sm-
1\">Jurusan</label>\n" +
" <div class=\"col-sm-2\">\n" +
" <input type=\"text\" class=\"form-
control\" name=\"jurusan\"
value=\""+rst.getString("jurusan")+"\">\n" +
" </div>\n" +
" </div>\n" +
" \n" +
" <div class=\"form-group\">\n" +
" <label class=\"control-label col-sm-
1\">Email</label>\n" +
" <div class=\"col-sm-2\">\n" +
" <input type=\"text\" class=\"form-
control\" name=\"email\"
value=\""+rst.getString("email")+"\">\n" +
" </div>\n" +
" </div>\n" +
" \n" +
" <div class=\"form-group\">\n" +
" <label class=\"control-label col-sm-
1\">Alamat</label>\n" +
" <div class=\"col-sm-2\">\n" +
" <input type=\"text\" class=\"form-
control\" name=\"alamat\"
value=\""+rst.getString("alamat")+"\">\n" +
" </div>\n" +
" </div>");
}
} catch (Exception ex) {
System.out.println(ex.getMessage());
}
return mahasiswa;
}
/*Selesai Get Mahasiswa*/
33. Kemudian buatlah sebuah file edit-mhs.jsp di ClientSiakad. Kemudian panggil
WSDL Reference getMahasiswa agar data yang akan di edit dapat tampil di dalam
form :

<%@include file="header.jsp" %>

<div class="container">
<h3>Form Edit Mahasiswa</h3>
<form class="form-horizontal" method="post"
action="proses-edit-mhs.jsp">
<%
try {
siakad.mahasiswa.Mahasiswa_Service service = new
siakad.mahasiswa.Mahasiswa_Service();
siakad.mahasiswa.Mahasiswa port =
service.getMahasiswaPort();

int nim = Integer.valueOf(request.getParameter("nim"));

java.util.List<java.lang.Object> result =
port.getMahasiswa(nim);
for (int i = 0; i < result.size(); i++) {
out.println(result.get(i));
}
} catch (Exception ex) {

}
%>
<button type="submit" class="btn btn-
danger">Edit</button>

</form>

</div>
<%@include file="footer.jsp" %>

34. Silakan running dan ujicoba

35. Langkah selanjutnya adalah memuat proses edit. Silakan Anda buat 1 buah file
JSP dengan nama proses-edit-mhs.jsp

36. Kemudian panggil WSDL Reference editMahasiswa ke dalam file proses-edit-

mhs.jsp. Main drag and drop aja.

<%
try {
siakad.mahasiswa.Mahasiswa_Service service = new
siakad.mahasiswa.Mahasiswa_Service();
siakad.mahasiswa.Mahasiswa port =
service.getMahasiswaPort();
// TODO initialize WS operation arguments here
 int nim = 0;
java.lang.String nama = "";
java.lang.String jurusan = "";
java.lang.String email = "";
java.lang.String alamat = "";
port.editMahasiswa(nim, nama, jurusan, email, alamat);
} catch (Exception ex) {
// TODO handle custom exceptions here
}
%>

37. Rubah sedikit source codenya agar dapat menerima masukan dari form edit-
mhs.jsp.

<%
try {
siakad.mahasiswa.Mahasiswa_Service service = new
siakad.mahasiswa.Mahasiswa_Service();
siakad.mahasiswa.Mahasiswa port =
service.getMahasiswaPort();

int nim = Integer.valueOf(request.getParameter("nim"));

java.lang.String nama = request.getParameter("nama");;
java.lang.String jurusan =
request.getParameter("jurusan");;
java.lang.String email =
request.getParameter("email");;
java.lang.String alamat =
request.getParameter("alamat");;
port.editMahasiswa(nim, nama, jurusan, email, alamat);
response.sendRedirect("index.jsp");
} catch (Exception ex) {

}
%>

38. Hasilnya adalah seperti gambar berikut ini :

Sebelum di Update
 Proses Update

Setelah di Update

39. Terimakasih.
 LAMPIRAN
Tampilan Project Siakad (Server)
Tampilan Project ClientSiakad (Client)
Source Code Web Service Mahasiswa

package siakad.mahasiswa; Connection conn =

DriverManager.getConnection("
import java.sql.Connection; jdbc:mysql://localhost:3306/s
import iakad", "root", "");
java.sql.DriverManager; Statement st =
import conn.createStatement();
java.sql.PreparedStatement; con =
import java.sql.ResultSet; kon.getCon();
import java.sql.Statement; ps =
import java.util.ArrayList; con.prepareStatement("select
import java.util.List; * from mahasiswa where
import javax.jws.WebService; nim=?");
import javax.jws.WebMethod; ps.setInt(1,
import javax.jws.WebParam; nim);
ResultSet rst =
/** ps.executeQuery();
* while
* @author Mr. Hendro (rst.next()) {
Wijayanto, S.Kom, M.Kom
*/ mahasiswa.add("<div
@WebService(serviceName = class=\"form-group\">\n" +
"Mahasiswa") " <label
public class Mahasiswa { class=\"control-label col-sm-
1\">NIM</label>\n" +
/*Panggil Koneksi MySQL*/ " <div
koneksiMySQL kon = new class=\"col-sm-2\">\n" +
koneksiMySQL(); "
Connection con; <input type=\"text\"
PreparedStatement ps; class=\"form-control\"
ResultSet rs; name=\"nim\"
/*Selesai Panggil Koneksi value=\""+rst.getInt("nim")+"
MySQL*/ \" readonly=\"true\">\n" +
"
/*Get Mahasiswa*/ </div>\n" +
@WebMethod(operationName " </div>\n" +
= "getMahasiswa") " \n" +
public List getMahasiswa( " <div
@WebParam(name = class=\"form-group\">\n" +
"nim") int nim) { " <label
List mahasiswa = new class=\"control-label col-sm-
ArrayList(); 1\">Nama</label>\n" +
try { " <div
class=\"col-sm-2\">\n" +
Class.forName("com.mysql.jdbc "
.Driver"); <input type=\"text\"
class=\"form-control\" " <input
name=\"nama\" type=\"text\" class=\"form-
value=\""+rst.getString("nama control\" name=\"alamat\"
")+"\">\n" + value=\""+rst.getString("alam
" at")+"\">\n" +
</div>\n" + "
" </div>\n" + </div>\n" +
" \n" + " </div>");
" <div }
class=\"form-group\">\n" + } catch (Exception
" <label ex) {
class=\"control-label col-sm-
1\">Jurusan</label>\n" + System.out.println(ex.getMess
" <div age());
class=\"col-sm-2\">\n" + }
" <input return mahasiswa;
type=\"text\" class=\"form- }
control\" name=\"jurusan\" /*Selesai Get Mahasiswa*/
value=\""+rst.getString("juru
san")+"\">\n" + /*Selesai Tambah
" Mahasiswa*/
</div>\n" + @WebMethod(operationName
" </div>\n" + = "addMahasiswa")
" \n" + public void addDosen(
" <div @WebParam(name =
class=\"form-group\">\n" + "nim") int nim,
" <label @WebParam(name =
class=\"control-label col-sm- "nama") String nama,
1\">Email</label>\n" + @WebParam(name =
" <div "jurusan") String jurusan,
class=\"col-sm-2\">\n" + @WebParam(name =
" <input "email") String email,
type=\"text\" class=\"form- @WebParam(name =
control\" name=\"email\" "alamat") String alamat
value=\""+rst.getString("emai ) {
l")+"\">\n" + try {
" con =
</div>\n" + kon.getCon();
" </div>\n" + ps =
" \n" + con.prepareStatement("insert
" <div into mahasiswa value
class=\"form-group\">\n" + (?,?,?,?,?)");
" <label ps.setInt(1,
class=\"control-label col-sm- nim);
1\">Alamat</label>\n" + ps.setString(2,
" <div nama);
class=\"col-sm-2\">\n" +
 ps.setString(3, @WebMethod(operationName
jurusan); = "editMahasiswa")
ps.setString(4, public void
email); editMahasiswa(
ps.setString(5, @WebParam(name =
alamat); "nim") int nim,
@WebParam(name =
ps.executeUpdate(); "nama") String nama,
} catch (Exception @WebParam(name =
ex) { "jurusan") String jurusan,
@WebParam(name =
System.out.println(ex.getMess "email") String email,
age()); @WebParam(name =
} "alamat") String alamat){
} try {
/*Selesai Tambah con =
Mahasiswa*/ kon.getCon();
ps =
/*Hapus Mahasiswa*/ con.prepareStatement("update
@WebMethod(operationName mahasiswa set
= "delMahasiswa") nama=?,jurusan=?,email=?,alam
public void delMahasiswa( at=? where nim=?");
@WebParam(name =
"nim") int nim) { ps.setString(1,
try { nama);
con = ps.setString(2,
kon.getCon(); jurusan);
ps = ps.setString(3,
con.prepareStatement("delete email);
from mahasiswa where nim = ps.setString(4,
?"); alamat);
ps.setInt(1, ps.setInt(5,
nim); nim);

ps.executeUpdate(); ps.executeUpdate();
} catch (Exception e) } catch (Exception e)
{ {

System.out.println("Failed to System.out.println("Failed to
remove student because " + edit student because " +
e.toString()); e.toString());
} }
} }
/*Selesai Hapus /*Selesai Edit
Mahasiswa*/ Mahasiswa*/

/*Edit Mahasiswa*/
 @WebMethod(operationName rs.getString("nama") +
= "tampilMahasiswa") "</td><td>" +
public List rs.getString("jurusan") +
tampilMahasiswa() { "</td><td>" +
List daftar = new rs.getString("email") +
ArrayList(); "</td><td>" +
rs.getString("alamat") +
String sql_daftar = "</td><td><a href=\"edit-
"select * from mahasiswa"; mhs.jsp?nim=" +
rs.getInt("nim") + "\"><span
try { class=\"glyphicon glyphicon-
edit\"></span></a><br><a
Class.forName("com.mysql.jdbc href=\"hapus-mhs.jsp?nim=" +
.Driver"); rs.getInt("nim") + "\"><span
Connection con = class=\"glyphicon glyphicon-
DriverManager.getConnection(" remove\"></span></a></td><tr>
jdbc:mysql://localhost:3306/s </tr>");
iakad", "root", ""); }
Statement stmt = con.close();
con.createStatement(); } catch (Exception
ResultSet rs = ex) {
stmt.executeQuery(sql_daftar)
; System.out.println(ex.getMess
while (rs.next()) age());
{ }
return daftar;
daftar.add("<td>" + }
rs.getInt("nim") +
"</td><td>" + }

Source Code edit-mhs.jsp

<%@include file="header.jsp" %>
<div class="container">
<h3>Form Edit Mahasiswa</h3>
<form class="form-horizontal" method="post"
action="proses-edit-mhs.jsp">
<%
try {
siakad.mahasiswa.Mahasiswa_Service service = new
siakad.mahasiswa.Mahasiswa_Service();
siakad.mahasiswa.Mahasiswa port =
service.getMahasiswaPort();

int nim = Integer.valueOf(request.getParameter("nim"));

 java.util.List<java.lang.Object> result =
port.getMahasiswa(nim);
for (int i = 0; i < result.size(); i++) {
out.println(result.get(i));
}
} catch (Exception ex) {

}
%>
<button type="submit" class="btn btn-
danger">Edit</button>

</form>

</div>
<%@include file="footer.jsp" %>

Source Code footer.jsp

<script src="https://code.jquery.com/jquery.js"></script>
<script src="js/bootstrap.min.js"></script>
</body>
</html>

Source Code hapus-mhs.jsp

<%
try {
siakad.mahasiswa.Mahasiswa_Service service = new
siakad.mahasiswa.Mahasiswa_Service();
siakad.mahasiswa.Mahasiswa port =
service.getMahasiswaPort();

int nim = Integer.valueOf(request.getParameter("nim"));

port.delMahasiswa(nim);
response.sendRedirect("index.jsp");
} catch (Exception ex) {

}
%>

Source Code header.jsp

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=UTF-8">
<title>Siakad Mahasiswa</title>
 <meta name="viewport" content="width=device-width,
initial-scale=1.0">
<!-- Bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet"/>
</head>
<body>
<!--Kode Navbar-->
<nav class="navbar navbar-default">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better
mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle
collapsed" data-toggle="collapse" data-target="#bs-example-
navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Siakad
Kampus</a>
</div>

<!-- Collect the nav links, forms, and other

content for toggling -->
<div class="collapse navbar-collapse" id="bs-
example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li class="active"><a
href="index.jsp">Home<span class="sr-
only">(current)</span></a></li>
<li><a href="#">Profil</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-
toggle="dropdown" role="button" aria-haspopup="true" aria-
expanded="false">Menu<span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="index.jsp">Daftar
Mahasiswa</a></li>
<li><a href="tambah-mhs.jsp">Tambah
Mahasiswa</a></li>
<li><a href="edit-mhs.jsp">Edit
Mahasiswa</a></li>
<li><a href="hapus-mhs.jsp">Hapus
Mahasiswa</a></li>
<li role="separator" class="divider"></li>
 <li><a href="#">Separated link</a></li>
<li role="separator" class="divider"></li>
<li><a href="#">One more separated
link</a></li>
</ul>
</li>
</ul>
<form class="navbar-form navbar-left">
<div class="form-group">
<input type="text" class="form-control"
placeholder="Search">
</div>
<button type="submit" class="btn btn-
default">Submit</button>
</form>
<ul class="nav navbar-nav navbar-right">
<li><a href="#">Link</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-
toggle="dropdown" role="button" aria-haspopup="true" aria-
expanded="false">Dropdown <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else
here</a></li>
<li role="separator" class="divider"></li>
<li><a href="#">Separated link</a></li>
</ul>
</li>
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
<!--Akhir Navbar-->

Source Code index.jsp

<%@include file="header.jsp" %>
<div class="container">
<h3>Daftar Mahasiswa</h3>
<a href="tambah-mhs.jsp"><button class="btn-success">Tambah
Mahasiswa</button></a>
<table class="table table-bordered">
<thead>
<tr>
<th>NIM</th>
<th>Nama</th>
 <th>Jurusan</th>
<th>Email</th>
<th>Alamat</th>
<th>Aksi</th>
</tr>
</thead>
<tbody>
<tr>

<%
try {
siakad.mahasiswa.Mahasiswa_Service service =
new siakad.mahasiswa.Mahasiswa_Service();
siakad.mahasiswa.Mahasiswa port =
service.getMahasiswaPort();

java.util.List<java.lang.Object> resultMhs =
port.tampilMahasiswa();
for (int i = 0; i < resultMhs.size(); i++) {
out.println(resultMhs.get(i));
}
} catch (Exception ex) {

}
%>

</tr>
</tbody>
</table>
</div>
<%@include file="footer.jsp" %>

Source Code proses-edit-mhs.jsp

<%
try {
siakad.mahasiswa.Mahasiswa_Service service = new
siakad.mahasiswa.Mahasiswa_Service();
siakad.mahasiswa.Mahasiswa port =
service.getMahasiswaPort();

int nim = Integer.valueOf(request.getParameter("nim"));

java.lang.String nama = request.getParameter("nama");;
java.lang.String jurusan =
request.getParameter("jurusan");;
java.lang.String email = request.getParameter("email");;
java.lang.String alamat = request.getParameter("alamat");;
port.editMahasiswa(nim, nama, jurusan, email, alamat);
 response.sendRedirect("index.jsp");
} catch (Exception ex) {

}
%>

Source Code proses-tambah-mhs.jsp

<%
try {
siakad.mahasiswa.Mahasiswa_Service service = new
siakad.mahasiswa.Mahasiswa_Service();
siakad.mahasiswa.Mahasiswa port =
service.getMahasiswaPort();

int nim = Integer.valueOf(request.getParameter("nim"));

java.lang.String nama = request.getParameter("nama");
java.lang.String jurusan =
request.getParameter("jurusan");
java.lang.String email = request.getParameter("email");
java.lang.String alamat =
request.getParameter("alamat");

port.addMahasiswa(nim, nama, jurusan, email, alamat);

response.sendRedirect("index.jsp");
} catch (Exception ex) {

}
%>

Source Code tambah-mhs.jsp

<%@include file="header.jsp" %>
<div class="container">
<h3>Form Tambah Mahasiswa</h3>
<form class="form-horizontal" method="post"
action="proses-tambah-mhs.jsp">
<div class="form-group">
<label class="control-label col-sm-1">NIM</label>
<div class="col-sm-2">
<input type="text" class="form-
control" name="nim">
</div>
</div>

<div class="form-group">
<label class="control-label col-sm-
1">Nama</label>
<div class="col-sm-2">
 <input type="text" class="form-
control" name="nama">
</div>
</div>

<div class="form-group">
<label class="control-label col-sm-
1">Jurusan</label>
<div class="col-sm-2">
<input type="text" class="form-control"
name="jurusan">
</div>
</div>

<div class="form-group">
<label class="control-label col-sm-
1">Email</label>
<div class="col-sm-2">
<input type="text" class="form-control"
name="email">
</div>
</div>

<div class="form-group">
<label class="control-label col-sm-
1">Alamat</label>
<div class="col-sm-2">
<input type="text" class="form-control"
name="alamat">
</div>
</div>
<button type="submit" class="btn btn-
danger">Simpan</button>
</form>

</div>
<%@include file="footer.jsp" %>