초급의 끄적거림

[JSP] 성적프로그램 2 본문

JSP

[JSP] 성적프로그램 2

codingD 2019. 8. 27. 15:45

[sungjukRead.jsp] 성적 상세보기

기존에 들어가 있던 성적 목록

 

⊙ 상세보기는 목록페이지에 있는거 긁어서 만드는 것으로, 목록페이지에서 sno를 넘기면 상세보기 페이지에서 sno를 기준으로 새로운 페이지를 작성 (각자 독립적인 페이지이고 연결된 같은 페이지 아님)

⊙ 서로 다른 페이지를 만들고 있기 때문에 그것을 연결하는 것이 '변수' : PK에 준하는 변수를 가져가야함

<%@ page contentType="text/html; charset="UTF-8"%>
<%@ page page import="java.sql.*"%>
<%@ page 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"));
    
    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()){
%>        
              <table>
				<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") %></td>                			
				</tr>	
				<tr>
					<th>등록일</th>
					<td><%=rs.getString("wdate") %></td>
				</tr>	
			</table> 
            <br><br>  // 줄바꿈기능, 특정한 무언가를 가져가야 하기 때문에 a 태그에 ?를 넣어서 가져감, sno 와 같같은 변수는 칼럼명을 기준으로 동일하게 가져가는 것이 좋음

<%            
        }else{
        	out.println("해당 글 없음T.T");
        }//if end
    }catch(Expcetion e){
    	out.print("실패 : " + e)
    }
%>
<주석 추가>
 ⊙ 후에는 try 문에 적힌 'DB 연동'은 반복적으로 이루어지기 때문에 'DBOpen'이라는 클래스를 따로 만들어서 관리
 ⊙ sungjukRead.jsp를 통해서 연결을 해주고 난 후에 각자의 이름에 걸린 링크를 누르면 url에 sno 순서가 뜨면서 각자의 상세보기가 나옴

 

 

여러 명을 둘러봐도 동일하게 상세보기와 함께 url에 '?sno=순서' 가 뜨는 것을 확인할 수 있다

 

 

+) 영어 주소를 한글로 바꿔보기 (주소 테이블에 <%%> 끼워 넣고 작성)

<tr>
 	<th>주소</th>
    <td><%=rs.getString("addr")%>
    //위에 만들어진 코드에서 '테이블-주소' 수정
<%
	String addr=rs.getString("addr");
    
    if(addr.equls("Seoul")){
    	out.println("서울")
    }else if(addr.equls("Busan")){
    	out.println("부산")
    }else if(addr.equls("Suwon")){
    	out.println("수원")
    }else ifaddr.equls("Jeju")){
    	out.println("제주")
    }//if end
%>
	</td>  
</tr>

 

한글주소가 추가 된 모습

 

 

 +) 성적 상세보기 (sungjukRead.jsp)에 style 태그를 넣어줌

<style>
table {
  border-collapse: collapse;
  width: 20%;
}

th, td {
  text-align: center;
  padding: 4px;
}

tr:nth-child(even) {background-color: #f2f2f2;}
</style>

 

 

⊙ sungjukRead에서 수정, 삭제를 만들어줌

⊙ HTML에 해당하여 위 '상세보기' 코드에서 </table> 코드 뒤에 추가해주기

</table>
<br><br>
<a href="sungjukUpdate.jsp?sno=<%=sno%>">[수정]</a>
&nbsp; &nbsp; //공백넣기
<a href="sungjukDel.jsp?sno=<%=sno%>">[삭제]</a>

<주석 추가>
 ⊙ <br> : 줄바꿈
 ⊙ &nbsp : 공백넣기
 ⊙ sungjukUpdate.jsp와 연결하기 위해 sno를 가져다 쓸 것이기 때문에 ?sno=<%=sno%> 사용
  - (물음표의 뒤를 적을 때는 변수=값&변수1=변수1  . . .)

 

 ⊙ [수정], [삭제]는 아직 sungjukUpdate.jsp와 sungjukDel.jsp 가 없기 때문에 클릭시 에러 발생함

[수정]을 눌렀을 경우
[삭제]를 눌렀을 경우

 

[ssi.jps]

 ⊙ 자주 쓰는 것들 모아서 만들어 둔 파일, 꾸준히 쓰면서 추가할 것

 ⊙ 사용하려고 하는 jsp파일에 가서 <%@ include file="ssi.jsp" %> 로 사용

//현재까지 ssi.jsp에 들어가 있는 코드

<%@ page contentType="text/html; charset=UTF-8"%>

<%@ page import="java.io.*"%>
<%@ page import="java.sql.*"%>
<%@ page import="java.util.*"%>

<%
	//ssi.jsp 공통으로 사용할 코드를 작성한다

	//한글 인코딩
	request.setCharacterEncoding("UTF-8");
%>

 

 

[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"));  // 연결해야하는 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=?");
   
    PrepareStatement pstmt=con.prepareStatement(sql.toString());
    pstmt.setInt(1, sno);
    
    int cnt=pstmt.executeUpdate();
    if(cnt==0){  //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>

삭제가 되면 성적이 삭제되었다는 알림창과 함께 성적목록으로 이동

 

맨 위의 '지현중' 이 삭제되어 없어진 모습

 

[sungjukUpdate.jsp]

  - [수정] 은 단순히 Update만 쓰는 것이 아님

  1) 수정하고자 하는 행을 가져와서 → sungjukRead참조, SELECT가 나와야 함, 원래 입력했던 폼을 가져와야하기 때문
  2) 폼에 출력하고 → sungjukForm 참조
  3) 해당 데이터를 수정한다 →sungjukUpdateProc.jsp
                                             → UPDATE  
 ⊙ 페이지가 2개가 나와야함. SELECT와 UPDATE 두 개가 나와야 하기 때문.

<주석추가>
 ⊙ sno=5인 산체스를 수정하기 위해 수정으로 들어간 모습
 ⊙ 수정을 하게 되면 주소가 적혀 있던 '부산'으로 가야하기 때문에 selected 를 이용하여 지정해주기
   - selected : 선택하는 옵션에서 '처음 시작하는 것을 정할 때' 
 ⊙ form 안에서 sungjuk.sql의 행추가의 sno가 존재하지 않지만 필요한 값이기 때문에 가져오기 위해서 hidden 사용
 ⊙ 테이블의 '이름' : textbox 안에 출력되는 말을 만들어줄 때 value 값을 이용하는데 이미 들어가 있는 uname을 쓰기 위해서 rs.getString("uname")사용
<%@ 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=? ");
      
      PreaparedStatement pstmt=con.prepareStatement(sql.toString());
      pstmt.seInt(1, sno);
      
      ResultSet rs=pstmt.executeQuery();
      if(rs.next()){
%>
<form method="post" action="sungjukUpdateProc.jsp"> <!-- sungjukUpdateProc.jsp 에서 실제로 수정이 될 것 -->
	<input type="hidden" name="sno" value="<%=sno%>"> <!-- form 안에 sungjuk.sql의 행추가의 sno가 존재하지 않지만 필요한 값이기 때문에 가져오기 위해서 hidden 사용 -->
	<table border="1">
	 <tr>
	  <th>이름</th>
		<td>
		 <input type="text" name="uname" value="<%=rs.getString("uname") %>" maxlength="20" required autofocus> <!-- textbox 실제 안에 출력되는 말을 만들어주려면 value 이용하는데 이미 들어가 있던 uname을 데려오기 위해  rs.getString("uname") 사용-->  
		</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("해당 글 없음T.T");
        }//if end
        
      }catch(Exception e){
      		out.println("실패 : " +e);
      }//try end
   %>
   </body>
   </html>
    %>

 

'페이지 소스보기'를 통해 Busan에 selected 되어 있는 모습을 확인 할 수 있음

 

 

 ⊙ hidden 값으로 가져왔을 경우, 볼 수 있게 겉보기에는 위와 변함없으나 소스보기를 했을 경우 hidden으로서 들어와 있음을 볼 수 있다.

 

 

[sungjukUpdateProc.jsp]

수정 전
수정 후

저작자표시 비영리 변경금지

'JSP' 카테고리의 다른 글

[JSP] JAVA빈즈 (DTO, DAO, CRUD) / 성적프로그램  (0) 2019.08.29
[JSP] JAVA 빈즈 (id, 객체 등) 개요 / 예제 비교  (0) 2019.08.28
[JSP] request내부객체 / 성적 프로그램 만들기1 / 한글인코딩  (0) 2019.08.26
[JSP] 내부객체 / Scope의 종류 / form의 기초 / request.getParameter("") / HTTP Status 404  (0) 2019.08.23
[JSP] 성적프로그램 / 배열 / 메소드 / <%! %>  (0) 2019.08.22
'JSP' Related Articles more
Comments