[Web_JSP] 09

실습(MVC)

- [Web_JSP] 08 이어서

7. web.xml

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://xmlns.jcp.org/xml/ns/javaee" xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd" id="WebApp_ID" version="4.0">
  <display-name>day06</display-name>
  <welcome-file-list>
    <welcome-file>index.html</welcome-file>
    <welcome-file>index.htm</welcome-file>
    <welcome-file>index.jsp</welcome-file>
    <welcome-file>default.html</welcome-file>
    <welcome-file>default.htm</welcome-file>
    <welcome-file>default.jsp</welcome-file>
  </welcome-file-list> 
  
  <servlet>
  	<servlet-name>MemberFrontController</servlet-name>
  	<servlet-class>com.member.MemberFrontController</servlet-class>
  </servlet>
  
  <servlet-mapping>
  	<servlet-name>MemberFrontController</servlet-name>
  	<url-pattern>*.me</url-pattern>
  </servlet-mapping>
  
</web-app>

8. Action.java

package com.member.action;

import java.io.IOException;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

public interface Action {
	public ActionInfo execute(HttpServletRequest req, HttpServletResponse resp) throws IOException;
}

9. MemberJoinOk.java

package com.member;

import java.io.IOException;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import com.member.action.Action;
import com.member.action.ActionInfo;
import com.member.domain.dao.MemberDAO;
import com.member.domain.vo.MemberVO;

public class MemberJoinOk implements Action{
	
	@Override
	public ActionInfo execute(HttpServletRequest req, HttpServletResponse resp) throws IOException{
		req.setCharacterEncoding("UTF-8");
		ActionInfo actionInfo = new ActionInfo();
		MemberVO memberVO = new MemberVO(); 
		MemberDAO memberDAO = new MemberDAO();
		
		memberVO.setMemberId(req.getParameter("memberId"));
		memberVO.setMemberName(req.getParameter("memberName"));
		memberVO.setMemberPw(req.getParameter("memberPw"));
		memberVO.setMemberGender(req.getParameter("memberGender"));
		memberVO.setMemberAddress(req.getParameter("memberAddress"));
		memberVO.setMemberAddressDetail(req.getParameter("memberAddressDetail"));

		memberDAO.join(memberVO);
		
		req.setAttribute("memberName", memberVO.getMemberName());
		
		actionInfo.setRedirect(false);
		actionInfo.setPath("/joinSuccess.jsp");
		
		return actionInfo;
	}
}

10. MemberDAO.java

package com.member.domain.dao;

import org.apache.ibatis.session.SqlSession;
import org.apache.ibatis.session.SqlSessionFactory;

import com.member.domain.vo.MemberVO;
import com.mybatis.config.MyBatisConfig;

public class MemberDAO { 
	SqlSessionFactory sqlSessionFactory = MyBatisConfig.getSqlSessionFactory();
	SqlSession sqlSession;
	
	public MemberDAO() {
		sqlSession = sqlSessionFactory.openSession(true);
	}
	
	//회원가입
	public void join(MemberVO memberVO) {
		sqlSession.insert("Member.join", memberVO);
	}
}

11. join.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>회원가입</title>
</head>
<body>
	<section>
		<form action="" name="joinForm" method="post">
			<p>
				<label>
					아이디 : <input type="text" name="memberId">
				</label>
			</p>
			<p>
				<label>
					이름 : <input type="text" name="memberName">
				</label>
			</p>
			<p>
				<label>
					비밀번호 : <input type="password" name="memberPw">
				</label>
			</p>
			<p>
				<label>
					비밀번호 확인 : <input type="password" id="memberPw">
				</label>
			</p>
			<p>
				성별 : 
				<label>
					남자 <input type="radio" name="memberGender" value="M">
				</label>
				<label>
					여자 <input type="radio" name="memberGender" value="W">
				</label>
				<label>
					선택안함 <input type="radio" name="memberGender" value="N">
				</label>
			</p>
			<p>
				<input type="text" id="sample5_address" placeholder="주소" name="memberAddress">
				<input type="button" onclick="sample5_execDaumPostcode()" value="주소 검색"><br>
				<input type="text" name="memberAddressDetail" placeholder="상세 주소">
				<div id="map" style="width:300px;height:300px;margin-top:10px;display:none"></div>
			</p>
			<p>
				<input type="button" value="가입 완료" onclick="join()">
			</p>
		</form>
	</section>
</body>
<script src="//t1.daumcdn.net/mapjsapi/bundle/postcode/prod/postcode.v2.js"></script>
<script src="//dapi.kakao.com/v2/maps/sdk.js?appkey=37a9abf54fb9bec320d474d06c964451&libraries=services"></script>
<script>
    var mapContainer = document.getElementById('map'), // 지도를 표시할 div
        mapOption = {
            center: new daum.maps.LatLng(37.537187, 127.005476), // 지도의 중심좌표
            level: 5 // 지도의 확대 레벨
        };

    //지도를 미리 생성
    var map = new daum.maps.Map(mapContainer, mapOption);
    //주소-좌표 변환 객체를 생성
    var geocoder = new daum.maps.services.Geocoder();
    //마커를 미리 생성
    var marker = new daum.maps.Marker({
        position: new daum.maps.LatLng(37.537187, 127.005476),
        map: map
    });


    function sample5_execDaumPostcode() {
        new daum.Postcode({
            oncomplete: function(data) {
                var addr = data.address; // 최종 주소 변수

                // 주소 정보를 해당 필드에 넣는다.
                document.getElementById("sample5_address").value = addr;
                // 주소로 상세 정보를 검색
                geocoder.addressSearch(data.address, function(results, status) {
                    // 정상적으로 검색이 완료됐으면
                    if (status === daum.maps.services.Status.OK) {

                        var result = results[0]; //첫번째 결과의 값을 활용

                        // 해당 주소에 대한 좌표를 받아서
                        var coords = new daum.maps.LatLng(result.y, result.x);
                        // 지도를 보여준다.
                        mapContainer.style.display = "block";
                        map.relayout();
                        // 지도 중심을 변경한다.
                        map.setCenter(coords);
                        // 마커를 결과값으로 받은 위치로 옮긴다.
                        marker.setPosition(coords)
                    }
                });
            }
        }).open();
    }
</script>
</html>