View단에서 Form Submit시 Dto 내부에 다른 Dto를 List로 가진 형태일때 처리방법

View단에서 Form Submit 시 Dto 내부에 다른 Dto를 List로 가진 형태일때 전송하는 방법에 대해 정리한 내용입니다.

 

테스트 Dto는 아래와 같습니다.

Order : 주문정보

Goods : 상품정보

한 주문에는 주문상품이 여러개 있는 구조입니다.

@Data
public class Order {
    private String orderNo;
    private String ordererNm;
    private List<Goods> lGoods;
}

@Data
public class Goods {
    private String goodsNm;
}

 

View단의 Form은 아래와 같습니다.

<form id="orderForm" action="/orderSubmit" method="post">
    주문번호
    <input type="text" name="orderNo"/><br/>
    주문자명
    <input type="text" name="ordererNm"/><br/>
    상품명1
    <input type="text" name="goodsNm"/><br/>
    상품명2
    <input type="text" name="goodsNm"/><br/>
    <button type="submit" id="orderSubmitBtn">전송</button>
</form>

HTML 화면

주문번호, 주문자명, 상품명1, 상품명2를 입력후 전송버튼을 클릭시 아래의 Contoller 소스에 form 데이터가 전송되게 됩니다.

@PostMapping("/orderSubmit")
public String orderSubmit(Order order) {
    return "test";
}

controller form 데이터

name이 goodsNm인 input 태그가 두개 있지만 lGoods List에는 세팅이 안되는 것을 볼수 있습니다.

Order dto 내부의 Goods dto의 List에 값이 설정되게 하려면 상품명 input 태그의 name을 dto의 'list의 변수명[index].변수명' 형식으로 적어주면 넘어가는 것을 확인할 수 있습니다.

<form id="orderForm" action="/orderSubmit" method="post">
    주문번호
    <input type="text" name="orderNo"/><br/>
    주문자명
    <input type="text" name="ordererNm"/><br/>
    상품명1
    <input type="text" name="lGoods[0].goodsNm"/><br/>
    상품명2
    <input type="text" name="lGoods[1].goodsNm"/><br/>
    <button type="submit" id="orderSubmitBtn">전송</button>
</form>

controller form 데이터

 

 

참고자료

https://stackoverflow.com/questions/75795816/pass-dynamic-list-from-view-to-controller-in-spring