자바스크립트 dataTable 질문입니다.

Question

안녕하세요 스프링과 자바스크립트의 dataTable을 통해서 게시판을 만들고 있는데, document.addEventListener("DOMContentLoaded", async ()=>{ const dataTable = new simpleDatatables.DataTable(#${tableId}); document.dataTables = {[tableId]:dataTable}; dataTable.on("datatable.init", dataTableReadBoardList);});const dataTableReadBoardList = async ()=>{ let dataTable = document.dataTables[tableId]; dataTable.data.data = []; dataTable.refresh(); let list = await boardList(); // fetch로 JSON의 형태로 게시글 리스트를 리턴 console.log(list); // 콘솔 결과 dataTable.insert(list);}콘솔을 찍어보면[ { "ifBoardId": "IF101", "ifBoardTitle": "qwd", "ifBoardContent": "qwd", "ifBoardCreationDate": [ 2024, 8, 10 ], "ifBoardDelyn": "N", "ifBoardLike": 0, "ifBoardNum": 0, "groupId": "GRP001", "memberId": "MEM002", "attachedFileId": "AFC083", "attachedFile": null, "ifBoardAnswersList": null }, { "ifBoardId": "IF104", "ifBoardTitle": "qwd", "ifBoardContent": "qwd", "ifBoardCreationDate": [ 2024, 8, 10 ]...]이렇게 JSON의 형태로 잘 나옵니다.simple-datatables 사이트에서 json 타입은dataTable.insert(list); 이렇게 insert를 하게 되면 값이 들어간다고 하는데,이렇게 실행을 하게 되면 게시글 수 만큼 게시판에 Showing 1 to 10 of 58 entries 이런 식으로 표현이 되는데,정작 데이터가 tbody에 적용되지 않습니다.어떤 부분이 부족한지 궁금합니다.감사합니다.

킁킁탐정 · Answer

받아온 데이터를 어떻게 다룰지에 대한 정의가 필요합니다. 데이터 형식이 key: value 형식인데, 이 형태를 어떤식으로 테이블로 표현할지 알려주어야합니다. 다음을 참고하세요.[1]https://github.com/fiduswriter/simple-datatables/blob/main/docs/demos/18-fetch-api/index.html#L35-L37https://github.com/fiduswriter/simple-datatables/blob/main/docs/demos/18-fetch-api/data.json[2]https://github.com/fiduswriter/simple-datatables/blob/main/docs/demos/27-load-json/index.html#L46-L59https://github.com/fiduswriter/simple-datatables/blob/main/docs/demos/27-load-json/initial_data.json[문서]https://fiduswriter.github.io/simple-datatables/documentation/API#datahttps://fiduswriter.github.io/simple-datatables/documentation/columns

자바스크립트 dataTable 질문입니다.

1개의 답변

Q&A 목록