인프런 커뮤니티 질문&답변

민준님의 프로필 이미지

작성한 질문수

실전! 스프링 부트와 JPA 활용1 - 웹 애플리케이션 개발

주문 목록 검색, 취소

상품주문 에러 질문드립니다

해결된 질문

작성

·

254

0

학습하는 분들께 도움이 되고, 더 좋은 답변을 드릴 수 있도록 질문전에 다음을 꼭 확인해주세요.

1. 강의 내용과 관련된 질문을 남겨주세요.
2. 인프런의 질문 게시판과 자주 하는 질문(링크)을 먼저 확인해주세요.
(자주 하는 질문 링크: https://bit.ly/3fX6ygx)
3. 질문 잘하기 메뉴얼(링크)을 먼저 읽어주세요.
(질문 잘하기 메뉴얼 링크: https://bit.ly/2UfeqCG)

질문 시에는 위 내용은 삭제하고 다음 내용을 남겨주세요.
=========================================
[질문 템플릿]
1. 강의 내용과 관련된 질문인가요? (예/아니오)
2. 인프런의 질문 게시판과 자주 하는 질문에 없는 내용인가요? (예/아니오)
3. 질문 잘하기 메뉴얼을 읽어보셨나요? (예/아니오)

[질문 내용]
에러 내용을 보면 order/orderList 쪽의 타임리프에서 오류가 난 것같은데 이 쪽 부분은 강의자료를 따라 넣기만 한 부분이라 감이 잘 오지 않습니다..
 
 
<추가>
 
<추가>
 
 

답변 2

2

안녕하세요. 민준님, 공식 서포터즈 OMG입니다.

두가지를 확인해주세요.

1. application.yml에 osiv 설정이 되어 있는지

되어 있다면 삭제해주세요.

2. orderList.html에 여는 태그와 닫는태그가 한줄로 되어있지 않고 <div>내용</div>

<div

>내용 </div>  

혹은

<div>

내용 </div>  

와 같이 되어 있다면 한줄로 해서 확인해주세요.

 

감사합니다.

민준님의 프로필 이미지
민준
질문자

수정해서 orderList.html 코드 추가했습니다. 어디가 이상한건지 잘 모르겠습니다

0

올리신 코드에서 크게 특이한 점은 보이지 않았습니다.

1. 아래의 코드를 복붙하여 확인해주세요

<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head th:replace="fragments/header :: header"/>
<body>
<div class="container">
    <div th:replace="fragments/bodyHeader :: bodyHeader"/>
    <div>
        <div>
            <form th:object="${orderSearch}" class="form-inline">
                <div class="form-group mb-2">
                    <input type="text" th:field="*{memberName}" class="form-control" placeholder="회원명"/>
                </div>
                <div class="form-group mx-sm-1 mb-2">
                    <select th:field="*{orderStatus}" class="form-control">
                        <option value="">주문상태</option>
                        <option th:each="status : ${T(jpabook.jpashop.domain.OrderStatus).values()}"
                                th:value="${status}"
                                th:text="${status}">option
                        </option>
                    </select>
                </div>
                <button type="submit" class="btn btn-primary mb-2">검색</button>
            </form>
        </div>
        <table class="table table-striped">
            <thead>
            <tr>
                <th>#</th>
                <th>회원명</th>
                <th>대표상품 이름</th>
                <th>대표상품 주문가격</th>
                <th>대표상품 주문수량</th>
                <th>상태</th>
                <th>일시</th>
                <th></th>
            </tr>
            </thead>
            <tbody>
            <tr th:each="item : ${orders}">
                <td th:text="${item.id}"></td>
                <td th:text="${item.member.name}"></td>
                <td th:text="${item.orderItems[0].item.name}"></td>
                <td th:text="${item.orderItems[0].orderPrice}"></td>
                <td th:text="${item.orderItems[0].count}"></td>
                <td th:text="${item.status}"></td>
                <td th:text="${item.orderDate}"></td>
                <td>
                    <a th:if="${item.status.name() == 'ORDER'}" href="#"
                       th:href="'javascript:cancel('+${item.id}+')'"
                       class="btn btn-danger">CANCEL</a>
                </td>
            </tr>
            </tbody>
        </table>
    </div>
    <div th:replace="fragments/footer :: footer"/>
</div> <!-- /container -->

</body>
<script>
    function cancel(id) {
        var form = document.createElement("form");
        form.setAttribute("method", "post");
        form.setAttribute("action", "/orders/" + id + "/cancel");
        document.body.appendChild(form);
        form.submit();
    }
</script>
</html>

2. 동일하게 오류가 발생할 경우 강의에서 제공해드리는 완성된 프로젝트 코드의 orderList.html을 사용하여 기존에 학습하신 코드로 복붙하여 확인해주세요

-> 여기서 오류가 발생한다는 것은 orderList.html의 문제가 아니며

 

3. application.yml을 아래의 것으로 확인해주세요(제공해드리는 프로젝트 yml)

spring:
  datasource:
    url: jdbc:h2:tcp://localhost/~/jpashop
    username: sa
    password:
    driver-class-name: org.h2.Driver

  jpa:
    hibernate:
      ddl-auto: create
    properties:
      hibernate:
#        show_sql: true
        format_sql: true

logging.level:
  org.hibernate.SQL: debug
#  org.hibernate.type: trace

4. 여기까지도 동일한 오류가 발생한다면,

 

 

자바코드와 html 코드 경로를 확인할수 있게 위와 같이 올려주세요.

번외로 시간적인 여유가 되신다면 orderList.html에서 

<option th:each="status : ${T(jpabook.jpashop.domain.OrderStatus).values()}"
th:value="${status}"
th:text="${status}">option
</option>

태그 묶음 단위로 th가 붙어있는 태그를 지워가면서 어디서 오류가 나는지 확인해보시면 해결에 도움이 됩니다.

예상이지만 위의 OrderStatus 혹은 아래의 주문 리스트에서 문제가 발생하지 않나 싶습니다.

<tr th:each="item : ${orders}">
<td th:text="${item.id}"></td>
<td th:text="${item.member.name}"></td>
<td th:text="${item.orderItems[0].item.name}"></td>
<td th:text="${item.orderItems[0].orderPrice}"></td>
<td th:text="${item.orderItems[0].count}"></td>
<td th:text="${item.status}"></td>
<td th:text="${item.orderDate}"></td>
<td>
<a th:if="${item.status.name() == 'ORDER'}" href="#"
th:href="'javascript:cancel('+${item.id}+')'"
class="btn btn-danger">CANCEL</a>
</td>
</tr>
민준님의 프로필 이미지
민준
질문자

조치 이후에도 동일한 현상이 발견됩니다. orderList.html 내용을 다 지우고 해봐도 동일한 오류가 나오는걸 보니 html 문제가 아닌가 싶기도 합니다.

그러면 코드를 확인해봐야 알 것 같습니다.


전체 프로젝트를 압축해서 구글 드라이브로 공유해서 링크를 남겨주세요.
구글 드라이브 업로드 방법은 다음을 참고해주세요.

https://bit.ly/3fX6ygx

주의: 업로드시 권한 문제 꼭 확인해주세요
공유 기본 설정은 비공개로 되어 있어 업로드 한 본인 계정만 접근이 가능합니다.

본인 계정이 아닌 링크를 통한 타 계정 접근이 가능한지 확인하는 방법은 업로드 한 구글 계정을 로그아웃하고 링크를 접속하여 "액세스 권한 요청 화면"이 출력되는지 확인을 해주세요.

감사합니다

민준님의 프로필 이미지
민준
질문자

https://drive.google.com/file/d/1y_GRhV9PtzVvHupo1d9TG-42OXATiaot/view?usp=sharing

올렸습니다

 

 

orderList.html 파일명이 잘못되어 발생한 문제입니다.

orederList를

orderList로 변경했을 때 정상 실행 확인하였습니다.

민준님의 프로필 이미지

작성한 질문수

질문하기