MVC 패턴 model2 방식 - 회원 정보 조회, 수정, 삭제

Web Application model1, model2

 

1. Model1 (모델1) 방식

-모든 클라이언트의 요청과 비즈니스 로직 처리를 JSP에서 담당하는 구조

-기능 구현이 쉽고 편리, but 유지 보수가 어려워서 큰 프로젝트에서는 한계가 있다.

 

2. Model2 (모델2) 방식

-각 기능을 분리해서 구현

 

->클라이언트의 요청 처리 및 흐름 제어 담당 (Controller) => 서블릿

->응답 처리 (화면 기능) (View) => JSP

->비즈니스 로직 처리 (Model) => DAO

 

-각각의 기능을 모듈화하여 개발 => 재사용이 용이하다.

-유지 보수가 쉽다.

-publisher와 개발자 작업 분업화

 

MVC 디자인 패턴

-Model - View - Controller

-Controller

서블릿이 컨트롤러 역할, 클라이언트의 요청 분석,

Model에서 처리한 결과를 보여주기 위해 JSP 선택.

 

-Model

데이터베이스 연동과 같은 비즈니스 로직 수행,

DAO, DTO(VO) 클래스

 

-View

JSP가 화면 기능을 담당,Model에서 처리한 결과를 화면에 표시

 

=>일반 PC 프로그램 개발에 사용되는 패턴을 웹 애플리케이션에 도입

 

URL 패턴 적용 없이 MVC 패턴으로 회원 정보 조회하기

 

지난번에 만들었던 t_member 테이블을 사용했다.

전체적인 흐름을 그림으로 표현하면 이러하다.

워크 스페이스 구조, 색깔별로 각각 MVC 역할 수행

 

MemberVO

import java.sql.Date;
 
public class MemberVO {
    
    private String id;
    private String pwd;
    private String name;
    private String email;
    private Date joinDate;
    
    public MemberVO(String id, String pwd, String name, String email, Date joinDate) {
        super();
        this.id = id;
        this.pwd = pwd;
        this.name = name;
        this.email = email;
        this.joinDate = joinDate;
    }
 
    public String getId() {
        return id;
    }
 
    public void setId(String id) {
        this.id = id;
    }
 
    public String getPwd() {
        return pwd;
    }
 
    public void setPwd(String pwd) {
        this.pwd = pwd;
    }
 
    public String getName() {
        return name;
    }
 
    public void setName(String name) {
        this.name = name;
    }
 
    public String getEmail() {
        return email;
    }
 
    public void setEmail(String email) {
        this.email = email;
    }
 
    public Date getJoinDate() {
        return joinDate;
    }
 
    public void setJoinDate(Date joinDate) {
        this.joinDate = joinDate;
    }
    
    
    
    
 
}

MemberDAO

import java.sql.Connection;
import java.sql.Date;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.util.ArrayList;
import java.util.List;
 
import javax.naming.Context;
import javax.naming.InitialContext;
import javax.sql.DataSource;
 
public class MemberDAO {
    
    Connection conn;
    PreparedStatement pstmt;
    ResultSet rs;
    DataSource ds;
    
    public MemberDAO() {
        
        try {
        
        Context ctx = new InitialContext();
        Context envContext = (Context)ctx.lookup("java:comp/env");
        DataSource source = (DataSource)ctx.lookup("jdbc/oracle");
        
        }catch (Exception e) {
            e.printStackTrace();
        }
    }
    
    public List<MemberVO> listMembers(){
        
        List<MemberVO> membersList = new ArrayList<>();
        
        try {
            
            conn = ds.getConnection();
            String query = "SELECT * FROM t_member order by joinDate desc";
            pstmt = conn.prepareStatement(query);
            rs = pstmt.executeQuery();
            
            while(rs.next()) {
                String id = rs.getString("id");
                String pwd = rs.getString("pwd");
                String name = rs.getString("name");
                String email = rs.getString("email");
                Date joinDate = rs.getDate("joinDate");
                MemberVO memberVO = new MemberVO(id, pwd, name, email, joinDate);
                membersList.add(memberVO);
            }
            rs.close();
            pstmt.close();
            conn.close();
                    
        }catch (Exception e) {
            System.out.println("회원 조회 중 오류");
            e.printStackTrace();
        }
        
        return membersList;
    }
 
}

MemberController

import java.io.IOException;
import java.util.List;
 
import javax.servlet.RequestDispatcher;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
 
/**
 * Servlet implementation class MemberController
 */
@WebServlet("/mem.do")
public class MemberController extends HttpServlet {
    private static final long serialVersionUID = 1L;
    MemberDAO memberDAO;
    
 
    public void init(ServletConfig config) throws ServletException{
        memberDAO = new MemberDAO();
        
    }
    
    /**
     * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
     */
    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        
        doHandler(request, response);
    }
 
    /**
     * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
     */
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        
        doHandler(request, response);
    }
 
    
    private void doHandler(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        
        request.setCharacterEncoding("utf-8");
        response.setContentType("text/html;charset=utf-8");
        List<MemberVO> membersList = memberDAO.listMembers();            //요청에 대한 회원 정보를 조회함.
        
        request.setAttribute("membersList", membersList);        //조회한 회원 정보를 request에 바인딩함.
        
        //컨트롤러에서 해당 결과를 표시할 JSP로 포워딩함.
        RequestDispatcher dispatcher = request.getRequestDispatcher("/member/listmembers.jsp");
        dispatcher.forward(request, response);
        
    }
 
    
}

listmembers.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%
    request.setCharacterEncoding("utf-8");
%>
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Insert title here</title>
    <style type="text/css">
        .cls1{
            font-size: 40px;
            text-align: center;
        }
        
        .cs2{
            font size: 20px;
            text-align: center;
        }
    </style>
</head>
<body>
    <p class="cls1">회원 정보</p>
    <table align="center" border="1">
        <tr align="center" bgcolor="lightgreen">
            <td width="%"><b>아이디</b></td>
            <td width="%"><b>비밀번호</b></td>
            <td width="%"><b>이름</b></td>
            <td width="%"><b>이메일</b></td>
            <td width="%"><b>가입일</b></td>
        </tr>
        <c:choose>
            <c:when test="${empty membersList}">
                <td colspan="5" align="center">
                    <b>등록된 회원이 없습니다.</b>
                </td>
            </c:when>
            <c:when test="${not empty membersList }">
                <c:forEach var="mem" items="${membersList }">
                    <tr align="center">
                        <td>${mem.id }</td>
                        <td>${mem.pwd }</td>
                        <td>${mem.name }</td>
                        <td>${mem.email }</td>
                        <td>${mem.joinDate }</td>
                    </tr>
                </c:forEach>
            </c:when>
        </c:choose>
    </table>
    
    <a href="#"></a>
</body>
</html>

MemberController 에 매핑해둔 mem.do 입력

URL - Pattern

1. 디렉토리 패턴

-디렉토리 형태로 서버의 해당 컴포넌트(서블릿)를 찾아서 실행하는 구조

-예) http://localhost:8080/프로젝트명/directory ==> 해당 Servlet

 

2. 확장자 패턴

-확장자 형태로 서버의 해당 컴포넌트(서블릿)를 찾아서 실행하는 구조
-예)http://localhost:8080/프로젝트명/list.do
     http://localhost:8080/프로젝트명/update.do ==> do Servlet
     http://localhost:8080/프로젝트명/detail.do

 -http://localhost/프로젝트명/*.do 로 끝나는 요청을 동일한 doServlet으로 찾아가게 매핑함.

 

3. FrontController 패턴

1)FrontController 패턴 적용 전
 -클라이언트의 다양한 요청이 개별적인 서블릿 존재 => 파일도 많아지고 관리 부담
 - => 모든 요청을 처리하는 하나의 서블릿을 만들고, 이에 맞게 분기 처리 하면됨.
 
2)FrontController 패턴 적용 후
-클라이언트의 다양한 요청을 한 곳에서 집중시켜, 개발 및 유지보수 효율성 증대★★

 

7. Command 패턴

1) 클라이언트로부터 받은 요청들에 대해서, 서블릿이 직접하지 않고
       해당 클래스가 처리하도록 함.  
2) FrontController 역할을 하는 서블릿이 직접 처리하지 않고, 
   해당 업무 담당 서블릿으로 분산 시켜서 처리하도록 함.

 => FrontController 패턴  + Command 패턴 

 

URL 패턴 적용하여 MVC 패턴으로 회원 정보 조회하기

위의 예제에

회원 가입 (회원 추가), 회원 정보 수정 & 삭제 기능 추가

}else if(action.equals("/addMember.do")) {

이런 식으로 action 값을 조건문으로 설정해서 각각 어떤 페이지로 forward할지 설정한다.

@WebServlet(name = "MemberController2", urlPatterns = { "/member/*" })

url 패턴은 /member/* 로 매핑하여 예를 들면

else if(action.equals("/memberForm.do")){

            forwardPage = "/member02/memberForm.jsp";

위의 경우
localhost:8080/ contextPath 값 /member/memberForm.do 일 경우 memberForm.jsp 페이지로 이동

 

MemberController.java

import java.io.IOException;
 
import java.util.List;
 
import javax.servlet.RequestDispatcher;
import javax.servlet.ServletConfig;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
 
/**
 * Servlet implementation class MemberController
 */
@WebServlet(name = "MemberController2", urlPatterns = { "/member/*" })
public class MemberController extends HttpServlet {
    private static final long serialVersionUID = 1L;
    MemberDAO memberDAO;
    
    public void init(ServletConfig config) throws ServletException{
        memberDAO = new MemberDAO();
        
    }
    
    /**
     * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
     */
    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        
        doHandle(request, response);
    }
 
    /**
     * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
     */
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        
        doHandle(request, response);
    }
 
    
    private void doHandle(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        
        String forwardPage = null;
        request.setCharacterEncoding("utf-8");
        response.setContentType("text/html;charset=utf-8");
        
        String action = request.getPathInfo();        //URL에서 요청명을 가져옴
        System.out.println("getPathInfo()" + action);
        
        //최초 요청이거나 action값이 /listmembers.do이면 회원 목록을 출력함
        if(action == null || action.equals("/listmembers.do")) {
            List<MemberVO> membersList = memberDAO.listMembers();
            request.setAttribute("membersList", membersList);
            forwardPage = "/member/listmembers.jsp";        //member02폴더의 listmembers.jsp로 포워딩
            
        }else if(action.equals("/addMember.do")) {
            String id = request.getParameter("id");
            String pwd = request.getParameter("pwd");
            String name = request.getParameter("name");
            String email = request.getParameter("email");
            
            MemberVO memberVO = new MemberVO(id, pwd, name, email);
            memberDAO.addMember(memberVO);
            forwardPage = "/member/listmembers.do";
            
        }else if(action.equals("/memberForm.do")){
            forwardPage = "/member02/memberForm.jsp";
            
        }else if(action.equals("/modMemberForm.do")) {
        
            String id = request.getParameter("id");
            MemberVO memInfo = memberDAO.findMember(id);
            request.setAttribute("memInfo", memInfo);
            
            forwardPage = "/member02/modMemberForm.jsp";
            
        }else if(action.equals("/modMember.do")) {
            
            String id = request.getParameter("id");
            String pwd = request.getParameter("pwd");
            String name = request.getParameter("name");
            String email = request.getParameter("email");
            
            MemberVO memberVO = new MemberVO(id, pwd, name, email);
            memberDAO.modMember(memberVO);
            request.setAttribute("msg", "modified");
            
            forwardPage = "/member/listmembers.do";
            
        }else if(action.equals("/delMember.do")) {
            
            String id = request.getParameter("id");
            memberDAO.delMember(id);
            request.setAttribute("msg", "deleted");
            forwardPage = "/member/delMembers.do";
            
        }else {
            List<MemberVO> membersList = memberDAO.listMembers();
            request.setAttribute("membersList", membersList);
            forwardPage = "/member02/listmembers.jsp";    
        }
        
        //forwardPage에 지정한 요청명으로 다시 서블릿에 요청함.
        RequestDispatcher dispatcher = request.getRequestDispatcher(forwardPage);
        dispatcher.forward(request, response);
    }
 
    
}

MemberVO

import java.sql.Date;
 
public class MemberVO {
    
    private String id;
    private String pwd;
    private String name;
    private String email;
    private Date joinDate;
    
    public MemberVO(String id, String pwd, String name, String email) {
        
        this.id = id;
        this.pwd = pwd;
        this.name = name;
        this.email = email;
    }
    
    public MemberVO(String id, String pwd, String name, String email, Date joinDate) {
        super();
        this.id = id;
        this.pwd = pwd;
        this.name = name;
        this.email = email;
        this.joinDate = joinDate;
    }
 
    public String getId() {
        return id;
    }
 
    public void setId(String id) {
        this.id = id;
    }
 
    public String getPwd() {
        return pwd;
    }
 
    public void setPwd(String pwd) {
        this.pwd = pwd;
    }
 
    public String getName() {
        return name;
    }
 
    public void setName(String name) {
        this.name = name;
    }
 
    public String getEmail() {
        return email;
    }
 
    public void setEmail(String email) {
        this.email = email;
    }
 
    public Date getJoinDate() {
        return joinDate;
    }
 
    public void setJoinDate(Date joinDate) {
        this.joinDate = joinDate;
    }
    
    
    
    
 
}

MemberDAO

import java.sql.Connection;
import java.sql.Date;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.util.ArrayList;
import java.util.List;
 
import javax.naming.Context;
import javax.naming.InitialContext;
import javax.sql.DataSource;
 
public class MemberDAO {
    
    Connection conn;
    PreparedStatement pstmt;
    DataSource ds;
    
    public MemberDAO() {
        
        try {
            
            Context ctx = new InitialContext();
            Context envContext = (Context)ctx.lookup("java:/comp/env");  //JNDI에 접근하기 위해 기본경로를 지정함.
            //톰캣 context.xml에 설정한 name 값인 jdbc/oracle을 이용해 톰캣이 미리 연결한 DataSource를 받아옴.
            ds = (DataSource)envContext.lookup("jdbc/oracle");    
            
            }catch (Exception e) {
                e.printStackTrace();
        }
    }
    
    public List<MemberVO> listMembers(){
        
        List<MemberVO> membersList = new ArrayList<>();
        
        try {
            
            conn = ds.getConnection();
            String query = "SELECT * FROM t_member order by joinDate desc";
            pstmt = conn.prepareStatement(query);
            ResultSet rs = pstmt.executeQuery();
            
            while(rs.next()) {
                String id = rs.getString("id");
                String pwd = rs.getString("pwd");
                String name = rs.getString("name");
                String email = rs.getString("email");
                Date joinDate = rs.getDate("joinDate");
                MemberVO memberVO = new MemberVO(id, pwd, name, email, joinDate);
                membersList.add(memberVO);
            }
            rs.close();
            pstmt.close();
            conn.close();
                    
        }catch (Exception e) {
            System.out.println("회원 조회 중 오류");
            e.printStackTrace();
        }
        
        return membersList;
    }

MemberDAO

--회원 추가, 회원 정보 수정&삭제 기능

public void addMember(MemberVO m) {
        
        try {
            
            conn = ds.getConnection();
            
            String id = m.getId();
            String pwd = m.getPwd();
            String name = m.getName();
            String email = m.getEmail();
            
            String query = "INSERT INTO t_member(id, pwd, name, email) VALUES(?, ?, ? , ?)";
            pstmt = conn.prepareStatement(query);
            pstmt.setString(1, id);
            pstmt.setString(2, pwd);
            pstmt.setString(3, name);
            pstmt.setString(4, email);
            pstmt.executeUpdate();
            
            pstmt.close();
            conn.close();
                
        }catch (Exception e) {
            System.out.println("회원가입 중 예외 발생");
            e.printStackTrace();
        }
    }
    
    public MemberVO findMember(String _id) {
        MemberVO memInfo = null;
        
        try {
            
            conn = ds.getConnection();
            String query = "SELECT * FROM t_member WHERE id = ?";
            pstmt = conn.prepareStatement(query);
            pstmt.setString(1, _id);
            System.out.println(query);
            
            ResultSet rs = pstmt.executeQuery();
            rs.next();
            String id = rs.getString("id");
            String pwd = rs.getString("pwd");
            String name = rs.getString("name");
            String email = rs.getString("email");
            Date joinDate = rs.getDate("joinDate");
            
            memInfo = new MemberVO(id, pwd, name, email, joinDate);
            
            pstmt.close();
            conn.close();
            
        }catch (Exception e) {
            System.out.println("회원 정보 찾기 중 예외 발생");
            e.printStackTrace();
        }
        
        return memInfo;
    }
    
    public void modMember(MemberVO memberVO) {
        
        String id = memberVO.getId();
        String pwd = memberVO.getPwd();
        String name = memberVO.getName();
        String email = memberVO.getEmail();
        
        try {
            
            conn = ds.getConnection();
            String query = "UPDATE t_member SET PWD = ?, NAME = ?, EMAIL = ? WHERE ID = ?";
            System.out.println(query);
            
            pstmt = conn.prepareStatement(query);
            pstmt.setString(1, pwd);
            pstmt.setString(2, name);
            pstmt.setString(3, email);
            pstmt.setString(4, id);
            pstmt.executeUpdate();
            
            pstmt.close();
            conn.close();
            
        }catch (Exception e) {
            System.out.println("회원 정보 수정 중 예외 발생");
            e.printStackTrace();
        }
    }
    
    public void delMember(String id) {
        
        try {
            
            conn = ds.getConnection();
            String query = "delete from t_member WHERE id = ?";
            System.out.println(query);
            pstmt = conn.prepareStatement(query);
            pstmt.setString(1, id);
            pstmt.executeUpdate();
            
        }catch (Exception e) {
            System.out.println("회원 삭제 중 예외 발생");
            e.printStackTrace();
        }
    }
 
}

listmembers.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<c:set var="contextPath" value="${pageContext.request.contextPath }"/>
<%
    request.setCharacterEncoding("utf-8");
%>
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Insert title here</title>
    <style type="text/css">
        .cls1{
            font-size: 40px;
            text-align: center;
        }
        
        .cls2{
            font-size: 40px;
            text-align: center;
        }
        
        .cs2{
            font size: 20px;
            text-align: center;
        }
    </style>
    
    <c:choose>
        <c:when test="${msg == 'modified' }">
            <script type="text/javascript">
                window.onload=function(){
                    alert("회원 정보를 수정했습니다.");
                }
            </script>
        </c:when>
    </c:choose>
    
    <c:choose>
        <c:when test="${msg == 'deleted' }">
            <script type="text/javascript">
                window.onload=function(){
                    alert("회원 정보를 수정했습니다.");
                }
            </script>
        </c:when>
    </c:choose>
    
</head>
<body>
    <p class="cls1">회원 정보</p>
    <table align="center" border="1">
        <tr align="center" bgcolor="lightblue">
            <td width="7%"><b>아이디</b></td>
            <td width="7%"><b>비밀번호</b></td>
            <td width="7%"><b>이름</b></td>
            <td width="7%"><b>이메일</b></td>
            <td width="7%"><b>가입일</b></td>
            <td width="7%"><b>수정</b></td>
            <td width="7%"><b>삭제</b></td>
        </tr>
        <c:choose>
            <c:when test="${empty membersList}">
                <td colspan="5" align="center">
                    <b>등록된 회원이 없습니다.</b>
                </td>
            </c:when>
            <c:when test="${not empty membersList }">
                <c:forEach var="mem" items="${membersList }">
                    <tr align="center">
                        <td>${mem.id }</td>
                        <td>${mem.pwd }</td>
                        <td>${mem.name }</td>
                        <td>${mem.email }</td>
                        <td>${mem.joinDate }</td>
                        <td><a href="${contextPath }/member/modMemberForm.do/id=${mem.id}">수정</a></td>
                        <td><a href="${contextPath }/member/delMemberForm.do/id=${mem.id}">삭제</a></td>
                    </tr>
                </c:forEach>
            </c:when>
        </c:choose>
    </table>
    
    <a href="${contextPath }/member/memberForm.do"><p class="cls2">회원가입하기</p></a>
</body>
</html>

memberForm.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<c:set var="contextPath" value="${pageContext.request.contextPath }"/>
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>회원 가입창</title>
</head>
<body>
    <form action="${contextPath }/member/addMember.do" method="post">
        <h1 style="text-align: center;">회원 가입창</h1>
        <table align="center">
            <tr>
                <td width="200">
                    <p align="right">아이디</p>
                </td>
                <td width="400">
                    <input type="text" name="id">
                </td>
            </tr>
            <tr>
                <td width="200">
                    <p align="right">비밀번호</p>
                </td>
                <td width="400">
                    <input type="password" name="pwd">
                </td>
            </tr>
            <tr>
                <td width="200">
                    <p align="right">이름</p>
                </td>
                <td width="400">
                    <input type="text" name="name">
                </td>
            </tr>
            <tr>
                <td width="200">
                    <p align="right">이메일</p>
                </td>
                <td width="400">
                    <input type="text" name="email">
                </td>
            </tr>
            <tr>
                <td width="200">
                    <p align="right">&nbsp;</p>
                </td>
                <td width="400">
                    <input type="submit" value="가입하기">
                    <input type="reset" value="다시 입력">
                </td>
                
            </tr>
        </table>
    </form>
</body>
</html>

modMemberForm.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<c:set var="contextPath" value="${pageContext.request.contextPath }"/>
<%
    request.setCharacterEncoding("utf-8");
%>
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>회원정보 수정</title>
</head>
<body>
    <form action="${contextPath }/member/modMember.do?id=${memInfo.id}" method="post">
        <h1 style="text-align: center;">회원 가입창</h1>
        <table align="center">
            <tr>
                <td width="200">
                    <p align="right">아이디</p>
                </td>
                <td width="400">
                    <input type="text" name="id" value="${memInfo.id }" disabled>
                </td>
            </tr>
            <tr>
                <td width="200">
                    <p align="right">비밀번호</p>
                </td>
                <td width="400">
                    <input type="password" name="pwd" value="${memInfo.pwd }">
                </td>
            </tr>
            <tr>
                <td width="200">
                    <p align="right">이름</p>
                </td>
                <td width="400">
                    <input type="text" name="name" value="${memInfo.name }">
                </td>
            </tr>
            <tr>
                <td width="200">
                    <p align="right">이메일</p>
                </td>
                <td width="400">
                    <input type="text" name="email" value="${memInfo.email }">
                </td>
            </tr>
            <tr>
                <td width="200">
                    <p aligin="right">가입일</p>
                </td>
                <td width="400">
                    <input type="text" name="joinDate" value="${memInfo.joinDate }" disabled>
                </td>
            </tr>
            <tr>
                <td width="200">
                    <p align="right">&nbsp;</p>
                </td>
                <td width="400">
                    <input type="submit" value="가입하기">
                    <input type="reset" value="다시 입력">
                </td>
                
            </tr>
        </table>
    </form>
</body>
</html>

커맨드 패턴 입력하면

listmembers.jsp 로 이동 -> 가입하기 누르면

memberForm.jsp로 이동