I have this code to enable CKEditor from their website, but I don't know how to interact with it. How do I get data from it using javascript or jquery?

ClassicEditor
  .create(document.querySelector('#editor'))
  .then(editor => {
    console.log(editor);
  })
  .catch(error => {
    console.error(error);
  });

<script src=".0.1/classic/ckeditor.js"></script>
<textarea name="content" id="editor">
<p>Here goes the initial content of the editor.</p>
</textarea>

I have this code to enable CKEditor from their website, but I don't know how to interact with it. How do I get data from it using javascript or jquery?

ClassicEditor
  .create(document.querySelector('#editor'))
  .then(editor => {
    console.log(editor);
  })
  .catch(error => {
    console.error(error);
  });

<script src="https://cdn.ckeditor./ckeditor5/10.0.1/classic/ckeditor.js"></script>
<textarea name="content" id="editor">
<p>Here goes the initial content of the editor.</p>
</textarea>

• javascript
• jquery
• html
• ckeditor5

• 1 Have you read the (Docs)[docs.ckeditor./ckeditor5/latest/builds/guides/integration/… about ckEditor? Maybe here is the answer – law_81 Commented Jun 18, 2018 at 14:17
• Possible duplicate of Get text from CK Editor textarea in JQuery – Troyer Commented Jun 18, 2018 at 14:25
• Possible duplicate of How to get value of CKEditor 5? – Reinmar Commented Jun 19, 2018 at 6:50

1 Answer 1

Please see the changes I have applied to your code snippet.

let theEditor;

ClassicEditor
  .create(document.querySelector('#editor'))
  .then(editor => {
    theEditor = editor;

  })
  .catch(error => {
    console.error(error);
  });


function getDataFromTheEditor() {
  return theEditor.getData();
}

document.getElementById('getdata').addEventListener('click', () => {
  alert(getDataFromTheEditor());
});

<script src="https://cdn.ckeditor./ckeditor5/10.0.1/classic/ckeditor.js"></script>
<textarea name="content" id="editor">
<p>Here goes the initial content of the editor.</p>
</textarea>
<button id="getdata">Print data</button>