주문 목록 검색, 취소

주문 검색 컨트롤러 정리

Get방식으로 들어오는 데이터를 OrderSearch로 바인딩한다. @ModelAttribute는 "orderSearch" 이름으로 이 객체 데이터를 뷰 템플릿에 전달한다!
orderSearch로 orderService의 findOrders메서드를 호출하여 Order 들을 검색한다. Order컬렉션(orders)를 생성하고, 이 객체 데이터도 뷰 템플릿에 전달한다!

@GetMapping("/orders")
public String orderList(@ModelAttribute("orderSearch") OrderSearch orderSearch, Model model){
    List<Order> orders = orderService.findOrders(orderSearch);
    model.addAttribute("orders",orders);

    return "order/orderList";
}

구현할 내용 상품 주문까지 완료. 주문 완료된 상품 목록들을 조회하면서 주문 검색 기능과 취소 기능을 함께 구현해본다!

컨트롤러

아래 보이는 것처럼 회원, 상품에 의존하며 회원 데이터와 상품 데이터를 가져와야한다.

@ModelAttribute로 요청 파라미터 값들을 바인딩하여 OrderSearch 객체 인스턴스에 담아서 이것을 모델에 담아 템플릿에 넘긴다.

@GetMapping("/orders")
public String orderList(@ModelAttribute("orderSearch") OrderSearch orderSearch, Model model){
  List<Order> orders = orderService.findOrders(orderSearch);
  model.addAttribute("orders",orders);
  return "order/orderList";
}

2. 타임리프 템플릿 : orderList.html +JavaScript 추가됨

orderList.html 분석 일단 아래처럼 회원이름과 주문상태로 검색할 수 있도록 form태그를 추가해야한다!

검색 기능 구현 준비물 : OrderSearch 클래스, OrderService의 검색 기능 메서드 구현(findOrders) OrderSearch 클래스

@Getter @Setter
public class OrderSearch {
    private String memberName;//회원 이름
    private OrderStatus orderStatus;//주문 상태[ORDER, CANCEL]
}

OrderService의 findOrders(OrderSearch orderSearch)메서드 : 검색 기능

public List<Order> findOrders(OrderSearch orderSearch){
  return orderRepository.findAllByCriteria(orderSearch);//단순위임한다.=>컨트롤러에서 리포지토리로 바로 불러도 괜찮다.단순 화면 조회같은 경우.
}

닭이 먼저인가 계란이 먼저인가?어떻게 시작되는 거지?(아리까리한 부분 질문 완료) form태그의 orderSearch가 잇는 걸 보면 폼 페이지에서 데이터를 먼저 전송해서 컨트롤러에서 그 데이터를 객체로 담고, 이 객체 데이터를 템플릿에 전달한 걸로 보임. 폼 페이지 구성할 때 orderSearch 객체 데이터로 구성!? (일단 컨트롤러에서 /orders 로 접속하면 "order/orderList" 페이지 랜더링부터해야하는 거 아닌가?) 1. form 태그에서 회원명, 주문 상태를 GET방식으로 데이터 전송한다. 2. @ModelAttribute로 요청파라미터값들을 OrderSearch 객체로 바인딩한다! 3. OrderService의 findOrders(orderSearch)를 호출해서 List<Order> 변수 orders에 저장. 4. 모델에 "orders"이름으로 orders 담아 orderList 템플릿에 전달한다! 5. orderList 템플릿 렌더링한다. =>@ModelAttribute("orderSearch") : 요청파라미터들을 객체로 만들 뿐만 아니라 "orderSearch" 이름으로 모델에 객체 데이터 담아서 템플릿에 전달한다!

주문 상태가 ORDER이면 취소 가능하므로 스크립트로 cancel 버튼을 만들어주고, cancel 버튼을 누르면 cancel 페이지로 이동하도록 했다.

Previous상품 주문 Next다음으로

Last updated 3 years ago

@GetMapping("/orders") public String orderList(@ModelAttribute("orderSearch") OrderSearch orderSearch, Model model){ List<Order> orders = orderService.findOrders(orderSearch); model.addAttribute("orders",orders); return "order/orderList"; }

public List<Order> findOrders(OrderSearch orderSearch){ return orderRepository.findAllByCriteria(orderSearch);//단순위임한다.=>컨트롤러에서 리포지토리로 바로 불러도 괜찮다.단순 화면 조회같은 경우. }