본문 바로가기
CLASS/JQUERY

#5 / 회원가입 data mysql로 전달

by hingu 2024. 6. 14.

1.약관.html

-> 2. Backend

-> 3. 회원가입.jsp(or .do) 

-> 4. Backend

-> 5. Database 저장

=> 회원가입 페이지는 post로 data 전송!! (get은 보안 포기)

 

⚡ step1 (agree.html)
 
<body>
	<form id="frm">
		<p>약관동의</p>
		<label><input type="checkbox" id="all">전체선택</label><br>
		<div id="box">
			<label><input type="checkbox" id="agree1" name="ag1" class="agr1 agrees" value="Y">(필수)이용약관</label><br>
			<label><input type="checkbox" id="agree2" name="ag2" class="agr2 agrees" value="Y">(필수)개인정보 수집 및 이용</label><br><br>
		</div>
		<input type="button" value="다음단계" id="btn">
	</form>
</body>

<script type="text/javascript">
	$(()=>{
		var $count=0;
		$("#btn").click(function(){
			var $ag1 = $("#agree1").is(":checked");
			var $ag2 = $("#agree2").is(":checked");
			if($ag1==false || $ag2==false){
				alert("약관에 모두 동의하셔야 회원가입이 진행됩니다.")
			}else{
				$("#frm").attr("method","post");
				$("#frm").attr("action","./member_ship.do");
				$("#frm").submit();
			}
		});
		
		//attr : attribute (소스의 속성을 수정)
		//prop : 브라우저의 메모리 영역 파트를 변경
		$("#all").click(function(){
			var $all = $(this).is(":checked");
			$("#agree1").prop("checked",$all);
			$("#agree2").prop("checked",$all);
			if($all == true){
				$count = 2;	
			}else{
				$count = 0;
			}
		})
		
		$("#box .agrees").click(function(){
			var $node = $(".agrees").index(this);
			var $ag = $(".agrees").eq($node).is(":checked");
			if($ag == false){
				$count--;
			}else{
				$count++;	
			}
			if($count == 2){
				$("#all").prop("checked",true);
			}else{
				$("#all").prop("checked",false);
			}
		})
		
	})
</script>


🔽 backend로 전달 (member_ship.java) 
member_ship.jsp에 step2 html 코드 복붙 후 핸들링

 

⚡ member_ship.java (servlet)
 
public class member_ship extends HttpServlet {
	private static final long serialVersionUID = 1L;

	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		String ag1 = request.getParameter("ag1");
		String ag2 = request.getParameter("ag2");
		
		request.setAttribute("ag1", ag1);
		request.setAttribute("ag2", ag2);
		
		RequestDispatcher rd = request.getRequestDispatcher("./member_ship.jsp");
		rd.forward(request, response);
	}

}

※ Attribute("가상의 변수명" , 실제값)
※ RequestDispatcher : 외부에 있는 jsp파일을 로드할 때 사용

🔽 servlet => jsp 전달 (step1에서 받은 value값)

-jsp 
jsp파일에 java코드 넣음

<input type="hidden" name="ag1" value="<%=request.getAttribute("ag1")%>">
<input type="hidden" name="ag2" value="<%=request.getAttribute("ag2")%>">

 이거랑 step2에서 받은 input value값 다 보냄 (step2 jsp파일 생략)

 

🔽 

⚡ member_ok.java
 
public class member_ok extends HttpServlet {
	private static final long serialVersionUID = 1L;
	PrintWriter pw = null;
	
	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		response.setContentType("text/html;charset=utf-8");
		request.setCharacterEncoding("utf-8");
		this.pw = response.getWriter();
		
		String ag1 = request.getParameter("ag1");
		String ag2 = request.getParameter("ag2");
		
		String mid = request.getParameter("mid");
		String mpw = request.getParameter("mpw");
		String mname = request.getParameter("mname");
		String memail = request.getParameter("memail");
		String mhp = request.getParameter("mhp");
		
		String evtagree1 = ""; //정보수신동의
		if(request.getParameter("evtagree1") == null) {
			evtagree1 = "N";
		}else {
			evtagree1 = request.getParameter("evtagree1");
		}
		
		String evtagree2 = ""; //SMS수신동의 
		if(request.getParameter("evtagree2") == null) {
			evtagree2 = "N";
		}else {
			evtagree2 = request.getParameter("evtagree2");
		}
		
		String mtel = request.getParameter("mtel");
		
		String addr_post = request.getParameter("addr_post");
		String addr = request.getParameter("addr");
		String addr2 = request.getParameter("addr2");
		
		//db연결
		try {
			dbinfo db = new dbinfo();
			Connection ct = db.getConnection();
			//System.out.println("정상적으로 DB 연결 완료!!");
			
			String sql = "insert into easy_member "
					+ "(no,agree1,agree2,mid,mpass,mname,memail,mhp,evtagree1,evtagree2,mtel,post,adress1,adress2,mdate)"
					+ " values ('0',?,?,?,?,?,?,?,?,?,?,?,?,?,now())";
			PreparedStatement ps = ct.prepareStatement(sql);
			ps.setString(1,ag1);
			ps.setString(2,ag2);
			ps.setString(3,mid);
			ps.setString(4,mpw);
			ps.setString(5,mname);
			ps.setString(6,memail);
			ps.setString(7,mhp);
			ps.setString(8,evtagree1);
			ps.setString(9,evtagree2);
			ps.setString(10,mtel);
			ps.setString(11,addr_post);
			ps.setString(12,addr);
			ps.setString(13,addr2);
			int result = ps.executeUpdate();
			
			
			if(result > 0) {
				pw.write("<script>alert('정상적으로 회원가입이 완료 되었습니다');"
						+ "location.href='./agree.html';"
						+ "</script>");
			}
			ct.close();
		}catch(SQLIntegrityConstraintViolationException se) {
			pw.write("<script>alert('아이디 및 데이터 정보 오류로 인하여 가입이 취소 되었습니다.');"
					+ "location.href='./agree.html';"
					+ "</script>");
		}
		catch(Exception e) {
			e.printStackTrace();
			System.out.println("database의 접속 오류가 발생했습니다!");
		}finally {
			pw.close();
		}
		
	}

}

 

🔽

mysql 데이터 입력 확인

 

'CLASS > JQUERY' 카테고리의 다른 글

jquery ui  (0) 2024.06.20
#4-1 / jquery 이용 룰렛 제작  (0) 2024.06.13
#3-2 / backend-data(배열) ▶ jquery를 이용한 배열 출력  (1) 2024.06.12
#3-1 / jquery이용한 form + submit  (0) 2024.06.12
#2 / jquery checkbox  (0) 2024.06.12

관련글

티스토리툴바