//Google AdSense

실습 ) 회원 별 구매이력 중 구매금액이 가장 높은 금액의 상품명을 추출하여 회원아이디와 이메일과 함께 조회 하시오.

SELECT
	m.m_id							AS '회원아이디'
	,m.m_email						AS '이메일'
	,g.g_name						AS '상품명'
	,max(o.o_amount * g.g_price)	AS '구매금액'
FROM 
	tb_member AS m
	INNER join
	tb_order AS o
	on
	o.o_id = m.m_id
	INNER join
	tb_goods AS g
	on
	o.o_g_code = g.g_code

GROUP BY m.m_id
ORDER BY 구매금액 DESC;	

 


Sub Query

  • SQL문 내에서 하위에 존재하는 쿼리 ( SQL문 안에 SQL )

예)

	SELECT
	*
FROM
	tb_goods AS g
WHERE
	g.g_price > ( SELECT
						ROUND(AVG(g.g_price),0)
					FROM
						tb_goods AS g ) ;

 

스칼라 서브쿼리 인라인 뷰 서브쿼리

SELECT 문에 있는 서브쿼리

(1행만 반환)

FROM 절에 있는 서브쿼리 WHERE 절에 있는 서브쿼리

인라인 : FROM절에 있는 서브쿼리

SELECT
   g.g_code
  ,g.g_name
  ,g.g_price
  ,g.g_seller_id
  ,g.g_reg_date
FROM
  tb_goods AS g
  JOIN
  ( SELECT
      ROUND(AVG(g.g_price), 0) AS '평균단가'
    FROM
      tb_goods AS g) AS gAvg
WHERE
  g.g_price > gAvg.평균단가;

스칼라 서브쿼리 : SELECT문에 있는 서브쿼리

 

SELECT
   g.g_code
  ,g.g_name
  ,g.g_price
  ,g.g_seller_id
  ,g.g_reg_date
FROM
  (SELECT
     *
    ,( SELECT
          ROUND(AVG(gAvg.g_price), 0)
       FROM
          tb_goods AS gAvg) AS '평균단가'
   FROM
     tb_goods ) AS g
WHERE
   g.g_price > g.평균단가;

서브쿼리 : WHERE절에 있는 서브쿼리

SELECT
   g.g_code
  ,g.g_name
  ,g.g_price
  ,g.g_seller_id
  ,g.g_reg_date
FROM
   tb_goods AS g
WHERE
   g.g_price > ( SELECT
                    ROUND(AVG(g.g_price), 0)
                 FROM
                    tb_goods AS g );

단일 행 서브쿼리

SELECT
  *
FROM
  tb_member AS m
WHERE
  m.m_level = ( SELECT
                  l.level_num
                FROM
                  tb_member_level AS l
                WHERE
                  l.level_num = 1 ); 

다중 행 서브쿼리

SELECT
  *
FROM
  tb_member AS m
WHERE
  m.m_level IN ( SELECT
                  l.level_num
                FROM
                  tb_member_level AS l ); 

다중컬럼 서브쿼리

SELECT
  *
FROM
  tb_member AS m1
WHERE
  (m1.m_id, m1.m_level) IN ( SELECT
                                m2.m_id
                               ,MIN(m2.m_level)
                             FROM
                               tb_member AS m2 );

UNION

*** SELECT의 개수가 동일해야 한다!

  • 여러 개의 쿼리의 합집합
  • 여러 개의 SQL문을 합쳐 하나의 SQL문으로 만들어주는 방법

UNION VS . UNION ALL

  • UNION : 여러 개의 쿼리의 중복 값을 제거한 결과
  • UNION ALL : 여러 개의 쿼리 결과가 중복이 되더라도 전부 결과에 반영
  • 속도 :  UNOIN ALL >  UNION

규칙

  • SELECT컬럼의 수가 같아야 한다.
  • 컬럼명이 같아야 한다. ( 같지 않을 경우 alias를 사용하여 같게 만듦)
  • 컬럼별 데이터타입이 같아야 한다. ( 반환 가능한 형태 )
  • 하나의 ORDER BY만 사용한다.
  • SELECT문들의 순서는 상관없다.

실습

 

실습1. DML - 1부터 시작하는 행의 번호를 포함하여 상품테이블을 출력하시오.

SELECT
	@rowNum:=(@rowNum+1) AS '행 번호'
	,g.*
FROM
	tb_goods AS g
	,(SELECT @rowNum:=0) r
	
ORDER BY	g.g_price DESC;

실습2. DML - 상품테이블의 단가 중 단가가 높은 상품 순서대로 순위를 포함하여 상품테이블을 출력하시오.

SELECT
	CASE
	WHEN (@gPri := g.g_price) THEN @rank:=(@rank+1)
	WHEN (@gPri = g.g_price) THEN @rank
	END AS '순위'
	,g.*
FROM
	tb_goods AS g
	,(SELECT @rank:=0, @gPri:=null) r
	
ORDER BY	g.g_price DESC;

실습3. DML - 관리자 제외 회원 별 로그인 평균 횟수보다 많이 로그인한 회원 아이디와 로그인 횟수를 조회 하시오.

SELECT
	l.login_id AS '아이디'
	,COUNT(l.login_id) AS '로그인횟수'
FROM
	tb_login AS l
	INNER JOIN 
	tb_member AS m
	ON 
	m.m_id =  l.login_id
	INNER JOIN
	tb_member_level AS ml
	ON 
	ml.level_num = m.m_level
WHERE
	ml.level_name NOT LIKE '%관리자%'
GROUP BY l.login_id
HAVING COUNT(l.login_id) > (SELECT 
											ROUND(AVG(cAvg.로그인횟수),1) AS '평균로그인횟수'
									 FROM
										(SELECT
											l.login_id AS '아이디'
											,COUNT(l.login_id) AS '로그인횟수'
										 FROM
											tb_login AS l
											INNER JOIN 
											tb_member AS m
											ON 
											m.m_id =  l.login_id
											INNER JOIN
											tb_member_level AS ml
											ON 
											ml.level_num = m.m_level
										 WHERE
											ml.level_name NOT LIKE '%관리자%'
										 GROUP BY l.login_id ) AS cAvg);

 

'Database' 카테고리의 다른 글

[Database] 프로시저  (0) 2020.04.13
[Database] SQL VIEW  (0) 2020.04.06
[Database] 정규화(Normalization)  (0) 2020.04.01
[Database] 데이터베이스 설계  (0) 2020.03.25

개념적설계의 결과 > E-R다이어그램

E-R다이어그램  >> 스키마설계 

이상현상(anomaly) 정규화(normalization)
불필요한 데이터 중복으로 인해 릴레이션에 대한 데이터 삽입 수정 삭제 연산을 수행할 때 발생할 수 있는 부작용

데이터의 일관성, 최소한의 데이터 중복, 최대한의 데이터 유연성을 위한 방법이며 데이터를 분해하는 과정.

 

즉 이상현상이 발생하지 않도록 릴레이션을 관련있는 속성들로만 구성하기 위해  릴레이션을 분해하는 과정.

함수적 종속성을 판단하여 정규화를 수행

함수적 종속성 (Functional Dependency)

속성들 간의 관련성

함수 종속성을 이용하여, 릴레이션을연관성이 있는 속성들로만 구성되도록 분해하여 이상현상이 발생하지 않는 릴레이션으로만들어가는 과정

이상현상(anomaly)

  1. 삽입이상
    • 릴레이션에 새 데이터를 삽입하려면 불필요한 데이터도 함께 삽입해야하는 문제
  2. 갱신이상 (Update anomaly)
    • 릴레이션의 중복된 튜플들 중 일부만 수정하여 데이터가 불일치하게 되는 모순
  3. 삭제이상 (Deletion anomaly)
    • 릴레이션에서 튜플을 삭제하면 꼭 필요한 데이터까지 손실되는 연쇄 삭제 현상이 발생하는 문제

함수 종속 (Functional Dependency)

X → Y

X Y를 함수적으로 결정한다.

Y X에 함수적으로 종속되어 있다

  1. X가 Y를 함수적으로 결정한다.
    • 릴레이션 내의 모든 튜플을 대상으로 하나의 X값에 대한 Y값이 항상 하나
    • YX에 함수적으로 종속되어 있다 와 같은 의미
    • X Y로 표현 (X는 결정자, Y종속자)
  2. 함수 종속 관계 판단
    • 속성 자체의 특성과 의미를 기반으로 함수 종속성을 판단
    • 속성 값은 계속 변할 수 있으므로 현재 릴레이션에 포함된 속성 값만으로 판단하면 안된다.
    • 일반적으로 기본키와 후보키는 릴레이션의 다른 모든 속성들을 함수적으로 결정한다.
    • 기본키나 후보키가 아니어도 다른 속성 값을 유일하게 결정하는 속성은 함수 종속 관계에서 결정자가 될 수 있다.  
  3.  완전 함수 종속 VS. 부분 함수 종속 
    1. 완전 함수 종속 (Full Functional Dependency)
      • 릴레이션에서 속성 집합 Y가 속성 집합 X에 함수적으로 종속되어 있지만, 속성 집합 X의 전체가 아닌 일부분에는 종속되지 않음을 의미
      • 일반적으로 함수 종속은 완전 함수 종속을 의미함
    2. 부분 함수 종속 (Partial Functional Dependency)
      • 릴레이션에서 속성 집합 Y가 속성 집합 X의 전체가 아닌 일부분에도 함수적으로 종속됨을 의미
  4. 결정자와 종속자가 같거나, 결정자가 종속자를 포함하는 것처럼 당연한 함수 종속 관계는 고려하지 않음

 

정규화를 통한 릴레이션 : 무손실 분해

  • 릴레이션은 의미적으로 동등한 릴레이션들로 분해되어야 하고 분해로 인한 정보의 손실이 발생하지 않아야 한다.
  • 분해된 릴레이션들을 자연 조인하면 분해 전의 릴레이션으로 복원 가능해야 한다.

정규형 (Normal Form)

  • 릴레이션이 정규화된 정도
  • 각 정규형마다 제약조건이 존재 (릴레이션 특성을 고려 적합한 정규형 선택)
  • 모든 릴레이션이5 정규형에 속해야만 바람직한 것은 아님
    • 정규형의 차수가 높아질수록 요구되는 제약조건이 많아지고 엄격해짐
  • 일반적으로 제 3 정규형이나 보이스/코드 정규형에 속하도록 릴레이션을 분해하여 데이터 중복을 줄이고 이상 현상을 해결하는 경우가 많음.
    • 3정규형까지 도달하면 이상현상이 현저히 적게 발생하기 때문에 실무적으로 보통 3정규화까지 함. (정규화가 과도하게 되어있으면 제약조건에 대한 처리와 처리속도에 영향을 미칠 수 있다.)

 

1. 제 1 정규형 (1NF)

  • 릴레이션의 모든 속성이 더는 분해되지 않는 원자 값만 가지면 제 1 정규형을 만족함
  • 1 정규형을 만족해야 관계 데이터베이스 릴레이션
  • 부분 함수 종속 때문에 이상현상 발생.
  • 부분 함수 종속이 제거되도록 릴레이션 분해 > 제 2 정규형

2. 제 2정규형 (2NF)

  • 릴레이션이1 정규형에 속하고, 기본키가 아닌 모든 속성이 기본키에 완전 함수 종속되면 제 2 정규형을 만족함.
  • 이행적 함수 종속이 존재하기 때문에 이상현상 발생.
  • 이행적 함수 종속이 제거되도록 릴레이션 분해 > 제 3 정규형

3. 제 3정규형 (3NF)

  • 릴레이션이2 정규형에 속하고, 기본키가 아닌 모든 속성이 기본키에 이행적 함수 종속되지 않으면 제 3 정규형을 만족함.
  • 후보키가 아닌 결정자가 존재할 수 있고 이 때문에 이상현상이 발생할 수 있음.
  • 후보키가 아닌 결정자가 제거되도록 릴레이션 분해 > 보이스/코드 정규형

4. 보이스/코드 정규형 (BCNF)

  • 하나의 릴레이션에 여러 개의 후보키가 존재하는 경우, 3 정규형까지 모두 만족해도 이상 현상이 발생할 수 있음.
  • 보이스/코드 정규형은 제 3 정규형에 속하지만, 3 정규형에 속하는 모든 릴레이션이 보이스/코드 정규형에 속하는 것은 아님.

5. 제 4정규형 (4NF)

  • 릴레이션이 보이스/코드 정규형을 만족하면서, 함수 종속이 아닌 다치 종속을 제거하면 제 4 정규형

6. 제 5정규형 (5NF)

  • 릴레이션이4 정규형을 만족하면서, 후보키를 통하지 않는 조인 종속제거하면 제 5 정규형에 속함.

 

정규화 VS. 반정규화

(정규화된 릴레이션( 빈번한 조인이 일어남) 검색보다 반정규화 릴레이션 검색 속도가 더 빠르다.)

'Database' 카테고리의 다른 글

[Database] SQL VIEW  (0) 2020.04.06
[Database] Sub Query / UNION  (0) 2020.04.01
[Database] 데이터베이스 설계  (0) 2020.03.25
[Database] join  (0) 2020.03.25

Ajax : 비동기 방식의 Javascript와 XML

reload 없이 data를 주고받는다.

 

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript" src="./resource/js/jquery-3.4.1.min.js"></script>
<script type="text/javascript">

	var request = $.ajax({
	  url: "script.php", //통신 할 url
	  method: "POST", // 통신할 메서드 타입
	  data: { id : '' }, //전송할 데이터
	  dataType: "html" //전송받은 데이터를 변화시킬 컨텐츠 타입
	  /*  
	  	tataType 
	  	html(text/html), sjon (application/jason),xml (text/xml), text (text/palin)
	  */
	});
	 
	//정상적으로 통신이 완료되었을 경우 실행되는 메서드
	//인수값인 함수를 실행시켜준다 (콜백함수)
	request.done(function( data ) {
	 consolo.log.( data );
	});
	 //에러 발생시 실행되는 메서드
	request.fail(function( jqXHR, textStatus ) {
	  alert( "Request failed: " + textStatus );
	});
	
	/*  
		웹(브라우저)에서 표현할 수 있는 콘텐츠 타입
		1) text/html
			html을 표현하는 타입
		2) text/xml
			xml을 표현하는 타입
			(외부 자원 관리 데이터로 저장 혹은 외부와 통신하기 위한 타입)
		3) text/plain
			텍스트를 표기하는 타입
		4) application/json 
			json을 표현하는 타입
		포맷터 : {"키" : "값"} 형태로 이루어진 문자열
		
	*/
</script>
<title>콘텐츠 삽입</title>
</head>
<body>

</body>
</html>

Ajax Html Call

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript" src="./resource/js/jquery-3.4.1.min.js"></script>
<script type="text/javascript">
	$(function() {
	
		
		$('#ajaxCall').click(function() {
			var num = $('#num').val()
			var request = $.ajax({
				  url: "ajaxHtmlCall.jsp", //통신 할 url
				  method: "POST", // 통신할 메서드 타입
				  data: { len : num }, //전송할 데이터
				  dataType: "html" //전송받은 데이터를 변화시킬 컨텐츠 타입	
			});
			
			request.done(function(data) {
				console.log(data);
				if(data != undefined && data != ''){
					$('#ajaxResult').html(data);
				}
			});

			request.fail(function( jqXHR, textStatus ) {
			  alert( "Request failed: " + textStatus );
			});
		});
	})
</script>
<title>Insert title here</title>
</head>
<body>
<input type="number" id="num" placeholder="출력갯수">
<button type="button" id="ajaxCall">호출</button>
<div id="ajaxResult">호출 버튼을 클릭하세요</div>
</body>
</html>

ajaxHtmlCall.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ page import="java.util.ArrayList" %>
<%
	//len 키 값으로 ajax02.html 에서 값 전송하여 받기
	String len = request.getParameter("len");
	int num = 0;
	//len 값이 null과 공백이 아니라면
	if(len != null && !"".equals(len.trim())){ // nullPointException을 피하기 위해 변수를 메서드 안에서 쓰기
	 num = Integer.parseInt(len);
	 }
%>
<!DOCTYPE html>
<style>
	td{border : 1px solid #000;}
</style>
<table>
	<tbody>
	<%
		for(int i = 0 ; i < num ; i ++){
			%>
		<tr>
			<td>안녕하세요 <%= i %></td>
		</tr>
			<%
		}
	%>

	</tbody>
</table>

Ajax Json Call

<%@ page language="java" contentType="application/json; charset=UTF-8"
    pageEncoding="UTF-8"%>
{"name":"홍길동", "age": 25, "array" : ["전주","익산"]}

브라우저에서만 이렇게 보일 뿐 통신에서는 문제 없다.


 

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript" src="./resource/js/jquery-3.4.1.min.js"></script>
<script type="text/javascript">
	$(function() {
	
		
		$('#ajaxCall').click(function() {
			var request = $.ajax({
				  url: "ajaxJsonCall.jsp", //통신 할 url
				  method: "POST", // 통신할 메서드 타입
				 // data: { len : num }, //전송할 데이터
				  dataType: "json" //전송받은 데이터를 변화시킬 컨텐츠 타입	
			});
			
			request.done(function(data) {
				if(data != undefined && data != ''){
					console.log(data);
					$('#ajaxResult').val(data.name)
				}
			});

			request.fail(function( jqXHR, textStatus ) {
			  alert( "Request failed: " + textStatus );
			});
		});
	})
</script>
<title>Insert title here</title>
</head>
<body>
<button type="button" id="ajaxCall">호출</button>
<input type="text" id="ajaxResult" readonly="readonly" placeholder="회원명">
</body>
</html>

ajaxJsonCall.jsp

<%@ page language="java" contentType="application/json; charset=UTF-8"
    pageEncoding="UTF-8"%>
{"name":"홍길동", "age": 25, "array" : ["전주","익산"]}


자바스크립트의 보안 정책

자바스크립트에서 ajax() 메서드로는 서로 다른 도메인의 데이터를 전송할 수 없고 교차 도메인을 허용하지 않는다.


gson

json구조를 띄는 직렬화된 데이터를 JAVA의 객체로 역직렬화, 직렬화 해주는 자바 라이브러리

<%@ page language="java" contentType="application/json; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ page import ="com.google.gson.Gson" %>
<%@ page import="java.util.Map" %>
<%@ page import="java.util.HashMap" %>
<%
	//Gson 인스턴스화(객체화)
	Gson gson = new Gson();

	//Map 객채화
	Map map = new HashMap();
	//put 메서드를 활용하여 값을 저장할 수 있다.
	map.put("name","홍길동");
	map.put("age",25);
	map.put("array",new String[]{"전주","익산"});

	//toJson 메서드를 활용하여 키와 값이 있는 객체를 json 방식으로 출력
	String json = gson.toJson(map);
	out.println(json);
%> 


ajaxJsonCall 실습 

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>ajax를 활용하여 아이디 중복검사</title>
<style type="text/css">
	.err{border: 1px solid #ff0000;}
	.ek{border: 1px solid #000000;}
</style>
<script type="text/javascript" src="./resource/js/jquery-3.4.1.min.js"></script>
<script type="text/javascript">
	/*  
		tlftmq3. #idCheckBtn 클릭시 #memberId 값을 가지고 
		ajaxIdCheck.jsp에 ajax를 활용하여 통신하고 아이디 중복 검사를 하여라.
		아이디가 이미 존재한다면 #memberId의 클래스를 .err로 변경하고
		존재하지 않는다면 .ok로 변경하여라.
	*/
$(function() {
	$('#idCheckBtn').click(function() {
		
		var wId = $('#memberId').val()
		
		var request = $.ajax({
			  url: "ajaxIdCheck.jsp", //통신 할 url
			  method: "POST", // 통신할 메서드 타입
			  data: { id : wId }, //전송할 데이터
			  dataType: "json" //전송받은 데이터를 변화시킬 컨텐츠 타입	
		});
		
		request.done(function(data) {
			if(data != undefined && data !='')}
				if(data.result == "Y"){
					$('#memberId').attr("class","err")
				}else if(data.result == "N"){
					$('#memberId').attr("class","ok")
				}else if(data.result == "A"){
					$('#memberId').attr("class","err")
					alert('아이디를 입력해주세요.');
				}
			}
		});

		request.fail(function( jqXHR, textStatus ) {
		  alert( "Request failed: " + textStatus );
		});
	});
})
	
</script>
</head>
<body>
	<input type="text" id="memberId" class="ok">
	<button type="button" id="idCheckBtn">아이디 중복 확인</button>
</body>
</html>
<%@ page language="java" contentType="application/json; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ page import ="com.google.gson.Gson" %>
<%@ page import="java.util.Map" %>
<%@ page import="java.util.HashMap" %>
<%
/*  
	데이타베이스에서 조회한다는 가정하에 아래 데이터나열
	(나열된 데이터는 이미 존재하는 아이디 id001, id002, id003)
*/
	//Gson 인스턴스화(객체화)
	Gson gson = new Gson();
	
	//Map 객채화
	Map map = new HashMap();

	String id = request.getParameter("id");
	

	
	if(!"".equals(id)){
		if("id001".equals(id)){
			map.put("result","Y");
		}else if("id002".equals(id)){
			map.put("result","Y");
		}else if("id003".equals(id)){
			map.put("result","Y");
		}else{
			map.put("result","N");
		}
	}else if("".equals(id) || id == null){
		map.put("result","A");
	}
	
	String result = gson.toJson(map);
	out.print(result);

%>

 

객체 편집 메서드 실습 1

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>객체 편집 메서드</title>
<script type="text/javascript" src="./resource/js/jquery-3.4.1.min.js"></script>
<script type="text/javascript">
	/*  
		실습1. #add1 선택시 addList 객체를 조회하여 1차 지역과 일치하는 2차 지역목록을 #add2에 출력하여라.
	*/
	//실제 데이터베이스에서 조회한다는 가정 하에 데이터를 정리
	var addList = {
			'전주' : ['덕진구', '완산구']
			,'군산' : ['개사길	', '거사길']
			,'익산' : ['고봉로', '고현로']			
	}
	
	//addList['']
	
/*	$(function() {
		$('#add1').change(function() {
			var a = $(this).val();
			$('#add2').find('option').remove();
			$('#add2').append('<option value=""> :: 지역을 선택해 주세요. :: </option>');
			for( var i = 0; i <addList[a].length ; i++){
			$('#add2').append('<option value="'+addList[a][i]+'">'+addList[a][i]+'</option>');
			}
		})
	})
*/
	
	$(function() {
		$('#add1').change(function() {
			var add = $(this).val();
			var addArray = addList[add];
			var html = '<option value=""> :: 2차 지역을 선택해 주세요. :: </option>';
			for( var i = 0; i < addArray.length ; i++){
			html += '<option value="'+ addArray[i] +'">'+ addArray[i]+'</option>';
			}
			$('#add2').html(html);
		})
	})
	
</script>
</head>
<body>
	<select id="add1">
		<option value=""> :: 지역 선택 :: </option>
		<option value="전주"> 전주 </option>
		<option value="군산"> 군산 </option>
		<option value="익산"> 익산 </option>
	</select>
	<select id="add2">
		<option value=""> :: 지역을 선택해 주세요. :: </option>
	</select>
</body>
</html>

객체 편집 메서드 실습 2

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>객체 편집 메서드 2</title>
<script type="text/javascript" src="./resource/js/jquery-3.4.1.min.js"></script>
<script type="text/javascript">
	/*  
		실습2. .choice1 클릭시 choice2List 객체의 키와 일치하는 교수를 #choice2Wrap에 체크박스로 뿌려주고
		#choice2Wrap 내에 생성된 교수를 클릭시 choice3List 객체를 조회하여
		해당 교수가 담당하는 교과목을  #choice3Wrap에 체크박스로 뿌려주시오.
	*/
	$(function() {
		$('.choice1').click(function () {
			console.log($(this).val(),"<--클릭선택value");
			var val = $(this).val();
			var array = choice2List[val];
			console.log( array ,"<--교수");
			var html = '';
			for(var i = 0 ; i <array.length ; i++){
				console.log(array[i]);
				html += '<label><input type="checkbox" class="choice2" name="choice2" value ="' +array[i]+'">'+array[i]+'</label>'
			}
			$('#choice2Wrap').html(html);
		})
	})
	//.choice2 동적 바인딩
	$(document).on('click','.choice2', function(){
		var html = '';
		$('.choice2:checked').each(function() {
			var choice = $(this).val();
			console.log(choice, '교수선택')
			var array =  choice3List[choice];
			for(var i=0; i <array.length; i++){
				html += '<label><input type="checkbox" class="choice3" name="choice3" value ="' +array[i]+'">'+array[i]+'</label>'
			}		
		})
		$('#choice3Wrap').html(html);
	})
		
	var choice2List = {
			'9' : ['9급 홍길동', '9급 고길동']
			,'7' : ['7급 이순신', '7급 유관순']
	}
	var choice3List = {
			'9급 홍길동' : ['국어', '영어']
			,'9급 고길동' : ['국사', '토익']
			,'7급 이순신' : ['과학', '국사']
			,'7급 유관순' : ['수학', '일어']
	}
</script>
</head>
<body>


	<div>
		<h1>급수 선택</h1>
		<label>
			<input type="radio" name="choice1" class="choice1" value="9"> 9급
		</label>
		<label>
			<input type="radio" name="choice1" class="choice1" value="7"> 7급
		</label>
	</div>
	<div>
		<h1>교수 선택</h1>
		<div id="choice2Wrap"></div>
	</div>
	<div>
		<h1>과목 선택</h1>
		<div id="choice3Wrap"></div>
	</div>
	
</body>
</html>

제이쿼리 객체 탐색기 및 탐색기 메서드 활용 실습

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>제이쿼리 객체 탐색기 및 탐색기 메서드 활용</title>
<script type="text/javascript" src="./resource/js/jquery-3.4.1.min.js"></script>
<script type="text/javascript">
	/*
		실습1. 아래의 html 객체들이 있다.  
		#sum 버튼 클릭시 .num의 값을 가지고와 합산하고
		그 결과값을 #text에 삽입하여라.
		(.del 클릭시 .num-wrap 가 제거 되어야함)
		-- 추가 설명 메서드
		객체.val() <-- value라는 속성을 가진 html 객체의 값을 가지고 오거나 삽입한다.
		객체.text() <-- 선택된 객체의 텍스트 요소를 가지고 오거나 삽입한다.
	*/
	
$(function(){
		
		//input box 에 숫자만 입력되도록 하는 jquery
		$('input').keyup(function(){
			var inputVal = $(this).val();
			$(this).val(inputVal.replace(/[^0-9]/gi,'')); //정규식
		})
	
	    $('#sum').click(function(){
	    	var sig = 0;
	    	$('.num').each(function(){
	    		if($(this).val() == ''){
	    		}else{
	    			sig += parseInt($(this).val());
	    			/* Number함수 : 값이 없을 경우 0 반환 
	    			parseInt : 값이 없을 경우 NaN, undefined 반환 */
	    		}
	        })
	        $('#text').text(sig);
	    })
        
	    $('.del').click(function(){
	       	$(this).parents('.num-wrap').remove();
	    })
	    	    
	})
	

</script>
</head>
<body>
	<div class="num-wrap">
		<input type="text" class="num"> 
		<button type="button" class="del">제거</button>
	</div>
	<div class="num-wrap">
		<input type="text" class="num"> 
		<button type="button" class="del">제거</button>
	</div>
	<div class="num-wrap">
		<input type="text" class="num"> 
		<button type="button" class="del">제거</button>
	</div>
	<h1>
		계산결과
	</h1>
	<div id="text"> 계산하기를 클릭해주세요.</div>
	<button type="button" id="sum">계산하기</button>
</body>
</html>

https://tyson.tistory.com/119


속성 조작 메서드

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="./resource/js/jquery-3.4.1.min.js"></script>
<script type="text/javascript">
	/*  
		<속성 조작 메서드>
		 :	선택된 객체의 속성값을 가지고 오거나 변경이 가능한 메서드
		 
		<Parsing> ((cf. 형변환)) 
		 :	서로 다른 데이터를 변환하는 작업
		 	- parser :	서로 다른 테이터를 변환하는 대상 혹은 도구 (플러그인, api(메서드)) 
		 
			1)	$('선택자').html()
				 :	선택된 객체의 html요소를 가지고 오거나 삽입
				ex)	$('body').html();	선택된 객체의 자식 html 요소 가지고 오기
					$('body').html('<h1>안녕하세요</h1>');	선택된 객체에 값 삽입
			
			2) 	$('선택자').text()
				 :	선택된 객체의 하위 요소의 text를 가지고 오거나 삽입
				ex)	$('body').text();	body의 하위 텍스트 전체 가지고 오기
					$('body').text('안녕하세요');	body의 하위 텍스트 전체 가지고 오기
					
		***	3)	$('선택자').attr()
				 :	선택된 객체의 속성을 가지고 오거나 삽입한다.
				 	웹표준에 존재하지 않는 속성도 삽입하거나 가지고 올 수 있다.
				ex) $('body').attr('myName');	body에 myName 이라는 속성의 값을 가지고 온다.
				 	 $('body').attr('myName', '홍길동');	body에 myName 이라는 속성을 생성하고 속성 myName의 값으로 홍길동을 삽입한다.

			4)	$('선택자').removeAttr('속성명')
				 :	선택된 객체의 인수값에 해당되는 속성을 제거한다.
				ex) $('body').removeAttr('myName'); body에 myName이라는 속성을 제거
				 	 
			5)	$('선택자').prop()
				 :	선택된 객체의 상태속성을 확인하거나 변경한다. ('checked', 'selected', 'hidden' 등)
				ex) $('body').prop('hidden', true); body 태그의 상태를 hidden으로 변경
				 	 $('body').prop('hidden', false); body 태그의 상태를 hidden 해제
				 	 $('body').prop('hidden'); body 태그의 상태 중 hidden의 상태값을 true / false로 가지고 온다.
				 
			6)	$('선택자').val() 
				 :	선택된 객체의 value 속성값을 가지고 오거나 변경한다.
				ex) $('input').val(); input 태그의 value속성의 값을 가지고 온다.
				 	 $('input').val('홍길동'); input 태그의 value속성의 값을 '홍길동'으로 변경한다.
			
	 	 	7)	$('선택자').css()
	 	 		 :	선택된 객체의 css 속성을 적용 혹은 값을 가지고 온다.
	 	 		ex) $('body').css('border', '1px solid #ff0000'); body에 border라는 css속성 1px solid #ff0099을 적용
	 	 		 	 $('body').css('border'); body에 적용된 css속성 border 값을 가지고 오기
	 	 		 	 
	 	 		ex2) 다중으로 css 속성 적용하기
	 	 		 		$('body').css({
	 	 		 			'border':'1px solid #ff0000',
	 	 		 			'padding':'5px'	
	 	 		 		})	
	 	 		 	 
	 	 	8)	$('선택자').addClass('클래스명')
	 	 		 :	선택된 객체에 클래스를 추가 삽입
	 	 		ex) $('body').addClass('syntaxhighlighter'); body에 클래스 속성의 값에 syntaxhighlighter를 추가한다.
	 	 		 
 	 		9)	$('선택자').removeClass('클래스명')
 	 			 :	선택된 객체에 인수값에 해당하는 클래스를 제거
 	 			ex) $('body').removeClass('syntaxhighlighter'); body의 클래스 속성에  syntaxhighlighter 값이 있다면 syntaxhighlighter 제거
 	 			
 	 		10)	$('선택자').('클래스명')
 	 			 :	
 	 			ex)
 	 				 
	*/
</script>
</head>
<body>

</body>
</html>

속성 조작 메서드 실습 css, addClass, removeClass

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>속성 조작 메서드 실습 css, addClass, removeClass</title>
<script type="text/javascript" src="./resource/js/jquery-3.4.1.min.js"></script>
<script type="text/javascript">
	$(function(){
		$('#bodyBorderChange').click(function(){
			if($('body').is('.r-border')){
				$('body').removeClass('r-border').addClass('b-border');
			} else {
				$('body').removeClass('b-border').addClass('r-border');
			}
		})
	})
</script>

<style type="text/css">
	.r-border{
		border: 1px solid #ff0000; 	
	}
	.b-border{
		border: 1px solid #0000ff;
	}
	</style>
</head>
<body class="r-border">
	<!--
		실습3. #bodyBorderChange 클릭시 .r-border와 .b-border가 토글되게 하라.
		addClass, removeClass, is, attr
		(is 메서드는 상태속성 및 아이디, 클래스를 확인할 수 있다. ex) $('body').is('.r-border'); >> true/false )
	  -->
	<button type="button" id="bodyBorderChange">바디 보더 변경</button>
</body>
</html>

제이쿼리 css 메서드 활용 실습

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>제이쿼리 css 메서드 활용</title>
<style type="text/css">
	body{padding: 0;}
	ul{padding: 10px; margin: 0;}
	ul, li{list-style-type: none;}
	li{width: 100px; height: 100px; border: 1px dashed #000; padding: 1px; margin: 0;}
</style>
<script type="text/javascript" src="./resource/js/jquery-3.4.1.min.js"></script>
<script type="text/javascript">
	/*
		실습4. #alignStart 버튼 클릭시 li테그를 왼쪽 정렬되게 하여라.
		(row 형태로 존재하는 li를 col 형태로 재정렬)
	*/
	
	$(function(){
		$('#alignStart').click(function(){
			$('li').css('float','left')
		})
	})
</script>
</head>
<body>
	<ul>
		<li>1</li>
		<li>2</li>
		<li>3</li>
		<li>4</li>
	</ul>
	<button type="button" id="alignStart">정렬하기</button>
</body>
</html>

 


객체 편집 메서드

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>객체 편집 메서드</title>
<script type="text/javascript" src="./resource/js/jquery-3.4.1.min.js"></script>
<script type="text/javascript">
	/*  
		<객체 편집 메서드>
		 : 선택한 객체의 옵션 (메서드에 위치 옵션 포함) 위치에 html 요소를 삽입
		 
		 1)	$('선택자').before('html 요소')
		 	 :	선택한 대상의 이전 위치에 html 삽입
	
		2) 	$('선택자').after('html 요소')
		 	 :	선택한 대상의 이전 위치에 html 삽입
			
	***	3)	$('선택자').append('html 요소')	
			 :	선택한 대상의 자식요소 제일 끝에 html 삽입
			
	***	4)	$('선택자').prepend('html 요소')	
			 :	선택한 대상의 자식요소 제일 처음에 html 삽입

		5) 	$('선택자').clone()
	 	 :	선택한 대상을 복제한다.
	 	 
	*/
	
	$(function(){
		$('#beforeAfterBtn').click(function(){
			$('#center').before('<div>이전</div>')
			$('#center').after('<div>다음</div>')
		})
		
		$('#appendBtn').click(function(){
			var len = $('#addTr').find('tr').length;
			$('#addTr').append('<tr><td> 마지막' + len + ' </td></tr>')
		})
		$('#prependBtn').click(function(){
			var len = $('#addTr').find('tr').length;
			$('#addTr').prepend('<tr><td> 처음' + len + ' </td></tr>')
		})
		
		$('#cloneBtn').click(function(){
			//clone 변수에 #cloneTarget을 복제한다.
			var clone = $('#cloneTarget').clone();
			console.log(clone,'<<clone');
			//clone() 메서드로 복제시 clone변수에 담긴 객체를 조회할 수 있다.
			clone.find('h2').text('안녕하세요2');
			console.log(clone.html(),'<<clone.html()')
			$('#cloneCopy').html(clone.html());
		})
	})
</script>
</head>
<body>
	<h1> before after </h1>
	<div id="center">
		중앙
	</div>
	<button type="button" id="beforeAfterBtn">다음과 이전 html 삽입</button>
	
	<h1> append prepend</h1>
	<table>
		<tbody id="addTr">
			<tr><td> 중앙 </td></tr>
		</tbody>
	</table>
	<button type="button" id="appendBtn">append</button>
	<button type="button" id="prependBtn">prepend</button>
	
	<div id="cloneTarget">
		<h2>안녕하세요.</h2>
	</div>
	<div id="cloneCopy"></div>
	<button type="button" id="cloneBtn">복제</button>
	
</body>
</html>

동적바인딩

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>동적 바인딩</title>
<script type="text/javascript" src="./resource/js/jquery-3.4.1.min.js"></script>
<script type="text/javascript">
	/*
		<동적 바인딩>
		 :	html 실행 순서에 따라 dom 객체가 생성되기 때문에 이벤트 실행 완료 이후에 생성되는 html 에는 이벤트를 걸 수 없다.
		 	때문에 동적으로 이벤트를 걸거나 객체 생성시에  이벤트를 걸어야 한다. 
	*/

 		$(document).on('click','.add',function() {
			var clone = $(this).parent().clone();
			$('body').append(clone);
		})
		$(document).on('click','.del',function() {
			$(this).parent().remove();
		})
	
</script>
</head>
<body>
	<div class="btn-wrap">
		<button type="button" class="add">생성</button>
		<button type="button" class="del">제거</button>
	</div>
</body>
</html>

객체 조작 메서드 활용 실습

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>객체 조작 메서드 활용 실습</title>
<script type="text/javascript" src="./resource/js/jquery-3.4.1.min.js"></script>
<script type="text/javascript">
	/*  
		실습5. .file-add 클릭시 파일을 더 추가할 수 있는 폼을 추가하고 .file-del 클릭시 파일을 첨부할 수 있는 폼을 제거하여라.
			파일 추가 최대 갯수는 5개이고 1개 최소 1개는 존재해야한다. 
	*/
	
	$(document).on('click','.file-add',function(){
		console.log($('.file-add').parent().length)
		if($('.file-add').parent().length <= 5){
		var clone = $(this).parent().clone();
		$('#file-warp').append(clone);
		}
	})
	$(document).on('click','.file-del',function(){
		console.log($('.file-del').parent().length)
		if($('.file-del').parent().length > 1){
	
		$(this).parent().remove();
		}
	})
	
	
</script>
</head>
<body>
	<div id="file-warp">
		<div class="file-group">
			<input type="file">
			<button type="button" class="file-add">파일 추가</button>
			<button type="button" class="file-del">파일 제거</button>
		</div>
	
	</div>

</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>객체 조작 메서드 활용 실습</title>
<script type="text/javascript" src="./resource/js/jquery-3.4.1.min.js"></script>
<script type="text/javascript">
	/*  
		실습5. .file-add 클릭시 파일을 더 추가할 수 있는 폼을 추가하고 .file-del 클릭시 파일을 첨부할 수 있는 폼을 제거하여라.
			파일 추가 최대 갯수는 5개이고 1개 최소 1개는 존재해야한다. 
	*/
	
	$(document).on('click','.file-add',function(){
		var len = $('.file-group').length;
        if(len<5){
          var clone = $(this).parent().clone();
          clone.find('input').val('');
          $('#file-warp').append(clone);
        } else {
        	alert('더 이상 추가할 수 없습니다.')
        }
	})
	$(document).on('click','.file-del',function(){
    	var len = $('.file-group').length;
        if(len>1){
		$(this).parent().remove();
        } else {
        	alert('더 이상 삭제할 수 없습니다.')
        }
	})
	
	
</script>
</head>
<body>
	<div id="file-warp">
		<div class="file-group">
			<input type="file">
			<button type="button" class="file-add">파일 추가</button>
			<button type="button" class="file-del">파일 제거</button>
		</div>
	
	</div>

</body>
</html>

 

<%@ page language="java" contentType="text/html; charset=EUC-KR"
    pageEncoding="EUC-KR"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=EUC-KR">
<title>Insert title here</title>
<link rel="stylesheet" type="text/css" href="<%= request.getContextPath() %>/css/main.css" />
</head>
<body>
<%@ include file="/module/top.jsp" %>
<%@ include file="/module/left.jsp" %>
작업했던 처리과정 파일들의 상단 하단에 layout 코드 삽입
<%@ include file="/module/hadan.jsp" %>
</body>
</html>


로그인 process를 db와 연결하기

<%@ page language="java" contentType="text/html; charset=EUC-KR"
    pageEncoding="EUC-KR"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%
String id = request.getParameter("id");
String pw = request.getParameter("pw");
System.out.println(id + "<- id");
System.out.println(pw + "<- pw");
String dbid = "id001";
String dbpw = "pw001";
String dblevel = "관리자";	//관리자 또는 판매자 또는 구매자 변경해서 테스트
String dbname = "김길동";
String alert = null;
if(id.equals(dbid)){
	System.out.println("01 아이디 일치 조건");
	if(pw.equals(dbpw)){
		System.out.println("03 로그인성공 조건");	
		//response.sendRedirect(request.getContextPath() + "/index.jsp");
		session.setAttribute("S_LEVEL", dblevel);
		session.setAttribute("S_NAME", dbname);
		alert = "로그인성공";
	}else{
		System.out.println("04 비번 불일치 조건");	
		alert = "비번 불일치";
	}
}else{
	System.out.println("02 아이디 불일치 조건");
	alert = "아이디 불일치";
}
%>
<script type="text/javascript">
	alert('<%= alert %>');
	location.href='<%= request.getContextPath()%>/index.jsp';
</script>

<%@ page language="java" contentType="text/html; charset=EUC-KR"
    pageEncoding="EUC-KR"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@ page import = "java.sql.DriverManager" %>
<%@ page import = "java.sql.Connection" %>
<%@ page import = "java.sql.PreparedStatement" %>
<%@ page import = "java.sql.ResultSet" %>
<%@ page import = "java.sql.SQLException" %>

<%
String id = request.getParameter("id");
String pw = request.getParameter("pw");
System.out.println(id + "<- id");
System.out.println(pw + "<- pw");

String dbid = null;
String dbpw = null;
String dblevel = null;
String dbname = null;
String alert = null;

Connection conn = null;
PreparedStatement pstmt = null;
ResultSet rs = null;

Class.forName("com.mysql.jdbc.Driver");
try{
	String jdbcDriver = "jdbc:mysql://localhost:3306/dev35db?" +
			"useUnicode=true&characterEncoding=euckr";
	String dbUser = "dev35id";
	String dbPass = "dev35pw";
	conn = DriverManager.getConnection(jdbcDriver, dbUser, dbPass);
	System.out.println(conn + "<-- conn");
	pstmt = conn.prepareStatement("select * from tb_member WHERE m_id = ?");
	pstmt.setString(1, id);
	System.out.println(pstmt + "<-- pstmt");
	rs = pstmt.executeQuery();
	System.out.println(rs + "<-- rs");
	if(rs.next()){
		System.out.println("if 조건문 통과-------------");
		System.out.println("01 아이디 일치 조건");
		
		dbid = rs.getString("m_id");
		dbpw = rs.getString("m_pw");
		dblevel = rs.getString("m_level");
		dbname = rs.getString("m_name");
		System.out.println(dbid + "<- dbid");
		System.out.println(dbpw + "<- dbpw");
		System.out.println(dblevel + "<- dblevel");
		System.out.println(dbname + "<- dbname");
			
			if(pw.equals(dbpw)){
				System.out.println("03 로그인성공 조건");	
				//response.sendRedirect(request.getContextPath() + "/index.jsp");
				session.setAttribute("S_LEVEL", dblevel);
				session.setAttribute("S_NAME", dbname);
				alert = "로그인성공";
			}else{
				System.out.println("04 비번 불일치 조건");	
				alert = "비번 불일치";
			}
	}else{
			System.out.println("02 아이디 불일치 조건");
			alert = "아이디 불일치";
	}
} catch(SQLException ex) {
	System.out.println(ex.getMessage());
	ex.printStackTrace();
} finally {
	if (rs != null) try { rs.close(); } catch(SQLException ex) {}
	if (pstmt != null) try { pstmt.close(); } catch(SQLException ex) {}
	if (conn != null) try { conn.close(); } catch(SQLException ex) {}
}



%>
<script type="text/javascript">
	alert('<%= alert %>');
	location.href='<%= request.getContextPath()%>/index.jsp';
</script>

db tb_member에 입력된 datas

로그인시 db data가 출력됨 / 로그인 실패시에 alert도 잘 뜸

'JSP' 카테고리의 다른 글

jsp,mysql,java  (0) 2020.04.09
[JSP + MySQL]  (0) 2020.04.02
[JSP + MySQL] 검색  (0) 2020.03.27
[JSP + MySQL] PreparedStatement vs. Statement / Execute vs. ExecuteQuery vs. ExecuteUpdate  (0) 2020.03.26

검색조건 (select 쿼리문) >>>>> 검색결과 

-다양한 경우의 수 존재


m_search_form.jsp에 검색 화면을 생성

<%@ page language="java" contentType="text/html; charset=EUC-KR"
    pageEncoding="EUC-KR"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<form action="<%=request.getContextPath()%>/msearch/m_search_list.jsp" method="post">
	<select name="sk"> <!-- sk=m_id & sv=입력한값  -->
		<option value = "m_id">아이디</option>
		<option value = "m_level">권한</option>
		<option value = "m_name">이름</option>
		<option value = "m_email">이메일</option>
	</select>
	<input type="text" name="sv">
	<input type="submit" name="검색버튼">
</form>


m_search_list.jsp에 변수 sk / sv를 

<%@ page language="java" contentType="text/html; charset=EUC-KR"
    pageEncoding="EUC-KR"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<%@ include file = "/msearch/m_search_form.jsp"  %>

<% 
request.setCharacterEncoding("euc-kr");
String sk = request.getParameter("sk");
String sv = request.getParameter("sv");
System.out.println(sk + "<-sk");
System.out.println(sv + "<-sv");
%>

 


<%@ page language="java" contentType="text/html; charset=EUC-KR"
    pageEncoding="EUC-KR"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<%@ include file = "/msearch/m_search_form.jsp"  %>

<% 
request.setCharacterEncoding("euc-kr");
String sk = request.getParameter("sk");
String sv = request.getParameter("sv");
System.out.println(sk + "<-sk");
System.out.println(sv + "<-sv");

if(sk == null && sv == null){
	System.out.println("1-1 sk, sv 둘 다 null");
} else if (sk != null & sv.equals("")){
	System.out.println("1-2 sk O / sv 공백");
} else if (sk != null & sv != null){
	System.out.println("1-3 sk, sv 둘 다 있음");
}

%>


<%@ page language="java" contentType="text/html; charset=EUC-KR"
    pageEncoding="EUC-KR"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@ page import = "java.sql.DriverManager" %>
<%@ page import = "java.sql.Connection" %>
<%@ page import = "java.sql.PreparedStatement" %>
<%@ page import = "java.sql.ResultSet" %>
<%@ page import = "java.sql.SQLException" %>

<a href="<%= request.getContextPath() %>/minsert/m_insert_form.jsp">회원가입버튼</a><br><br>

<%@ include file="/msearch/m_search_form.jsp" %>

<br>
회원 리스트 <br>
<table width="100%" border="1">
<tr>
	<td>아이디</td><td>비번</td><td>권한</td><td>이름</td><td>이메일</td><td>수정</td><td>삭제</td>
</tr>
<%
request.setCharacterEncoding("euc-kr");
String sk = request.getParameter("sk");
String sv = request.getParameter("sv");
System.out.println(sk + "<-- sk ");
System.out.println(sv + "<-- sv ");

Connection conn = null;
PreparedStatement pstmt = null;
ResultSet rs = null;

Class.forName("com.mysql.jdbc.Driver");
try{
	String jdbcDriver = "jdbc:mysql://localhost:3306/dev35db?" +
			"useUnicode=true&characterEncoding=euckr";
	String dbUser = "dev35id";
	String dbPass = "dev35pw";
	conn = DriverManager.getConnection(jdbcDriver, dbUser, dbPass);
	System.out.println(conn + "<-- conn m_list.jsp");
	String selectQuery = "select * from tb_member";
	if(sk == null & sv == null){
		System.out.println("01_01 둘다 null 조건");
		pstmt = conn.prepareStatement(selectQuery);
	}else if(sk != null & sv.equals("")){
		System.out.println("01_02 sk있고 sv는 공백 조건");
		pstmt = conn.prepareStatement(selectQuery);
	}else if(sk != null & sv != null){
		System.out.println("01_03 sk있고 sv있는 조건");
		pstmt = conn.prepareStatement(selectQuery + " WHERE " + sk + " = ?");
		pstmt.setString(1, sv);
	}
	
	out.println(pstmt + " <br><br>");
	
	System.out.println(pstmt + "<-- pstmt m_list.jsp");
	rs = pstmt.executeQuery();
	System.out.println(rs + "<-- rs m_list.jsp");
	//System.out.println(rs.next() + "<-- rs.next() m_list.jsp");
	//if(rs.next()){
	while(rs.next()){		
		System.out.println("while 조건문 통과완료");
%>
<tr>
	<td> <%= rs.getString("m_id")%>	</td>
	<td> <%= rs.getString("m_pw")%>	</td>
	<td> <%= rs.getString("m_level")%>	</td>
	<td> <%= rs.getString("m_name")%>	</td>
	<td> <%= rs.getString("m_email")%>	</td>
	<td>
<a href="<%= request.getContextPath() %>/mupdate/m_update_form.jsp?send_id=<%= rs.getString("m_id")%>">수정버튼</a>
	<!-- http://localhost:8007/mysqljsp35/mupdate/m_update_form.jsp?send_id=id005 -->
	</td>
	<td>
<a href="<%= request.getContextPath() %>/mdelete/m_delete_pro.jsp?send_id=<%= rs.getString("m_id")%>">삭제버튼</a>
	</td>	
	
</tr>	
<%		
	}
} catch(SQLException ex) {
	System.out.println(ex.getMessage());
	ex.printStackTrace();
} finally {
	if (rs != null) try { rs.close(); } catch(SQLException ex) {}
	if (pstmt != null) try { pstmt.close(); } catch(SQLException ex) {}
	if (conn != null) try { conn.close(); } catch(SQLException ex) {}
}
%>
</table>

 

pstmt = conn.prepareStatement("SELECT * FROM tb_member WHERE ? = ?");
pstmt.setString(1, sk);
pstmt.setString(2, sv);

 

 

 

conn.prepareStatement 메서드에 쿼리문을 위 처럼 설정했을 경우

쿼리문장이 ex) SELECT * FROM tb_member WHERE 'm_id' = 'id' 이렇게 입력되어 오류가 발생한다.

"select * from tb_member where "+ sk + "= ? "

때문에 위와 같이 문자열 연결 연산자를 통해 sk를 연결해주었다.


검색이 잘 된다!

 

'JSP' 카테고리의 다른 글

[JSP + MySQL] Layout과 처리화면에 함께 출력하기  (0) 2020.03.27
[JSP + MySQL] 검색  (0) 2020.03.27
[JSP + MySQL] 수정처리 / 삭제  (0) 2020.03.26
[JSP + MySQL] list 화면→수정화면  (0) 2020.03.26

+ Recent posts