개발자
CKEditor5 사용 중 중간저장 문의
CKEditor5를 저장하고 중간저장을 했는데, 수정페이지에서 textarea가 2개가 생기면서 하나는 입력했던 내용을 불러오는데 하나는 또 새롭게 에디터가 형성되는 현상이 발생하고 있는데요ㅠ 혹시 입력한 내용만 출력되는 에디터 하나만 표출될 수 있게끔 할 수 있는 방법은 없을까요? 이게 왜 2개가 나오는지 궁금합니다! 아 그리고 CKEditor를 한 페이지 내에서 다중으로 구현할 수 있는 방법은 없을까요?
답변 1
코드를 올려주시면 좋을 것 같습니다. 말씀해준 사항을 정리해보면 1. 저장을 했다. 2. 중간저장을 했다. 3. textarea가 두개가 생겼다 1번과 2번의 로직이 다른가요? 1번은 post방식으로 저장로직을 수행한다거나 2번은 get방식 저장로직을 수행한다거나 같은 2번 이후 html 작업을 하는 부분이 있나요? 1,2번 저장 후 페이지 리로딩 작업이 있나요? CKEditor는 일반적으로 페이지을 구성하는 단계에서 ckeditor 객체를 생성하고 textarea태그의 id를 매핑하는 것으로 알고 있습니다. 한페이지에서 여러개의 CKEditor를 사용하신다면 매핑할 textarea태그의 개수만큼 ckeditor 객체를 생성하고 매핑해주시면 될 것 같습니다.
익명
작성자
2023년 01월 09일
답변주셔서 감사합니다! 1. 중간저장 시 post 방식으로 저장로직을 수행하고, 2. 저장 시 에디터에 작성된 내용은 DB에 따로 입력되는 방식이 아닌, 텍스트에디터가 포함된 html파일 자체(div 태그에서 id 값)를 새로운 파일에다가 저장하고, 불러올 때도 저장된 파일을 불러오는 방식입니다! ex) <div id="html_data"> <input>.... <div>....</div> <textarea name="ckeditor1" id="ckeditor1"></textarea> <div>....</div> </div> 즉, js에서 html_data.outerHTML 하여 파라미터에 담아서 서버에 보내더라구요! 3. 디버깅을 찍어보면 html_data ="<textarea name="ckeditor1" id="ckeditor1"></textarea> <div class="ck ck-reset ck-editor ck-rounded-corners" role="application" dir="ltr" lang="ko" aria-labelledby="ck-editor__label_e832ca3a9d37b759dfa8eea4946b2dbf7"></div>" 이렇게 이미 div가 하나 더 생성되어 서버에 보냅니다. 4. 페이지 리로딩은 없습니다!
문석기
교보생명보험 프론트엔드 개발자 • 2023년 01월 10일
<div class="ck ck-reset ck-editor ck-rounded-corners" role="application" dir="ltr" lang="ko" aria-labelledby="ck-editor__label_e832ca3a9d37b759dfa8eea4946b2dbf7"></div> 이 부분은 ckeditor 가 붙은 모양인것 같은데 <textarea name="ckeditor1" id="ckeditor1"></textarea> <- 요녀석을 안보이게 스타일을 줘보시면 어떨까 합니다. display:none 이나 visibility:hidden
익명
작성자
2023년 01월 10일
답변 감사합니다!^^ 말씀하신 대로 해봤는데 현상은 같더라구요 ㅠ 심지어 한 번 저장할 때마다 새로운 에디터가 2개씩 붙는 상황이라 3,5,7… 이렇게 증가하는데 혹시 어느 곳을 더 찾아봐야 할까요??
문석기
교보생명보험 프론트엔드 개발자 • 2023년 01월 10일
혹시 ckeditor 생성하는부분을 계속 돌리고 있는지 체크해보시죠 ㅠ
지금 가입하면 모든 질문의 답변을 볼 수 있어요!
현직자들의 명쾌한 답변을 얻을 수 있어요.
이미 회원이신가요?
지금 가입하면 모든 질문의 답변을 볼 수 있어요!