th:each 와 버튼
다음과 같이 화면을 구상하였는데, th:each 로 인해 생성된 버튼에 연결된 함수가 첫번째 버튼에서만 동작하고 나머지 버튼에서는 동작하지 않았다.
즉, 정상적이라면 th:each 로 생성된 제목2 아래의 점선 버튼을 클릭하더라도 Add Card 모달이 떠야한다. 하지만 슬프게도 뜨지 않았다,,
해결방안
여러가지 경우를 검색해보다가 다음과 같은 글을 발견했다. 그리고 내용을 약간 수정해보았다.
원래 코드
•
thymeleaf
•
javascript
수정코드
•
thymeleaf
◦
onclick 을 th:onclick 으로 바꿔주었고, 함수에 변수를 넣었을 때 잘 동작이 되는지 확인하기 위하여 th:each 에서 todolist 로 받아온 객체를 넘겨주었다.
•
javascript
◦
모달창을 띄우는것이 중요했기 때문에 코드를 다음과 같이 수정해주었다.
◦
그리고 콘솔에 값이 잘 찍히는지 확인해보았다.
버튼을 클릭하면 값이 잘 출력되는것을 확인하였고, 모달창도 잘 떴다!(감격)