[JS/jQuery] ajax 으로 배열을 controller 로 넘기기

 

📍 JS

// 자식 배열 생성
var testArr = [];

// for 문을 사용하여 객체 생성 및 배열에 추가
for (let i = 0; i < ids.length; i++) {
    // 객체 생성
    var obj = {
                id: ids[i],
                name: names[i]
                };
    // 배열에 추가
    testArr.push(obj);
}

var testObj = {
                parId: 'par',
                childArr: testArr
        	  };

$.ajax({
    url: '/api/requestBodyTest',
    type: 'POST',
    contentType: 'application/json',
    data: JSON.stringify(testObj),
    success: function (data) {
        console.log(data);
    },
    error: function (jqXHR, textStatus, errorThrown) {
        console.error('Error:', textStatus, errorThrown);
    }
});

 

 

 

 

📍 model

public class MyModel {
    private String parId;
    private List<Child> childArr;

    // Getters 및 Setters

    public String getParId() {
        return parId;
    }

    public void setParId(String parId) {
        this.parId = parId;
    }

    public List<Child> getChildArr() {
        return childArr;
    }

    public void setChildArr(List<Child> childArr) {
        this.childArr = childArr;
    }
}

public class Child {
    private String id;
    private String name;

    // Getters 및 Setters
}

 

 

 

 

 

📍 controller

import org.springframework.http.ResponseEntity;
import org.springframework.web.bind.annotation.*;

// @RestController // 이거 안 쓰고 해당 매서드에 @ResponseBody 넣어도 됨!
@RequestMapping("/api")
public class MyController {
	
    @ResponseBody
    @PostMapping("/requestBodyTest")
    public ResponseEntity<MyModel> requestBodyTest(@RequestBody MyModel model) {
        // 모델을 로그로 출력 (디버깅 용도)
        System.out.println(model);
        
        // 성공적으로 처리되었음을 알리는 응답 반환
        return ResponseEntity.ok(model);
    }
    
    /////// 추가 ///////
    @ResponseBody
    @PostMapping("/requestBodyChildArrListTest")
    public String requestBodyChildArrListTest(@RequestBody ArrayList<childVO> childVOList) {
        return childVOList.toString(); 
        // [ChildVO[id=1, name=test1], ChildVO[id=2, name=test2] ``` ]
    }
}

---

출처 : 

 

 

 

---

개발 공부를 위한 블로그 입니다. 

오류가 있다면 댓글로 알려주세요! 

감사합니다.