이제 프로그램을 이용해서 jsp 쿼리를 날려서 등록, 수정, 삭제를 해보겠습니다.
먼저 bbs_list.jsp를 수정을 하겠습니다.
그리고 디비 연결 하는 부분을 db_common.jsp 에 담아서 jsp include 를 사용해서 공통으로 관리를 하겠습니다.
import 하는 부분을 지우고 include로 db_common.jsp 를 가져 옵니다.
그리고 수정을 위해 modify_page 를 추가를 해줍니다
- db_common.jsp 소스
<%@page import="java.sql.DriverManager"%>
<%@page import="java.sql.Connection"%>
<%@page import="java.sql.ResultSet"%>
<%@page import="java.sql.Statement"%>
<%@page import="java.sql.PreparedStatement"%>
<%@page import="java.sql.SQLException"%>
<%
String driver = "org.mariadb.jdbc.Driver";
String connectionUrl = "jdbc:mariadb://localhost:3306/";
String database = "test"; // 데이터베이스 이름
String DBuserid = "root"; // 아이디
String DBpassword = "root"; // 비밀번호
// 마리아 디비 드라이버가 정상적으로 연결이 되었는지 확인
try {
Class.forName(driver);
} catch (ClassNotFoundException e) {
e.printStackTrace();
}
// 디비 연결을 위한 변수 선언
Connection connection = null;
Statement statement = null; // 조회시 사용
PreparedStatement pstmt = null; // 등록 수정 삭제시 사용
ResultSet resultSet = null;
String strMsg = ""; // 에런 내용을 담을 변수
connection = DriverManager.getConnection(connectionUrl+database, DBuserid, DBpassword);
%>
- bbs_list.jsp 소스
<%@page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/db_common.jsp" %>
<!DOCTYPE html>
<html>
<head>
<title>JSP 게시판 리스트</title>
<script>
function add_page() {
location.href = "/bbs_add_page.jsp";
}
function modify_page(value, value1) {
var param = "?key=" + value + "&col2=" + value1;
location.href = "/bbs_add_page.jsp" + param;
}
</script>
</head>
<body>
<h1>JSP 게시판 리스트</h1>
<table width="50%" border="1">
<tr align="center" style="background-color: #ececec;">
<td>
컬럼1
</td>
<td>
컬럼2
</td>
</tr>
<%
try {
statement=connection.createStatement(); // 데이터 베이스 연결
String sql ="select * from test"; // 쿼리문 작성
resultSet = statement.executeQuery(sql); // 쿼리문 적용
while(resultSet.next()){ // 해당 건수 만큼 데이터를 loop 돌린다.
%>
<tr onClick="modify_page('<%=resultSet.getString("column1")%>', '<%=resultSet.getString("column2")%>')">
<td>
<%=resultSet.getString("column1")%>
</td>
<td>
<%=resultSet.getString("column2")%>
</td>
</tr>
<%
}
} catch (Exception e) {
// 비정상적으로 종료되어서 에러가 난 경우.
e.printStackTrace();
strMsg = e.getMessage();
%>
<script type="text/javascript">console.log("SQLException = " + <%=strMsg%>); </script>
<%
}
%>
</table>
<div style="width:50%;margin-top: 30px;text-align:right;">
<button onClick="add_page()">등록 페이지</button>
</div>
</body>
</html>
이렇게 공통으로 디비 커넥션을 만들고 리스트 페이지에서 인클루드로 가지고 옵니다.
이제 등록, 수정, 삭제를 하는 bbs_process.jsp 페이지를 만들겠습니다.
request.getParameter로 넘어오는 파라미터를 받아 줍니다.
파라미터의 null 값 및 공백 처리는 자바스크립트에서 해도 됩니다.
jsp에서는 위와 같이 해주면 파라미터가 null 또는 공백이면 경고창을 띄워 줍니다.
proc_gbn 으로 등록(I), 수정(U), 삭제(D)를 구분을 해서 쿼리문을 작성 하고 커넥션에 쿼리를 담고 파라미터를 처리해
줍니다.
마지막으로 쿼리문을 실행을 해주고 sendRedirect로 리스트 페이지로 이동을 합니다.
sendRedirect 를 이용하면 jsp 에서 원하는 페이지로 이동이 가능 합니다.
- bbs_process.jsp 소스
<%@page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/db_common.jsp" %>
<%
String err_msg = ""; // 에러 메시지를 담을 변수
try {
String proc_gbn = request.getParameter("proc_gbn");
String query = "";
String col_1 = request.getParameter("column1");
String col_2 = request.getParameter("column2");
if(proc_gbn == null || proc_gbn.equals("")) {
out.println("<script>");
out.println("alert('프로세스 구분 코드(proc_gbn)이 입력 되지 않았습니다.');");
out.println("</script>");
}
if(col_1 == null || col_1.equals("")) {
out.println("<script>");
out.println("alert('프로세스 컬럼1(col_1)이 입력 되지 않았습니다.');");
out.println("</script>");
}
if(col_2 == null || col_2.equals("")) {
out.println("<script>");
out.println("alert('프로세스 컬럼2(col_2)이 입력 되지 않았습니다.');");
out.println("</script>");
}
if(proc_gbn.equals("I")) {
query = "INSERT INTO TEST (COLUMN1, COLUMN2) VALUES (?, ?)";
pstmt = connection.prepareStatement(query);
pstmt.setString(1, col_1);
pstmt.setString(2, col_2);
} else if(proc_gbn.equals("U")) {
query = "UPDATE TEST SET COLUMN1 = ?, COLUMN2 = ? WHERE COLUMN1 = ? ";
pstmt = connection.prepareStatement(query);
pstmt.setString(1, col_1);
pstmt.setString(2, col_2);
pstmt.setString(3, col_1);
} else if(proc_gbn.equals("D")) {
query = "DELETE FROM TEST WHERE COLUMN1 = ? ";
pstmt = connection.prepareStatement(query);
pstmt.setString(1, col_1);
}
pstmt.executeUpdate(); //쿼리문 실행
response.sendRedirect("/bbs_list.jsp"); // 게시판 리스트 페이지로 이동
} catch (Exception e) {
e.printStackTrace();
err_msg = e.getMessage();
}
%>
이제 마지막으로 bbs_add_page.jsp 를 수정 합니다.
하단에 등록과 수정,삭제를 구분 해서 버튼을 만들어 줍니다.
key 파라미터가 없으면 등록 이고 있다면 수정과 삭제를 해야 합니다.
그리고 등록 수정 삭제를 위한 스크립트를 추가해 줍니다.
proc_gbn에 등록(I), 수정(U), 삭제(D)를 위한 값을 넣어 줍니다.
그리고 column1의 값이 없으면 경고창을 보여주고 프로세스를 return;을 해서 멈추어 줍니다.
- bbs_add_page.jsp 소스
<%@page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<title>JSP 게시판 등록 페이지</title>
<script>
function insert() {
var frm = document.add_frm;
frm.proc_gbn.value = "I";
if(frm.column1.value == "") {
alert("컬럼1을 입력해 주세요.");
return;
}
if(frm.column2.value == "") {
alert("컬럼2을 입력해 주세요.");
return;
}
frm.method = "post";
frm.action = "/bbs_process.jsp";
frm.submit();
}
function update() {
var frm = document.add_frm;
frm.proc_gbn.value = "U";
if(frm.column1.value == "") {
alert("컬럼1을 입력해 주세요.");
return;
}
if(frm.column2.value == "") {
alert("컬럼2을 입력해 주세요.");
return;
}
frm.method = "post";
frm.action = "/bbs_process.jsp";
frm.submit();
}
function remove() {
var frm = document.add_frm;
frm.proc_gbn.value = "D";
if(frm.column1.value == "") {
alert("컬럼1을 입력해 주세요.");
return;
}
frm.method = "post";
frm.action = "/bbs_process.jsp";
frm.submit();
}
</script>
</head>
<body>
<h1>JSP 게시판 등록 페이지</h1>
<form name="add_frm" id="add_frm">
<!-- 등록 : I, 수정 : U, 삭제 : D -->
<input type="hidden" name="proc_gbn" id="proc_gbn" />
<table width="50%" border="1">
<tr>
<td align="center" style="background-color: #ececec;">
컬럼1
</td>
<td>
<input type="text" name="column1" id="column1" style="width:98%;"
value="<%=request.getParameter("key")%>" />
</td>
</tr>
<tr>
<td align="center" style="background-color: #ececec;">
컬럼2
</td>
<td>
<input type="text" name="column2" id="column2" style="width:98%;"
value="<%=request.getParameter("col2")%>" />
</td>
</tr>
</table>
</form>
<div style="width:50%;margin-top: 30px;text-align:right;">
<%
if(request.getParameter("key") == null) {
%>
<button onClick="insert()">등록</button>
<%
} else {
%>
<button onClick="update()">수정</button>
<button onClick="remove()">삭제</button>
<%
}
%>
</div>
</body>
</html>
이렇게 jsp 게시판에서 리스트, 등록, 수정, 삭제를 디비를 연동해서 하는걸 완료 하였습니다.
따라오는냐고 수고 하셨습니다.
다음 게시글 에서는 jsp의 명령어를 정리해서 올리 겠습니다.
'IT, 인터넷 > JSP' 카테고리의 다른 글
jsp 를 알아보자 (7) - 자주 쓰는 명령어 (0) | 2021.09.30 |
---|---|
jsp 를 알아보자 (5) - 게시판 등록 페이지 만들기 (0) | 2021.09.29 |
jsp 를 알아보자 (4) - 게시판 리스트 만들기 (0) | 2021.09.28 |
jsp 를 알아보자 (3) - 게시판 만들기 (0) | 2021.09.28 |
jsp 를 알아보자 (2) - 개발환경 (0) | 2021.09.28 |