2019/08/26 성적 화면구현& 결과값 출력& 데이터 입력/조회/삭제
- -
1. 화면을 구현하고 데이터를 넣어줄 테이블을 생성
전에 존재 하던 sungjuk 테이블을 지우고 새로 생성해 준다
--성적테이블 삭제
drop table sungjuk;
--성적테이블 생성
create table sungjuk(
sno int not null --일련번호
,uname varchar(50) --이름
,kor int not null --국어
,eng int not null --영어
,mat int not null --수학
,aver int --평균
,addr varchar(50) --주소
,wdate date --작성일
);
2. 데이터를 입력할 Form 화면
<%@ page contentType="text/html; charset=UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>sungjukForm.jsp</title>
</head>
<body>
<h1>*성적 입력 폼*</h1>
<p><a href="sungjukList.jsp">[성적목록]</a></p>
<form method="post" action="sungjukIns.jsp">
<table border ="1">
<tr>
<th>이름</th>
<td>
<input type="text" name="uname" maxlength="20" required autofocus>
<!--반드시 입력 커서가 칸에 설정-->
</td>
</tr>
<tr>
<th>국어</th>
<td>
<input type="number" name="kor" size="5" min="0" max="100" placeholder="숫자 입력">
<!--hint 표시 하는 설정 -->
</td>
</tr>
<tr>
<th>영어</th>
<td>
<input type="number" name="eng" size="5" min="0" max="100" placeholder="숫자 입력">
</td>
</tr>
<tr>
<th>수학</th>
<td>
<input type="number" name="mat" size="5" min="0" max="100" placeholder="숫자 입력">
</td>
</tr>
<tr>
<th>주소</th>
<td>
<select name="addr">
<option value="Seoul">서울</option>
<option value="Jeju">제주</option>
<option value="Busan">부산</option>
<option value="Suwon">수원</option>
</select>
</td>
</tr>
<tr>
<td colspan="2" align="center">
<input type="submit" value="전송">
<input type="reset" value="취소">
</td>
</tr>
</table>
</form>
</body>
</html>
※테이블 안에 input 태그를 넣어서 데이터를 입력할 수 있게 테이블 양식을 만듬
3. 입력정보 가져와서 출력하기
<%@ page contentType="text/html; charset=UTF-8"%>
<%@page import="java.sql.PreparedStatement"%>
<%@page import="java.sql.DriverManager"%>
<%@page import="java.sql.Connection"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>sungjukIns.jsp</title>
</head>
<body>
<h1>*성적 결과*</h1>
<p><a href="sungjukForm.jsp">[성적쓰기]</a></p>
<%
//한글 인코딩
request.setCharacterEncoding("UTF-8");
//입력정보 가져와서 변수에 담기
String uname=request.getParameter("uname").trim();
int kor=Integer.parseInt(request.getParameter("kor"));
int eng=Integer.parseInt(request.getParameter("eng"));
int mat=Integer.parseInt(request.getParameter("mat"));
String addr=request.getParameter("addr").trim();
//평균 구하기
int aver=(kor+eng+mat)/3;
//출력
out.println("이름 : " + uname + "<hr>");
out.println("국어 : " + kor + "<hr>");
out.println("영어 : " + eng + "<hr>");
out.println("수학 : " + mat + "<hr>");
out.println("평균 : " + aver + "<hr>");
out.println("주소 : " + addr + "<hr>");
out.println("IP주소 : " +request.getRemoteAddr() + "<hr>");
%>
</body>
</html>
1) 한글 인코딩
request.setCharacterEncoding("UTF-8") 을 사용하여 데이터를 입력하여 출력할때, 깨지는 한글을 잡아준다
2) 입력한 정보 변수에 담기
request.getParameter("name명") 입력한 데이터를 받고,
데이터 값이 숫자가 나와야하는 kor,eng,mat 는 Integer.parseInt();를 이용해서 데이터를 출력해준다
3) 평균을 aver 변수에
4. 입력 데이터 Oracle DB 에 담기
<%
try{
}catch(Exception e){out.print("실패!!"+e);}//try end
%>
exception을 잡기위해 try{}catch(Exception e){out.print("실패!!"+e);} 사용
//Oracle DB 저장----------------------------------------------------------
try{
//1)Oracle 드라이버 (objbc6.jar)
Class.forName("oracle.jdbc.OracleDriver");
//2)Oracle DB 연결
Connection con=DriverManager.getConnection("jdbc:oracle:thin:@//localhost:1521/xe","java0514","1234");
//3)SQL문 작성
StringBuilder sql= new StringBuilder();
sql.append(" INSERT INTO sungjuk (sno,uname,kor,eng,mat,aver,addr)");
sql.append(" VALUES((SELECT NVL(MAX(SNO),0)+1 FROM sungjuk),?,?,?,?,?,?,sysdate)");
//4)SQL문 변환
PreparedStatement pstmt=null;
pstmt=con.prepareStatement(sql.toString());
pstmt.setString(1, uname);
pstmt.setInt(2, kor);
pstmt.setInt(3, eng);
pstmt.setInt(4, mat);
pstmt.setInt(5, aver);
pstmt.setString(6, addr);
//5)SQL 문 실행
int cnt=pstmt.executeUpdate();
if(cnt==0){
out.println("<p>성적입력이 실패했습니다.");
out.println("<p><a href='javascript:history.back()'>[다시시도]</a>");
}else{
out.println("<script>");
out.println(" alert('성적이 입력되었습니다.');");
out.println(" location.href='sungjukList.jsp';");//목록페이지로 이동!!
out.println("</script>");
}catch(Exception e){out.println("실패!!"+e);}//try end
%>
</body>
</html>
교육 과정에서는 driver,id,password,url 변수를 할당하여 초기값을 잡아주고 시작하였다
1) 드라이버 연결
Class.forName(""); 에 "oracle.jdbc.OracleDriver" 넣어 드라이버 연동
2) Oracle DB 연동
Connection 에 DriverManager 함수를 사용하여 "jdbc:oracle:thin:@//localhost:1521/xe" jdbc를 연동해주고,
그위에 DB 아이디와 비밀번호를 입력
3) SQL문 작성
string 자료형으로 sql변수를 잡아 객체를 만들어 주고, sql에 append 메소드로 SQL 문 을 작성하여 넣어준다
여기서, 사용자가 입력해야할 uname,kor,eng,mat,addr 그리고 aver 까지는 ? 로 작성
4) SQL문 변환
PreparedStatement pstmt=null;
pstmt에 DB와 연동한(con) sql문을 대입 , setInt를 이용하여 ?순서에 맞게 위에서 설정한 변수 값들을 차근차근 넣어준다
5) SQL문 실행
cnt에 실행문을 넣어 실행시키고,
이 값이 0이면 성적입력 실패 아니면 성적입력 성공
실패시 : javascript:history.back() 로 뒤로가기
성공시 : alert('성적입력 완료') 문구를 알림창이 뜨게 하고, location.href='' 로 이동위치 설정
5. sungjukList를 만들어 보자
<%@ page contentType="text/html; charset=UTF-8"%>
<%@ page import="java.sql.*" %>
<%@ page import="java.util.*" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>sungjukList.jsp</title>
</head>
<body>
<h1>*성적목록*</h1>
<p><a href="sungjukForm.jsp">[성적쓰기]</a></p>
<table border="1">
<tr>
<th>이름</th>
<th>국어</th>
<th>영어</th>
<th>수학</th>
<th>등록일</th>
</tr>
<%
try{
Class.forName("oracle.jdbc.OracleDriver");
Connection con=DriverManager.getConnection("jdbc:oracle:thin:@//localhost:1521/xe","java0514","1234");
StringBuilder sql= new StringBuilder();
sql.append(" SELECT uname,kor,eng,mat,aver,wdate");
sql.append(" FROM sungjuk");
sql.append(" ORDER BY wdate desc");
sql.append(" FROM sungjuk");
//변수 선언과 실행을 같이
PreparedStatement pstmt=con.prepareStatement(sql.toString());
ResultSet rs=pstmt.executeQuery();
if(rs.next()){//cursor가 있는지 확인
do{
%>
<tr>
<td><%=rs.getString("uname") %>
<td><%=rs.getInt("kor") %>
<td><%=rs.getInt("eng") %>
<td><%=rs.getInt("mat") %>
<td><%=rs.getInt("aver") %>
<td><%=rs.getString("wdate") %>
</tr>
<%
}while(rs.next());
}else{
out.print("<tr>");
out.print(" <td colspan='5'>글없다!!!</td>");
out.print("<tr>");
}
}catch(Exception e){out.println("시패류ㅜ:"+e);}
%>
</table>
</body>
</html>
1) sungjukList는 sungjuk 테이블의 데이터들을 조회하는 페이지이다!!
2) 조회를 하기 위해선 SQL 문의 select를 사용해야 하기 때문에 DB 연동을 해줘야 한다
3) 연동을 시켜준후 sql 에sql 문을 넣어서 DB연동을 시키 con 변수에 sql.toString을 넣어 SQL문을 실행해 준다
4) select 문의 SQL문 실행은 Insert 문의 executeUpdate(); 와 다르게
excuteQuery(); 를 사용해 줘서 if(){} 으로 비교하여 출력을 해준다
Create -행추가 insert
Read -조회 select
Update -수정 update
Delete -삭제 delete
[성적테이블 CRUD]
sungjukForm.jsp 성적쓰기 ->sungjuklns.jsp
▶성적 쓰기 에서 데이터를 입력하면 sungjuklns.jsp 를 통에 DB에 데이터가 들어간다
sungjukList.jsp 성적목록
▶들어간 데이터를 확인하기 위해 sungjukList.jsp 페이지로 이동
sungjukList.jsp 성적목록-->sungjukRead.jsp 상세보기 -->수정과 삭제
▶sungjukList.jsp 목록에서 이름을 클릭하면 상세보기로 들어가게 링크
6. sungjukRead.jsp 상세보기 페이지 만들기
1) sungjukList.jsp 에서 sno 로 공동의 값 설정하기
<tr>
<td><a href="sungjukRead.jsp? sno=<%=rs.getInt("sno")%>"><%=rs.getString("uname") %></a></td>
<td><%=rs.getInt("kor") %></td>
<td><%=rs.getInt("eng") %></td>
<td><%=rs.getInt("mat") %></td>
<td><%=rs.getInt("aver") %></td>
<td><%=rs.getString("wdate") %></td>
</tr>
<td><a href="sungjukRead.jsp?sno=<%=rs.getInt("sno")%>"><%=rs.getStrint("uname")%></a></td>
에서 특정값을 주고 받아야 하기 때문에 sungjukRead.jsp 페이지로 갈때 sno=re.getInt("sno")값을 주어야 한다, 그러기 위해선 중간에 <%=%> JSP문을 이용해 그 값을 넣어 준다
2) sungjukRead.jsp 에서 공동의 sno 값 불러오기
<%@ page contentType="text/html; charset=UTF-8"%>
<%@ page import="java.sql.*" %>
<%@ page import="java.util.*" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>sungjukRead.jsp</title>
</head>
<body>
<h1>*성적 상세보기*</h1>
<p>
<a href="sungjukForm.jsp">[성적쓰기]</a>
<a href="sungjukList.jsp">[성적목록]</a>
</p>
<%
int sno=Integer.parseInt(request.getParameter("sno"));
//out.print(sno);
try{
Class.forName("oracle.jdbc.OracleDriver");
Connection con=DriverManager.getConnection("jdbc:oracle:thin:@//localhost:1521/xe", "java0514", "1234");
StringBuilder sql=new StringBuilder();
sql.append(" SELECT sno, uname, kor, eng, mat, aver, addr, wdate ");
sql.append(" FROM sungjuk ");
sql.append(" WHERE sno=? ");
PreparedStatement pstmt=con.prepareStatement(sql.toString());
pstmt.setInt(1, sno);
ResultSet rs=pstmt.executeQuery();
if(rs.next()){ //cursor있는지?
%>
<table border="1">
<tr>
<th>이름</th>
<td><%=rs.getString("uname")%></td>
</tr>
<tr>
<th>국어</th>
<td><%=rs.getInt("kor")%></td>
</tr>
<tr>
<th>영어</th>
<td><%=rs.getInt("eng")%></td>
</tr>
<tr>
<th>수학</th>
<td><%=rs.getInt("mat")%></td>
</tr>
<tr>
<th>평균</th>
<td><%=rs.getInt("aver")%></td>
</tr>
<tr>
<th>주소</th>
<td>
<%=rs.getString("addr")%>
<%
//문제)주소를 한글로 출력
String addr=rs.getString("addr");
if(addr.equals("Seoul")){
out.println("서울");
}else if(addr.equals("Jeju")){
out.println("제주");
}else if(addr.equals("Busan")){
out.println("부산");
}else if(addr.equals("Suwon")){
out.println("수원");
}//if end
%>
</td>
</tr>
<tr>
<th>등록일</th>
<td><%=rs.getString("wdate")%></td>
</tr>
</table>
<br><br>
<a href="sungjukUpdate.jsp?sno=<%=sno%>">[수정]</a>
<a href="sungjukDel.jsp?sno=<%=sno%>">[삭제]</a>
<%
}else{
out.println("해당 글 없음!!");
}//if end
}catch(Exception e){
out.println("실패:" + e);
}//try end
%>
</body>
</html>
▲ 드라이브와 DB 를 연동하는 코딩은 매번 페이지를 만들때 마다 반복적으로 쓰이기 때문에 나중에
클래스로 만들어서 사용할 것이다. 이렇게 사용하면 id 와 password 가 바뀐다 하더라도
모든 페이지에 가서 바꿔야하는 번거러움을 덜 수 있다.
※문제 주소를 한글로 출력해 보자
<tr>
<th>주소</th>
<td><%=rs.getString("addr")%>
<%
String addr=rs.getString("addr");
if(addr.equals("Seoul")){
out.print("서울");
}else if(addr.equals("Jeju")){
out.print("제주");
}else if(addr.equals("Busan")){
out.print("부산");
}else if(addr.equals("Suwon")){
out.print("수원");
}
%>
</td>
</tr>
sungjukRead.jsp 페이지에 테이블내의 주소쪽 에 JSP 문법을 넣어서 영어 주소를 한글 주소로 출력해 보았다
3) sungjukDel.jsp 를 만들어서, 데이터를 지워보자
<%@ page contentType="text/html; charset=UTF-8"%>
<%@ include file="ssi.jsp" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>sungjukDel.jsp</title>
</head>
<body>
<h1>*성적 삭제*</h1>
<p>
<a href="sungjukForm.jsp">[성적쓰기]</a>
<a href="sungjukList.jsp">[성적목록]</a>
</p>
<%
int sno=Integer.parseInt(request.getParameter("sno"));
try{
Class.forName("oracle.jdbc.OracleDriver");
Connection con=DriverManager.getConnection("jdbc:oracle:thin:@//localhost:1521/xe", "java0514", "1234");
StringBuilder sql=new StringBuilder();
sql.append(" DELETE FROM sungjuk ");
sql.append(" WHERE sno=?");
PreparedStatement pstmt=con.prepareStatement(sql.toString());
pstmt.setInt(1, sno);
int cnt=pstmt.executeUpdate();
if(cnt==0){
out.println("<p>성적 삭제 실패했습니다</p>");
out.println("<p><a href='javascript:history.back()'>[다시시도]</a></p>");
}else{
out.println("<script>");
out.println(" alert('성적이 삭제되었습니다');");
out.println(" location.href='sungjukList.jsp';");//목록페이지이동
out.println("</script>");
}//if end
}catch(Exception e){
out.println("실패:" + e);
}//try end
%>
</body>
</html>
4) sungjukUpdate.sql 로 데이터를 수정해 보자
<%@ page contentType="text/html; charset=UTF-8"%>
<%@ include file="ssi.jsp" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>sungjukUpdate.jsp</title>
</head>
<body>
<h1>*성적 수정*</h1>
<p>
<a href="sungjukForm.jsp">[성적쓰기]</a>
<a href="sungjukList.jsp">[성적목록]</a>
</p>
<%
int sno=Integer.parseInt(request.getParameter("sno"));
try{
Class.forName("oracle.jdbc.OracleDriver");
Connection con=DriverManager.getConnection("jdbc:oracle:thin:@//localhost:1521/xe", "java0514", "1234");
StringBuilder sql=new StringBuilder();
sql.append(" SELECT sno, uname, kor, eng, mat, addr ");
sql.append(" FROM sungjuk ");
sql.append(" WHERE sno=? ");
PreparedStatement pstmt=con.prepareStatement(sql.toString());
pstmt.setInt(1, sno);
ResultSet rs=pstmt.executeQuery();
if(rs.next()){
%>
<form method="post" action="sungjukUpdateProc.jsp">
<input type="hidden" name="sno" value="<%=sno%>">
<table border="1">
<tr>
<th>이름</th>
<td>
<input type="text" name="uname" value="<%=rs.getString("uname")%>"
maxlength="20" required autofocus>
</td>
</tr>
<tr>
<th>국어</th>
<td>
<input type="number" name="kor" value="<%=rs.getInt("kor")%>"
size="5" min="0" max="100" placeholder="숫자입력">
</td>
</tr>
<tr>
<th>영어</th>
<td>
<input type="number" name="eng" value="<%=rs.getInt("eng")%>"
size="5" min="0" max="100" placeholder="숫자입력">
</td>
</tr>
<tr>
<th>수학</th>
<td>
<input type="number" name="mat" value="<%=rs.getInt("mat")%>"
size="5" min="0" max="100" placeholder="숫자입력">
</td>
</tr>
<tr>
<th>주소</th>
<td>
<%
String addr=rs.getString("addr");
%>
<select name="addr">
<option value="Seoul" <%if(addr.equals("Seoul")){out.print("selected");}%>>서울</option>
<option value="Jeju" <%if(addr.equals("Jeju")) {out.print("selected");}%>>제주</option>
<option value="Busan" <%if(addr.equals("Busan")){out.print("selected");}%>>부산</option>
<option value="Suwon" <%if(addr.equals("Suwon")){out.print("selected");}%>>수원</option>
</select>
</td>
</tr>
<tr>
<td colspan="2" align="center">
<input type="submit" value="전송">
<input type="reset" value="취소">
</td>
</tr>
</table>
</form>
<%
}else{
out.println("해당 글 없음!!");
}//if end
}catch(Exception e){
out.println("실패:" + e);
}//try end
%>
</body>
</html>
<%@ page contentType="text/html; charset=UTF-8"%>
<%@ include file="ssi.jsp" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>sungjukUpdateProc.jsp</title>
</head>
<body>
<h1>*성적 수정*</h1>
<p>
<a href="sungjukForm.jsp">[성적쓰기]</a>
<a href="sungjukList.jsp">[성적목록]</a>
</p>
<%
int sno=Integer.parseInt(request.getParameter("sno"));
String uname=request.getParameter("uname");
int kor=Integer.parseInt(request.getParameter("kor"));
int eng=Integer.parseInt(request.getParameter("eng"));
int mat=Integer.parseInt(request.getParameter("mat"));
int aver=(kor+eng+mat)/3;
String addr=request.getParameter("addr");
String wdate=request.getParameter("wdate");
try{
Class.forName("oracle.jdbc.OracleDriver");
Connection con=DriverManager.getConnection("jdbc:oracle:thin:@//localhost:1521/xe", "java0514", "1234");
StringBuilder sql=new StringBuilder();
sql.append(" UPDATE sungjuk SET uname=?,kor=?,eng=?,mat=?,addr=?");
sql.append(" WHERE sno=? ");
PreparedStatement pstmt=con.prepareStatement(sql.toString());
pstmt.setString(1, uname);
pstmt.setInt(2, kor);
pstmt.setInt(3, eng);
pstmt.setInt(4, mat);
pstmt.setString(5, addr);
pstmt.setInt(6, sno);
int cnt= pstmt.executeUpdate();
if(cnt==0){
out.println("<p>성적 수정 실패했습니다</p>");
out.println("<p><a href='javascript:history.back()'>[다시시도]</a></p>");
}else{
out.println("<script>");
out.println(" alert('성적이 수정되었습니다');");
out.println(" location.href='sungjukList.jsp';");//목록페이지이동
out.println("</script>");
}
}catch(Exception e){out.print("실패~~!!"+e);}
%>
</body>
</html>
▲ sungjukUpdate.jsp 에서받은 form양식을 update문으로 정보를 수정해 줌
'JAVA 교육 > Jsp' 카테고리의 다른 글
2019/08/26 request 내부객체의 다양한 메소드 (0) | 2019.08.26 |
---|---|
2019/08/23 다양한 컨트롤 요소들 (0) | 2019.08.23 |
2019/08/23 계산 연습 (0) | 2019.08.23 |
2019/08/23 JSP에서 를 HTML이용한 성적 양식 만들어 보기 (0) | 2019.08.23 |
2019/08/23 내부객체 (0) | 2019.08.23 |
소중한 공감 감사합니다