-
Form을 활용해서 정보를 DB와 연결하기JAVA/웹 프로그래밍 - JSP 2020. 11. 5. 18:26
현재 프로젝트의 하위 폴더인 WebContent 폴더의 하위에 폴더 하나를 만들자.
폴더명은 message라고 하자.
이 폴더 명에 jsp파일들을 생성할 것이다.
DB는 오라클을 이용한다.
DB에서 우리가 자바 콘솔 창에서 정보를 입력,수정,삭제,출력을 해보았다.
여기서는 자바 콘솔 창에서 했던 것을 그대로 jsp에서 하면 된다.
즉, 웹 페이지에서 입력을 받아서 jsp가 이를 가지고 DB에 접근하는 것이다.
form ------> jsp ------> DB
html java 오라클입력 받을 데이터는 번호(정수), 이름(문자열), 메모(문자열) 이다.
이는 DB에서 작업한 message 테이블의 필드들이다.
자바 창에서 다음과 같은 메뉴에서 'Database Development' 를 선택한다.
그리고 Data Source Explorer 탭을 선택한다.
Data Source Explorer 탭이 보이지 않으면, Window 탭 -> Show View -> Data Source Explorer를 선택한다.
그러면 위와 같은 모습이 나온다.
이 데이터베이스에서 HR-oracle(이 DB에 message 테이블이 있음)을 선택하고 우클릭해서 Connnect를 선택한다.
위와 같이 무언가가 뜬다.
그리고 다시 HR-oracle을 선택하고 우 클릭해서 Open SQL Scrapbook을 선택한다.
위와 같은 내용이 나오는데, 자신이 쓰는 DB를 선택하면 된다.
그리고
테이블이 있는지 확인해보자. 명령어는 다음과 같다.
select * from message;
위의 문장을 SQL Scrapbook에 적고 세미콜론까지 드래그를 한 다음에 우클릭해서
Execute Selected Text 를 선택한 후에
아래의 Result1의 창에서 테이블에 있는 정보들을 볼 수 있다.
그리고 아래의 perspective 탭에서 java를 선택해서 자바 창으로 넘어오자.
그리고 중요한 작업이 하나 있다.
오라클을 설치 했을 시에 ojdbc6.jar 파일의 위치를 찾도록 한다.
찾았으면(반드시 있어야 함) 이 파일을 선택하고 CTRL + C 를 눌러 복사를 하고
다시 자바 창으로 와서 현재의 프로젝트 폴더의 하위 폴더의 WebContent의 하위 폴더인 WEB-INF의 하위 폴더인
lib 폴더를 클릭하고나서 CTRL + V를 해서 복사 붙여넣기를 하자.
위의 파일을 선택하고 복사한다. 그리고 lib 폴더를 선택하고 붙여넣자.
그러면 위의 그림과 같이 ojdbc6.jar 파일이 추가된다.
그리고 DB와의 접속이 제대로 이뤄지는지 확인을 해야 한다.
기본적인 form은 아래에서 했던 것을 가지고 와서 약간의 수정 작업을 했다.
귀찮으면 복사해서 쓰자.
designatedroom87.tistory.com/289?category=901206
로그인 페이지 만들어 보기
로그인 페이지를 html을 활용해서 만들 수 있다. 그런데 디자인이나 이런 것에 자신이 없는 경우에 가지고 와서 쓰는 것도 한 가지 방법이 된다. w3schools.com에 접속해서 reference로 가서 Bootstrap4 Refer
designatedroom87.tistory.com
messageForm.jsp를 만들자.
messageForm.jsp
더보기<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script> <title>Insert title here</title> </head> <body> <div class="container"> <h2>메시지 입력</h2> <form action=messageForm_proc.jsp method=post> <div class="form-group"> <label for="no">번호:</label> <input type="text" class="form-control" id="no" name="no" placeholder="번호를 입력하세요"> </div> <div class="form-group"> <label for="name">이름:</label> <input type="text" class="form-control" id="name" name="name" placeholder="이름을 입력하세요"> </div> <div class="form-group"> <label for="content">메모:</label> <input type="text" class="form-control" id="content" name="content" placeholder="메모를 입력하세요"> </div> <button type="submit" class="btn btn-default">입력</button> </form> </div> </body> </html>DB에 접속이 성공인지 아닌지 확인을 해보자.
messageForm_proc.jsp
더보기<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@ page import="java.io.*"%> <!-- 임포트 필요 --> <%@ page import="java.sql.*"%> <!-- Connection 클래스를 쓰려면 임포트 필요 --> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> </head> <body> <% try { int no = Integer.parseInt(request.getParameter("no")); String name = request.getParameter("name"); String content = request.getParameter("content"); // 디버깅 용 System.out.println(no); System.out.println(name); System.out.println(content); // 오라클에 접속하기 위해서는 드라이버를 로드해야 한다. Class.forName("oracle.jdbc.driver.OracleDriver"); Connection conn = DriverManager.getConnection( "jdbc:oracle:thin:@localhost:1521:xe", "HR", "1234"); if (conn == null) {System.out.println("DB접속에 실패");} else {System.out.println("DB접속 성공");} } catch(Exception e){} finally{} %> </body> </html>messageForm.jsp를 실행해서 DB에 접속할 수 있는지 보자.
자바의 콘솔 창에 결과가 뜰 것이다.
위와 같이 DB에 접속할 수 있으므로 계속 진행해보자.
지금부터 진행할 내용들은 아래의 MessageService.java 부분을 거의 그대로 가지고 와서 구현할 것이다.
아래에서 진행할 내용은 SQL 구문의 select, delete, update, insert 이다.
designatedroom87.tistory.com/227?category=897688
SQL 문을 하나로 통합해서 DB에 연결하기
우리는 앞에서 SQL의 구문을 살펴보았다. designatedroom87.tistory.com/205?category=897688 SQL의 Select구문을 이용하기 SQL Scrapbook에서 오라클의 HR 데이터베이스에 하나의 테이블을 만들어서 데이터를 추..
designatedroom87.tistory.com
위에서 DB에 접속이 가능한 것을 보았으니, 폼에서 넘어온 입력 데이터를 message 테이블에 저장해보자.
그리고 나서, list.jsp를 만들어서 이 list.jsp는 message 테이블에 있는 모든 데이터들을 출력하도록 만들어보자.
messageForm_proc.jsp
더보기<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@ page import="java.io.*"%> <!-- 임포트 필요 --> <%@ page import="java.sql.*"%> <!-- Connection 클래스를 쓰려면 임포트 필요 --> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> </head> <body> <% try { int no = Integer.parseInt(request.getParameter("no")); String name = request.getParameter("name"); String content = request.getParameter("content"); // 디버깅 용 System.out.println(no); System.out.println(name); System.out.println(content); // 오라클에 접속하기 위해서는 드라이버를 로드해야 한다. Class.forName("oracle.jdbc.driver.OracleDriver"); Connection conn = DriverManager.getConnection( "jdbc:oracle:thin:@localhost:1521:xe", "HR", "1234"); if (conn == null) {System.out.println("DB접속에 실패");} else {System.out.println("DB접속 성공");} String sql = "insert into message(no,name,content) values(?,?,?)"; PreparedStatement pstmt = conn.prepareStatement(sql); // ?(물음표)룔 채워줘야 함. pstmt.setInt(1, no); // 번호 pstmt.setNString(2, name); // 이름 pstmt.setNString(3, content); // 메시지 int result = pstmt.executeUpdate(); System.out.println(result +"개가 입력되었습니다."); pstmt.close(); conn.close(); response.sendRedirect("list.jsp"); } catch(Exception e){} finally{} %> </body> </html>list.jsp는 message 테이블에 있는 모든 데이터들을 출력한다.
SQL구문에서 select 기능을 한다.
list.jsp
더보기<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@ page import="java.io.*"%> <!-- 임포트 필요 --> <%@ page import="java.sql.*"%> <!-- Connection 클래스를 쓰려면 임포트 필요 --> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Message list</title> </head> <body> <table border=1 width=50%> <tr> <th>번호</th><th>이름</th><th>메시지</th> </tr> <% try{ Class.forName("oracle.jdbc.driver.OracleDriver"); Connection conn = DriverManager.getConnection( "jdbc:oracle:thin:@localhost:1521:xe", "HR", "1234"); if (conn == null) {System.out.println("DB접속에 실패");} else {System.out.println("DB접속 성공");} String sql = "select * from message"; PreparedStatement pstmt = conn.prepareStatement(sql); ResultSet rs = pstmt.executeQuery(); while (rs.next()) { %> <tr> <td><%=rs.getInt("no") %></td><td><%=rs.getNString("name") %></td><td><%=rs.getNString("content") %></td> </tr> <%}// while문 end rs.close(); pstmt.close(); conn.close(); } // try end catch(Exception e){} finally{} %> </table> </body> </html>messageForm.jsp를 실행해서 데이터들을 입력해보자.
입력 전
입력 후
그리고, list.jsp 파일을 실행해도 테이블에 저장되어 있는 데이터들을 출력할 수 있다.
SQL구문에 update(수정)과 delete(삭제)가 있다.
이에 대해 진행 하기에 앞서 수정과 삭제는 모두 검색이 필요하다.
검색 조건에 where 조건이 있어야 한다.
printSearch.jsp에서 검색 조건을 입력 받아서 printSearch_proc.jsp가 검색 조건에 맞는 결과를 출력하도록 만들어보자.
printSearch.jsp
더보기<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script> <title>Insert title here</title> </head> <body> <div class="container"> <h2>개별 출력 찾기</h2> <form action=printSearch_proc.jsp method=post> <div class="form-group"> <div class="form-group"> <label for="name">이름:</label> <input type="text" class="form-control" id="name" name="name" placeholder="이름을 입력하세요"> </div> <button type="submit" class="btn btn-default">찾기</button> </form> </div> </body> </html>이름에 대하여 검색을 하는데, 동명이인이 있을 수 있기 때문에 rs.next함수에 while루프를 써야 하지만
일반적으로 탐색할 조건은 식별할 수 있는 것으로 하므로 여기서는 단순히 하나의 데이터만 출력했다.
printSearch_proc.jsp
더보기<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@ page import="java.io.*" %> <%@ page import="java.sql.*" %> <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script> <meta charset="UTF-8"> <title>Message Print</title> </head> <body> <% try{ String name=request.getParameter("name"); System.out.println(name); Class.forName("oracle.jdbc.driver.OracleDriver"); Connection conn=DriverManager.getConnection( "jdbc:oracle:thin:@localhost:1521:xe","hr","1234"); if(conn==null) {System.out.println("DB접속에 실패");} System.out.println("DB접속 성공"); //sql문을 작성해서 conn객체를 이용하여 데이터 베이스에 데이터 가져오기 String sql="select * from message where name=?"; PreparedStatement pstmt=conn.prepareStatement(sql);//위의 sql문을 처리하기 위해 객체 생성 pstmt.setString(1, name); ResultSet rs=pstmt.executeQuery(); if(rs.next()) { %> <div class="container"> <h2>검색 결과</h2> <div class="form-group"> <label for="no">번호:</label> <input value=<%=rs.getInt("no")%> disabled type="text" class="form-control" id="no" name="no" > </div> <div class="form-group"> <label for="name">이름:</label> <input value=<%=rs.getString("name")%> disabled type="text" class="form-control" id="name" name="name"> </div> <div class="form-group"> <label for="content">메모:</label> <input value=<%=rs.getString("content")%> disabled type="text" class="form-control" id="content" name="content"> </div> </div> <%}else{%> <script> alert("검색한 결과가 없습니다."); window.location.href = 'http://localhost:9090/message/printSearch.jsp'; </script> <% //response.sendRedirect("print_search.jsp"); } pstmt.close(); conn.close(); }catch(Exception e){} finally{} %> </body> </html>지금 까지의 만든 내용에 대한 소스 파일
list.jsp0.00MBmessageForm.jsp0.00MBmessageForm_proc.jsp0.00MBprintSearch.jsp0.00MBprintSearch_proc.jsp0.00MB개별 탐색과 탐색한 조건에 대한 데이터의 출력을 만들었으니, 수정과 삭제를 진행해보자.
update는 다음과 같은 방법으로 진행한다.
printSearch.jsp ----> printSearch_proc.jsp---> update Form
정보를 수정할 수 있는 Form을 하나 만들어보자.
이름은 updateSearch.jsp 로 만든다.
updateSearch.jsp에는 messageForm의 내용을 그대로 가지고 와서
이름을 입력받을 form 하나만 만들어 둔다.
updateSearch.jsp
더보기<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script> <title>Insert title here</title> </head> <body> <div class="container"> <h2>개별 업데이트 찾기</h2> <form action=updateSearch_view.jsp method=post> <div class="form-group"> <label for="name">이름:</label> <input type="text" class="form-control" id="name" name="name" placeholder="이름을 입력하세요"> </div> <button type="submit" class="btn btn-default">찾기</button> </form> </div> </body> </html>그리고 이에 대한 정보는 updateSearch_view.jsp에서 넘겨 받아서, 이름으로 DB를 select해서 정보를 찾은 다음
수정할 수 있도록 form을 만들어서 입력을 받을 수 있도록 한다.
그리고 입력을 하고 수정 버튼을 누르면 이에 대한 정보가 DB에 update가 되도록 한다.
DB에 update가 되도록 하는 것은 update_proc.jsp 에서 한다.
updateSearch_view.jsp
더보기<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!-- 아래의 내용을 임포트 하자 --> <%@ page import="java.io.*" %> <%@ page import="java.sql.*" %> <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script> <meta charset="UTF-8"> <title>Message Update</title> </head> <body> <% try{ String name=request.getParameter("name"); System.out.println(name); Class.forName("oracle.jdbc.driver.OracleDriver"); Connection conn=DriverManager.getConnection( "jdbc:oracle:thin:@localhost:1521:xe","hr","1234"); if(conn==null) {System.out.println("DB접속에 실패");} System.out.println("DB접속 성공"); //sql문을 작성해서 conn객체를 이용하여 데이터 베이스에 데이터 가져오기 String sql="select * from message where name=?"; PreparedStatement pstmt=conn.prepareStatement(sql);//위의 sql문을 처리하기 위해 객체 생성 pstmt.setString(1, name); ResultSet rs=pstmt.executeQuery(); if(rs.next()) { %> <div class="container"> <h2>수정 하기</h2> <form action="update_proc.jsp" method="post"> <div class="form-group"> <label for="no">번호:</label> <input value=<%=rs.getInt("no")%> disabled type="text" class="form-control" id="no" name="no"> <!-- disabled 때문에 값이 제대로 안 넘어감 그래서 아래에서 타입을 hidden으로 한다.--> <input value=<%=rs.getInt("no")%> type="hidden" id="no" name="no" > </div> <div class="form-group"> <label for="name">이름:</label> <input value=<%=rs.getNString("name")%> class="form-control" id="name" name="name"> </div> <div class="form-group"> <label for="content">메모:</label> <input value=<%=rs.getNString("content")%> type="text" class="form-control" id="content" name="content"> </div> <button type="submit" class="btn btn-default">수정</button> </form> </div> <%}else{%> <script> alert("검색한 결과가 없습니다."); //window.location.href = 'http://localhost:9090/message/printSearch.jsp'; window.location.href = 'http://localhost:9090/message/updateSearch.jsp'; </script> <% //response.sendRedirect("print_search.jsp"); } pstmt.close(); conn.close(); }catch(Exception e){} finally{} %> </body> </html>update_proc.jsp
더보기<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@ page import="java.io.*"%> <!-- 임포트 필요 --> <%@ page import="java.sql.*"%> <!-- Connection 클래스를 쓰려면 임포트 필요 --> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> </head> <body> <% try{ int no = Integer.parseInt(request.getParameter("no")); String name = request.getParameter("name"); String content = request.getParameter("content"); System.out.printf("%d, %s, %s\n",no,name,content); //오라클에 접속하기 위해서는 드라이버를 로드해야 한다. Class.forName("oracle.jdbc.driver.OracleDriver"); Connection conn = DriverManager.getConnection( "jdbc:oracle:thin:@localhost:1521:xe", "HR", "1234"); if (conn == null) {System.out.println("DB접속에 실패");} else {System.out.println("DB접속 성공");} // 특정한 번호를 가진 이의 content의 내용과 이름을 수정하는 문장 String sql = "update message set name=?,content=? where no=?"; PreparedStatement pstmt = conn.prepareStatement(sql); // 물음표를 채워 넣는다. pstmt.setNString(1,name); pstmt.setNString(2,content); pstmt.setInt(3,no); int result = pstmt.executeUpdate(); System.out.println(result +"개가 수정되었습니다."); pstmt.close(); conn.close(); response.sendRedirect("list.jsp"); // 전체 테이블 조회해서 확인 } catch(Exception e){} finally{} %> </body> </html>updateSearch.jsp을 실행해서 수정을 해보자.
삭제를 진행해보자. 삭제는 위의 update와 방식이 같다.
설명이 따로 필요 없을 것 같다.
deleteSearch.jsp <- 웹 에서 삭제할 이름을 입력받고
deleteSearch_view.jsp <- 웹 에서 입력받은 데이터를 넘겨받아 select해서 삭제할 정보를 보여주고
delete_proc.jsp <- DB에 접속해서 delete 구문을 수행한다.
deleteSearch.jsp
더보기<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script> <title>Insert title here</title> </head> <body> <div class="container"> <h2>개별 삭제 찾기</h2> <form action=deleteSearch_view.jsp method=post> <div class="form-group"> <label for="name">이름:</label> <input type="text" class="form-control" id="name" name="name" placeholder="이름을 입력하세요"> </div> <button type="submit" class="btn btn-default">검색</button> </form> </div> </body> </html>deleteSearch_view.jsp
더보기<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!-- 아래의 내용을 임포트 하자 --> <%@ page import="java.io.*" %> <%@ page import="java.sql.*" %> <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script> <meta charset="UTF-8"> <title>Message Delete</title> </head> <body> <% try{ String name=request.getParameter("name"); System.out.println(name); Class.forName("oracle.jdbc.driver.OracleDriver"); Connection conn=DriverManager.getConnection( "jdbc:oracle:thin:@localhost:1521:xe","hr","1234"); if(conn==null) {System.out.println("DB접속에 실패");} System.out.println("DB접속 성공"); //sql문을 작성해서 conn객체를 이용하여 데이터 베이스에 데이터 가져오기 String sql="select * from message where name=?"; PreparedStatement pstmt=conn.prepareStatement(sql);//위의 sql문을 처리하기 위해 객체 생성 pstmt.setString(1, name); ResultSet rs=pstmt.executeQuery(); if(rs.next()) { %> <div class="container"> <h2>삭제 하기</h2> <!-- 삭제에서는 번호만 넘겨주면 된다. 번호를 통해서만 삭제한다. --> <form action="delete_proc.jsp" method="post"> <div class="form-group"> <label for="no">번호:</label> <input value=<%=rs.getInt("no")%> disabled type="text" class="form-control" id="no" name="no"> <!-- disabled 때문에 값이 제대로 안 넘어감--> <input value=<%=rs.getInt("no")%> type="hidden" id="no" name="no" > </div> <button type="submit" class="btn btn-default">삭제</button> </form> <div class="form-group"> <label for="name">이름:</label> <input value=<%=rs.getNString("name")%> disabled class="form-control" id="name" name="name"> </div> <div class="form-group"> <label for="content">메모:</label> <input value=<%=rs.getNString("content")%> disabled type="text" class="form-control" id="content" name="content"> </div> </div> <%}else{%> <script> alert("검색한 결과가 없습니다."); //window.location.href = 'http://localhost:9090/message/printSearch.jsp'; window.location.href = 'http://localhost:9090/message/deleteSearch.jsp'; </script> <% //response.sendRedirect("print_search.jsp"); } pstmt.close(); conn.close(); }catch(Exception e){} finally{} %> </body> </html>delete_proc.jsp
더보기<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@ page import="java.io.*"%> <!-- 임포트 필요 --> <%@ page import="java.sql.*"%> <!-- Connection 클래스를 쓰려면 임포트 필요 --> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> </head> <body> <% try{ int no = Integer.parseInt(request.getParameter("no")); System.out.printf("%d",no); //오라클에 접속하기 위해서는 드라이버를 로드해야 한다. Class.forName("oracle.jdbc.driver.OracleDriver"); Connection conn = DriverManager.getConnection( "jdbc:oracle:thin:@localhost:1521:xe", "HR", "1234"); if (conn == null) {System.out.println("DB접속에 실패");} else {System.out.println("DB접속 성공");} String sql = "delete from message where no=?"; PreparedStatement pstmt = conn.prepareStatement(sql); // 위의 SQL문을 처리하기 위해 객체 생성 pstmt.setInt(1, no); int result = pstmt.executeUpdate(); System.out.println(result +"개가 삭제되었습니다."); pstmt.close(); conn.close(); response.sendRedirect("list.jsp"); // 전체 테이블 조회해서 확인 } catch(Exception e){} finally{} %> </body> </html>deleteSearch.jsp을 실행해서 데이터를 삭제해보자.
각 개별적으로 출력,삭제,수정,입력이 모두 완성되었다.
이제는 이를 하나로 통합하는 작업만 남았다.
즉, index.jsp를 만들어서 main 메뉴들을 보여주고 원하는 작업을 할 수 있도록 수행하면 된다.
messageForm의 내용을 가지고 와서 적당히 수정하면 된다.
index.jsp
더보기<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <title>MESSAGE MENU</title> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script> </head> <body> <div class="container"> <h2>Message관리</h2> <p>메뉴를 선택해 주세요</p> <div class="list-group"> <a href="messageForm.jsp" class="list-group-item list-group-item-success">메시지 입력</a> <a href="list.jsp" class="list-group-item list-group-item-info">메시지 출력</a> <a href="printSearch.jsp" class="list-group-item list-group-item-active">메시지 개별 출력</a> <a href="updateSearch.jsp" class="list-group-item list-group-item-warning">메시지 수정</a> <a href="deleteSearch.jsp" class="list-group-item list-group-item-danger">메시지 삭제</a> </div> </div> </body> </html>그리고 각 페이지에 메인 메뉴로 이동할 수 있는 버튼이 없어서 불편하다.
deleteSearch
updateSearch
messageForm
list
printSearch
위의 jsp파일에서 메인 메뉴로 이동할 수 있는 링크를 걸어두자.
<h2><a href="index.jsp"> Main menu로 이동</a></h2>
위의 문장을 body 태그 바로 아래에 적어두도록 하자.
전체 소스 파일
delete_proc.jsp0.00MBdeleteSearch.jsp0.00MBdeleteSearch_view.jsp0.00MBindex.jsp0.00MBlist.jsp0.00MBmessageForm.jsp0.00MBmessageForm_proc.jsp0.00MBprintSearch.jsp0.00MBprintSearch_proc.jsp0.00MBupdate_proc.jsp0.00MBupdateSearch.jsp0.00MBupdateSearch_view.jsp0.00MB아래는 위보다 조금 더 스타일을 추가한 것인데, 많은 변화는 없다.
list를 기존의 테이블을 쓰지 않고 다른 쪽에서 끌어다 썼다.
아래에서 위에서 한 내용을 다시 복습해보자.
designatedroom87.tistory.com/298
Form을 활용해서 정보를 DB와 연결하기
아래의 내용과 만드는 방식은 모두 동일하다. 그러나 DB에 저장할 테이블만 다르다. designatedroom87.tistory.com/296?category=901206 Form을 활용해서 정보를 DB와 연결하기 현재 프로젝트의 하위 폴더인 WebCo.
designatedroom87.tistory.com
list.jsp 에서 검색 기능을 추가해보자.
list.jsp에서는 message 테이블에 저장된 모든 정보들을 출력하는 역할을 했다.
그런데 여기에서 찾을 내용이 이름일 수도 있고 메시지의 내용일 수도 있다.
그리고 한 가지 더 중요한 사실은 메시지에서 특정한 문자열을 입력했을 시에
그에 해당하는 내용이 있는지도 확인을 해야한다.
SQL에서는 이와 같이 특정한 내용이 있는지 찾아내는 'like'라는 문법을 이용하자.
그리고 찾으려는 내용이 이름인지 메시지인지를 찾아야 하며, 그리고 검색할 내용을 알면 된다.
이에 대한 form의 입력이 끝나면, 이 내용은 search_list.jsp가 처리를 한다.
search_list.jsp는 조건에 맞는 내용을 찾아 출력하면 된다. SQL문의 select문을 이용한다.
list.jsp
더보기<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@ page import="java.io.*" %> <%@ page import="java.sql.*" %> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Message List</title> </head> <body> <div> <h2><a href = "index.jsp">Message Menu로 이동</a></h2> <h2>메시지 전체 리스트</h2> <form action="search_list.jsp" method=post> <div> <select name=where> <option value="name">이름</option> <option value="content">메시지</option> </select> <!-- <input type="text" name="name" placeholder="찾을 내용을 입력하세요"> --> <input type="text" name="search"> <button type="submit">검색</button> </div> </form><br> <table border = 1> <tr> <th>번호</th><th>이름</th><th>메시지</th> </tr> <% try{ Class.forName("oracle.jdbc.driver.OracleDriver"); Connection conn=DriverManager.getConnection( "jdbc:oracle:thin:@localhost:1521:xe","hr","1234"); if(conn==null) {System.out.println("DB접속에 실패");} System.out.println("DB접속 성공"); //sql문을 작성해서 conn객체를 이용하여 데이터 베이스에 데이터 가져오기 String sql="select * from message"; PreparedStatement pstmt=conn.prepareStatement(sql);//위의 sql문을 처리하기 위해 객체 생성 ResultSet rs=pstmt.executeQuery(); while(rs.next()) {%> <tr> <td><%=rs.getInt("no")%></td> <td><%=rs.getNString("name")%></td> <td><%=rs.getNString("content")%></td> </tr> <%} //while end pstmt.close(); conn.close(); }catch(Exception e){} finally{} %> </table> </div> </body> </html>search_list.jsp
더보기<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@ page import="java.io.*" %> <%@ page import="java.sql.*" %> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Message List</title> </head> <body> <div> <h2><a href = "index.jsp">Message Menu로 이동</a></h2> <h2>메시지 전체 리스트</h2> <form action="search_list.jsp" method=post> <div> <select name=where> <option value=name>이름</option> <option value=content>메시지</option> </select> <!-- <input type="text" name="name" placeholder="찾을 내용을 입력하세요"> --> <input type="text" name="search"> <button type="submit">검색</button> </div> </form> <table border = 1> <tr> <th>번호</th><th>이름</th><th>메시지</th> </tr> <% try{ //String name=request.getParameter("name"); //System.out.println(name); String where=request.getParameter("where"); String search=request.getParameter("search"); System.out.printf("%s, %s\n",where, search); Class.forName("oracle.jdbc.driver.OracleDriver"); Connection conn=DriverManager.getConnection( "jdbc:oracle:thin:@localhost:1521:xe","hr","1234"); if(conn==null) {System.out.println("DB접속에 실패");} System.out.println("DB접속 성공"); //sql문을 작성해서 conn객체를 이용하여 데이터 베이스에 데이터 가져오기 //String sql="select * from message where name=?"; //String sql="select * from message where ? like '%?%'"; //where 필드명 like String sql="select * from message where "; sql += where; sql += " like "; sql += "'%"; sql += search + "%'"; PreparedStatement pstmt=conn.prepareStatement(sql);//위의 sql문을 처리하기 위해 객체 생성 //pstmt.setString(1,name); //pstmt.setString(1,where); //pstmt.setString(2,search); ResultSet rs=pstmt.executeQuery(); while(rs.next()) {%> <tr> <td><%=rs.getInt("no")%></td> <td><%=rs.getString("name")%></td> <td><%=rs.getString("content")%></td> </tr> <%} //while end pstmt.close(); conn.close(); }catch(Exception e){} finally{} %> </table> </div> </body> </html>그리고, 게시판의 역할을 내용을 알아보자.
designatedroom87.tistory.com/303
게시판 만들기
아래의 boardpage,jsp는 아주 간단한 게신판의 예이다. 전체 페이지의 개수를 아래와 같은 조건이 붙은 이유는 만약 한 페이지 당 보여줄 글의 개수를 10개라고 하고 총 글의 개수를 28개라고 한다면
designatedroom87.tistory.com
'JAVA > 웹 프로그래밍 - JSP' 카테고리의 다른 글
간단한 게시판 만들기 (0) 2020.11.09 Form을 활용해서 정보를 DB와 연결하기 (2) 2020.11.07 클라이언트에 대한 정보 찾기 (0) 2020.11.04 수 입력 받아서 홀수/짝수 판단하기 (0) 2020.11.04 로그인 페이지 만들어 보기 (0) 2020.11.04