22.03.24-아이템페이지

아이템 페이지

  • 로그인 아이디마다 아이템 페이지 생성되도록 하기
  • 아이템 추가시에 라디오버튼, 셀렉트박스 구현하기
    -라디오 버튼: 의료/건강기능식품 선택
    -추가 옵션 선택지 넣기

====================================================================

1. 아이디별 아이템 페이지 만들기

문제점

  • HashMap은 value의 중복은 허용하지만 key의 중복은 허용하지 않는다.
  • loginId를 key로 설정하면 하나의 loginId로 여러 Item들을 저장할 수 없을 것.(최근 것만 저장)

해결방법

  1. key의 중복을 허용하는 Map이 있는가?

    X (List가 중복 허용함, 대신 key, value 구분은 없다)

  2. Item 생성시 고유 sequence 번호 부여 -> sequence 번호만 loginId별로 저장하여 찾을 때 사용

  3. 아니면 각 아이디마다 저장소를 따로 만들어서 보관할 수 있는가 -> 저장소를 저장하는 방법

  4. 저장소 말고 class 객체를 만들어서 관리하기

    Item을 저장할 객체를 따로 만들기 -> Map <String, ItemSaveObject> 으로 ItemRepository에 저장하기 (String은 loginId)

저장에 저장을 더하다

  • ItemSaveObject에서 Item을 저장하고 (구분은 sequence)
  • ItemRepository에서 ItemSaveObject를 저장하면 됨 (구분은 loginId)

====================================================================

2. 라디오 버튼

enum 생성(건강/의료)

  • description을 사용하기 위해 생성자를 만들어야 함
  • HEALTH, MEDICAL은 코드로 사용되고, description은 HTML에 보여지는 설명으로 사용됨

ENUM 객체

public enum ItemType {
    HEALTH("건강"), MEDICAL("의료");

    private final String description;

    ItemType(String description) {
        this.description = description;
    }

    public String getDescription() {
        return description;
    }
}

Item 객체

@NotNull
    private ItemType itemType;
  • @NotNull 사용으로 라디오버튼 필수선택하도록 설정

컨트롤러 - enum 모든 값 배열로 반환하기

@ModelAttribute("itemTypes")
    public ItemType[] itemTypes(){
        return ItemType.values();
    }
  • ModelAttribute의 특별한 사용법

  • ItemType[] ~ ItemType.values()는 ENUM의 모든 정보를 배열로 반환한다.

라디오버튼 html 코드

<div>
    <div th:each="type : ${itemTypes}">
        <input type="radio" th:field="*{itemType}" th:value="${type.name()}">
        
        <label th:for="${#ids.prev('itemType')}" th:text="${type.description}"></label>
     </div>
</div>
  • input - th:value="${type.name()}" 이 없으면 에러발생
  • 역할은 무엇일까?
  • label - th:for="${#ids.prev('itemType')}" 은 없어도 작동됨
  • 라벨링 하기 위해서는 사용해야 하는데, 이는 itemType1, itemType2 이렇게 뒤에 숫자를 붙여준다.

수정사항

validation

@NotBlank
private Integer price;
  • 숫자 타입에 NotBlank 어노테이션 사용시 에러 발생 -> NotNull 어노테이션으로 수정

좋은 웹페이지 즐겨찾기