Good day to all.

I am trying to save text from CKEditor to a file using JavaScript or to load it from a file, but so far to no avail.
For a long time I tried to find something on the Internet, but so far I was able to implement it only with the help of PHP .
Can you give me a quick example of how to do this with JavaScript ?

    1 answer 1

    Here is a mini text editor where you can load text from a file, edit it and save it back.

     let file_name = 'Result.txt'; const textarea = document.getElementById('text'); // editor = CKEDITOR.replace(textarea); const files = document.getElementById('files'); // Создать файл function generate_file(data){ data = new Blob(["\ufeff", [data]], {type:'plain/text'}); return window.URL.createObjectURL(data); } // Прочесть файл function read_file(file) { const reader = new FileReader(); reader.onload = () => { const text = reader.result; textarea.value = text; // Для CKEditor вместо строчки выше: // editor.setData(text); make_download(text, file.name); }; reader.readAsText(file); } // Создание ссылки для скачивания function make_download(content, name = file_name){ const download_link = document.getElementsByTagName('a')[0]; download_link.innerText = name; download_link.download = name; download_link.href = generate_file(content); } // Вешаем обработчики files.addEventListener('change', () => { read_file(files.files[0]); file_name = files.files[0].name; }, false); textarea.onchange = e => make_download(textarea.value) /* Для CKEditor, вместо строчки выше пишем - editor.on('change', () => { make_download(editor.getData()) }); он почему то не хочет работать в сниппетах */ 
     textarea{ width: 100%; height: 50px; } 
     <textarea id="text"></textarea><br/> <input type="file" id="files" /><br/> <a download='result.txt'>Download</a>

    • Thanks, but I need an example with CKEditor - user255391
    • For CKEditor, everything is practically the same, the only difference is how to hang up the handler and how to get text from it. added sample code to end - Darth