소개
게시글
질문&답변
2023.05.30
bootstrap 팝업창 만들기 단원에서 질문있습니다.
답변 감사합니다 !제가 질문을 자세히 하지 않은 것 같아 다시 질문 드립니다. (사진)모달창에 text를 띄우는 것까지는 완료하였지만, 삭제에 대한 작업이 정상적으로 이루어지지 않고 있습니다. 아래 코드 중 modalFooter.setAttribute = ('href', '/todo/' + id + '/delete2/') 에 해당하는 부분을 어떤 식으로 바꿔야 할지 알려주시면 감사하겠습니다 !
- 0
- 5
- 725
질문&답변
2023.05.29
bootstrap 팝업창 만들기 단원에서 질문있습니다.
같은 질문입니다.bootstrap 버전업 및 코드 수정하여 name에 따른 todo를 모달 창에 띄우는 것까진 해결하였으나, 삭제에 대한 방법을 모르겠어서 글 올립니다. 아래 html 파일 올려드립니다 {% extends 'base.html' %} {% block title %}todo_from.html{% endblock %} {% block extra-style %} Vue-Django ToDo App body { text-align: center; background-color: #ddd; } .inputBox { margin: auto; width: 70%; background: white; height: 50px; border-radius: 50px; line-height: 50px; } .inputBox .name { border-style: none; border-bottom: 1px solid #ddd; width: 90px; padding-left: 20px; line-height: 20px; } .inputBox .item { border-style: none; border-bottom: 1px solid #ddd; width: 400px; margin-left: 50px; padding-left: 20px; line-height: 20px; } .todoList { list-style: none; padding: 10px 0; text-align: left; } .todoList li { display: flex; height: 50px; line-height: 50px; margin: 0.5rem 0; padding: 0 0.9rem; background: white; border-radius: 5px; } .removeBtn { margin-left: auto; font-size: 20px; } .removeBtn:hover{ color: red; } .modal-footer a { color: white; } {% endblock %} {% block content %} My Todo App ! 서로 할 일이나 의견을 공유해 봅시다. {% csrf_token %} ADD {% for todo in object_list %} {{ todo.name }}:: {{ todo.todo }} × {% endfor %} Are you sure to delete ? body-text Cancel Delete {% endblock %} {% block extra-script %} myModal.addEventListener('show.bs.modal', event => { const button = event.relatedTarget const id = button.getAttribute('data-id') const name = button.getAttribute('data-name') const todo = button.getAttribute('data-todo') const modalBody = myModal.querySelector('.modal-body') const modalFooter = myModal.querySelector('.modal-footer a') modalBody.textContent = name + '::' + todo modalFooter.setAttribute = ('href', '/todo/' + id + '/delete2/') }) {% endblock %}
- 0
- 5
- 725