Membuat Buku Tamu dengan JSP

Pada kesmpatan ini saya memposting  tentang membuat buku tamu dengan menggunakan JSP dan database MySQL.

1. Install Netbeans dengan fitur lengkap di laptop anda

2. Install Apache Tomcat, jika netbeans yang anda pakai lengkap, anda tidak perlu mengisntall Apache tomcat karena sudah tersedi di dalamnya.

3. Instal PHPMyAdmin untuk penyimpanan databasenya.

4. Membuat database baru dengan nama bukutamu.

5. Membuat tabel untuk buku tamu, disini saya hanya mengunakan 1 tabel saja untuk data tamu.

6. Buatlah file yang berekstensi .jsp di netbeans anda. kemudian kita mulai mengetikkan coding untuk membuat bentuk /form buku tamu dan insert data ke dalam database.

gambar2gambar3

buku_tamu.jsp  :

<%–
Document : index
Created on : Dec 8, 2013, 11:08:48 AM
Author : WAHYOE
–%>

<%@page contentType=”text/html” pageEncoding=”UTF-8″%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″>
<title>Form Buku Tamu</title>
</head>
<form name=”form1″ method=”post” action=”bukutamu_proses.jsp”>
<table width=”499″ align=”center” border=”0″>
<tr>
<td colspan=”4″ bgcolor=”#ffcc66″><strong>Form Buku Tamu</strong></td>
</tr>
<tr>
<td width=”55″>Nama</td>
<td width=”386″><input name=”nama” type=”text” size=”30″></td>
</tr>
<tr>
<td valign=”top”>Email</td>
<td width=”386″><input name=”email” type=”text”/></td>
</tr>
<tr>
<td valign=”top”>Web</td>
<td width=”386″><input name=”web” type=”text”></td>
</tr>
<tr>
<td valign=”top”>Isi</td>
<td width=”386″><textarea name=”komentar” rows=”5″ style=”width: 90%”></textarea></td>
</tr>
<tr>
<td colspan=”2″><div align=”center”>
<input type=”submit” name=”submit” value=”Simpan”/>
<input type=”reset” name=”submit1″ value=”Reset”/>
</div>
</td>
</tr>
</table>
</form>

</html>

 

bukutamu_proses.jsp :

<%–
Document : updatbukutamu
Created on : Dec 8, 2013, 11:08:48 AM
Author : WAHYOE
–%>

<%@page contentType=”text/html” pageEncoding=”UTF-8″%>
<!DOCTYPE html>
<%@include file=”koneksi.jsp”%>
<%
String nama=request.getParameter(“nama”);
String email=request.getParameter(“email”);
String web=request.getParameter(“web”);
String komentar=request.getParameter(“komentar”);
if(request.getParameter(“submit”).equals(“Simpan”)){
if(nama!=””&&email!=null){
String sql=”insert into buku_tamu (nama,email,web,komentar) values(‘”+nama+”‘,'”+email+”‘,'”+web+”‘,'”+komentar+”‘);”;
statement=connection.createStatement();
statement.executeUpdate(sql);
if(statement!=null){
response.sendRedirect(“data_bukutamu.jsp”);
}
}else{
out.println(“semua data harus anda isi”);
out.println(“<a href=’buku_tamu.jsp’>Kembali</a>”);
}
}else{
response.sendRedirect(“data_bukutamu.jsp”);
}

%>

 

data_bukutamu.jsp :

<%–
Document : data_bukutamu
Created on : Dec 8, 2013, 11:08:48 AM
Author : WAHYOE
–%>
<%@page import=”java.sql.*” %>
<%@page import=”com.mysql.jdbc.Driver.*” %>

<%@page contentType=”text/html” pageEncoding=”UTF-8″%>
<!DOCTYPE html>

<html>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″>
<title>Data Buku Tamu</title>
</head>
<%@include file=”koneksi.jsp”%>
<table width=”522″ align =”center”>
<tr>
<td colspan=”4″ bgcolor=”#ffcc66″><strong>Data Buku Tamu</strong></td>
</tr>
<tr>
<td width=”75″><b>Nama</b></td>
<td width=”75″><b>Email</b></td>
<td width=”174″><b>Web</b></td>
<td width=”86″>&nsbp</td>
</tr>
<%

statement=connection.createStatement();
theResult=statement.executeQuery(“select * from buku_tamu”);
while(theResult.next()){
String kode=theResult.getString(“kode”);
String nama=theResult.getString(“nama”);
String email=theResult.getString(“email”);
String web=theResult.getString(“web”);
%>
<tr>
<td><%=nama%></td>
<td><%=email%></td>
<td><%=web%></td>
<td><a href=”formedit_bukutamu.jsp?kode=<%=kode%>”>Edit </a> |<a href=”hapusbukutamu.jsp?kode=<%=kode%>”>Hapus</a></td>
</tr>
<%
}
%>
</table>
<p align=”center”><a href=”buku_tamu.jsp”>Tambah</a></p>
</html>

 

formedit_bukutamu.jsp :

<%–
Document : formedit_bukutamu
Created on : Dec 8, 2013, 11:08:48 AM
Author : WAHYOE
–%>

<%@page import=”com.mysql.jdbc.Statement.*”%>
<%@page import=”java.sql.DriverManager.*”%>
<%@page contentType=”text/html” pageEncoding=”UTF-8″%>
<!DOCTYPE html>
<html>
<head>
<title>Form Edit Buku Tamu</title>
</head>
<%@include file=”koneksi.jsp”%>
<%
String nama=””;
String email=””;
String web=””;
String komentar=””;
String kode=request.getParameter(“kode”);
statement=connection.createStatement();
theResult=statement.executeQuery(“select * from buku_tamu where kode='”+kode+”‘”);
if(theResult.next()){
nama=theResult.getString(“nama”);
email=theResult.getString(“email”);
web=theResult.getString(“web”);
komentar=theResult.getString(“komentar”);
}
%>
<form name=”form1″ method=”post” action=”updatebukutamu.jsp”>
<table width=”449″ border=”0″ align=”center”>
<tr>
<td colspan=”2″ bgcolor=”#ffcc33″><strong>Form Edit Buku Tamu</strong></td>
</tr>
<tr>
<td width=”55″>Nama</td>
<td width=”386″><input name=”nama” type=”text” size=”30″ value=”<%=nama%>”>
<input type=”hidden” name=”kode” value=”<%=kode%>”/></td>
</tr>
<tr>
<td valign=”top”>Email</td>
<td><input type=”text” name=”email” value=”<%=email%>”/></td>
</tr>
<tr>
<td valign=”top”>Web</td>
<td><input type=”text” name=”web” value=”<%=web%>”/></td>
</tr>
<tr>
<td valign=”top”>Komentar</td>
<td><textarea name=”komentar” rows=”5″><%=komentar%></textarea></td>
</tr>
<tr>
<td colspan=”2″><div align=”center”>
<input type=”submit” name=”submit” value=”Update”/>
<input type=”reset” name=”submit2″ value=”Cancel”/>
</div></td>
</tr>
</table>
</form>
</html>

 

hapusbukutamu.jsp :

<%–
Document : hapusbukutamu
Created on : Dec 8, 2013, 11:08:48 AM
Author : WAHYOE
–%>
<%@page contentType=”text/html” pageEncoding=”UTF-8″%>

<!DOCTYPE html>

<html>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″>
<title>Aksi Hapus</title>
</head>
<%@include file=”koneksi.jsp” %>
<%
String kode=request.getParameter(“kode”);
statement=connection.createStatement();
String sql=”delete from buku_tamu where kode ='”+kode+”‘”;
statement.executeUpdate(sql);
response.sendRedirect(“data_bukutamu.jsp”);
%>
</html>

 

koneksi.jsp :

 

<%–
Document : koneksi
Created on : Dec 8, 2013, 5:02:53 AM
Author : WAHYOE
–%>

<%@page contentType=”text/html” pageEncoding=”UTF-8″%>
<!DOCTYPE html>
<%@page import=”java.sql.*” %>
<html>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″>
<title>Koneksi database</title>
</head>
<%
ResultSet theResult;
Statement statement;
Connection connection;
%>
<%
connection=null;
try{
String url=”jdbc:mysql://localhost/cms”;
String username=”root”;
String password=””;
Class.forName(“com.mysql.jdbc.Driver”);
connection=DriverManager.getConnection(url,username,password);
}catch(Exception e){
System.err.println(“tidak berhasil koneksi”);
System.exit(1);
}
%>

</html>

 

updatebukutamu.jsp :

<%–
Document : updatbukutamu
Created on : Dec 8, 2013, 11:08:48 AM
Author : WAHYOE
–%>

<%@page contentType=”text/html” pageEncoding=”UTF-8″%>
<!DOCTYPE html>
<%@include file=”koneksi.jsp”%>
<%
String kode=request.getParameter(“kode”);
String nama=request.getParameter(“nama”);
String email=request.getParameter(“email”);
String web=request.getParameter(“web”);
String komentar=request.getParameter(“komentar”);
if(request.getParameter(“submit”).equals(“Update”)){
if(nama!=””&&email!=null){
String sql=”update buku_tamu set nama='”+nama+”‘,email='”+email+”‘,web='”+web+”‘,komentar='”+komentar+”‘ where kode='”+kode+”‘”;
statement=connection.createStatement();
statement.executeUpdate(sql);
if(statement!=null){
response.sendRedirect(“data_bukutamu.jsp”);
}
}else{
out.println(“semua data harus anda isi”);
out.println(“<a href=’buku_tamu.jsp’>Kembali</a>”);
}
}else{
response.sendRedirect(“data_bukutamu.jsp”);
}

%>

 

Tinggalkan Balasan

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout / Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout / Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout / Ubah )

Foto Google+

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s