티스토리 뷰

FRONT-END/JSP

[JSP] 간단한 장바구니

진심스테이크 2018. 4. 13. 13:16

 

1. login

- 로그인 화면

- 비밀번호 입력은 없으며 사용자 이름을 입력하는 양식만 제공

- 아이디를 입력하지 않을 경우 예외처리

 

2. setProduct

- 상품 선택화면

- 리스트에서 원하는 상품을 선택하고 추가 버튼을 눌러서 상품을 추가

 

3. add

- setProduct에서 선택한 상품을 세션에 넣음

- 선택된 데이터를 모두 저장해야하므로 ArrayList 사용

- 상품이 추가되었다는 메시지를 보여주고 다시 setProduct로 돌아감

 

4. checkOut

- 세션이 살아 있고, 하나 이상의 상품을 선택한 상태면, 목록을 보여줌

- 상품 목록이 없을 경우 예외처리

 

- 로그아웃시, 모든 데이터 삭제

 

 

 

 

login.jsp

<%@page import="javax.annotation.PostConstruct"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
    session.invalidate(); //첫 페이지로 오면 다 지움
%>
<!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=UTF-8">
<title>login</title>
</head>
<body>
    <h2 align="center">Login</h2>
    <form name="form1" action="setProduct.jsp" method="post">
        <table align="center">
            <tr>
                <td align="center">아이디</td>
                <td><input type="text" required name="id" /></td>
                <!-- required 사용 -->
                <td><input type="submit" name="login" value="로그인"/></td>
            </tr>
        </table>
    </form>
</body>
</html>

 

setProduct.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
    request.setCharacterEncoding("UTF-8"); //한글처리
%>
<!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=UTF-8">
<title>setProduct</title>
</head>
<body>
    <%
        if (request.getParameter("id") == null) { //checkOut.jsp에서 넘어오면 id가 null값이 된다
            session.setAttribute("id", session.getValue("id")); //getValue를 사용해서 값을 불러옴
        } else {
            session.setAttribute("id", request.getParameter("id"));
        }
    %>
    <h2 align="center">상품 선택</h2>
    <hr>
    <p align="center"><%=session.getAttribute("id")%>님이 로그인 한 상태 입니다
    </p>
    <hr>
    <form action="add.jsp">
        <table align="center">
            <tr>
                <td><select name="product">
                        <option value="사과">사과</option>
                        <option value="오렌지">오렌지</option>
                        <option value="바나나">바나나</option>
                        <option value="파인애플">파인애플</option>
                        <option value="수박">수박</option>
                </select></td>
                <td><input type="submit" value="추가" /></td>
            </tr>
            <tr>
                <td align="center"><a href="checkOut.jsp" />계산</td>
            </tr>
        </table>
    </form>
    <form action="login.jsp">
        <table align="center">
            <tr>
                <td><input type="submit" value="로그아웃"></td>
            </tr>
        </table>
    </form>
</body>
</html>
 

add.jsp

<%@page import="java.util.ArrayList"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
    request.setCharacterEncoding("UTF-8"); //한글처리
%>
<!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=UTF-8">
<title>add</title>
</head>
<body>
    <%!ArrayList<String> list;%>
    <%
        String productName = request.getParameter("product");
        //조건
        if (session.getAttribute("productlist") == null) {
            //아무런 데이터가 없으면 : Arraylist 할당
            list = new ArrayList<String>();
        } else { //저장된 데이터가 있으면
            list = (ArrayList<String>) session.getAttribute("productlist");
        }

        list.add(productName); //리스트에 내용 
        session.setAttribute("productlist", list); //ArrayList를 session에 저장
    %>
    <script>
        alert("상품이 추가되었습니다");
        history.back();
    </script>

</body>
</html>

 

 

checkOut.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
    request.setCharacterEncoding("UTF-8"); //한글처리
%>
<!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=UTF-8">
<title>CheckOut</title>
</head>
<body>
    <form>
        <h2 align="center">계산</h2>
        <p align="center">선택한 상품 목록</p>
        <hr>
        <%
            if (session.getAttribute("productlist") == null) { //추가한 물품(추가)를 하지 않은 경우
        %>
        <p align="center">추가된 상품 없을무</p>
        <%
            } else {
        %>
        <p align="center"><%=session.getAttribute("productlist").toString()%></p> //session에 저장된 list 불러옴
        <%
            }
        %>
        <a href="setProduct.jsp" align="center">뒤로가기</a>
    </form>
    <form action="login.jsp">
        <table align="center">
            <tr>
                <td><input type="submit" value="로그아웃"></td>
            </tr>
        </table>
    </form>
</body>
</html>

 

 

 

 

실행화면

 

로그인창

 

아이디를 입력하지 않았을 경우

 

아이디 입력 후 로그인

 

상품 리스트

 

상품 선택 시 팝업 창

 

계산 창

 

뒤로가기 클릭 시 이름이 그대로 뜨는것을 볼 수 있다

 

로그아웃 누르면 다시 로그인 창으로 가고, 모든 데이터가 초기화 된다

 

 

 

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

'FRONT-END > JSP' 카테고리의 다른 글

[JSP] JAVABEAN  (0) 2018.04.16
[JSP] ACTION TAG - 액션 태그  (0) 2018.04.16
[JSP] SENDREDIRECT( )  (1) 2018.04.13
[JSP] ATTRIBUTE & SCOPE - 속성과 영역  (0) 2018.04.12
[JSP] 오류 예외처리  (0) 2018.04.12
댓글