본문 바로가기
백수/자바스크립트

자바스크립트 테이블 형식 데이터 전송

728x90
반응형

자바스크립트 테이블 형식 데이터 전송

자바스크립트 : 

function dataSend(){
  // HTML 테이블 요소 가져오기
var table = document.getElementById('scrolltable');

// 테이블 헤더 가져오기
var headers = ['agncy', 'date', 'briefs', 'detail', 'amnt'];

// 테이블 데이터를 JavaScript 객체로 변환
var tableData = [];
for (var i = 1; i < table.rows.length; i++) {
    var rowData = {};
    for (var j = 0; j < table.rows[i].cells.length; j++) {
        rowData[headers[j]] = table.rows[i].cells[j].textContent;
    }
    tableData.push(rowData);
}

// JavaScript 객체를 JSON 문자열로 변환
var jsonData = JSON.stringify(tableData);
console.log(jsonData);
   // 서버로 데이터 전송
   
   fetch("/views/board/sendDataToServer.do", {
  method: "POST",
  headers: {
    "Content-Type": "application/json",
  },
  body: jsonData,
})
  .then((response) => response.json())
  .then((data) => console.log(data));	//응답값
}

스프링 부트 : 

    @PostMapping(value="/sendDataToServer.do")
    @ResponseBody
    public ResponseEntity<BoardVO> sendDataToServer(@RequestBody  List<BoardVO> map) {
        log.info(map.toString());
        BoardVO bvo = new BoardVO();
        return ResponseEntity.ok(bvo);
    }
728x90
반응형

'백수 > 자바스크립트' 카테고리의 다른 글

자바스크립트 행 추가  (0) 2023.11.11
html, 자바스크립트 엑셀 파일 읽기  (0) 2023.10.22