Как я могу получить содержимое CKEditor, используя JQuery?

Question

Я использую CKEditor. Я сохраняю значения формы с помощью ajax, используя методы страницы.

Но содержимое значения CKEditor не может быть сохранено в таблицу.

Я не отправляю страницу обратно.

Что я могу сделать для этого?

Answer 1

используйте CKEditor.editor.getData () для экземпляра.То есть:

HTML

<textarea id="my-editor">
<input id="send" type="button" value="Send">

---

JS для CKEditor 4.0.x

$('#send').click(function() {
    var value = CKEDITOR.instances['DOM-ID-HERE'].getData()
    // send your ajax request with value
    // profit!
});

JS для CKEditor 3.6.x

var editor = CKEDITOR.editor.replace('my-editor');

$('#send').click(function() {
    var value = editor.getData();
    // send your ajax request with value
    // profit!
});

Answer 2

Если у вас нет ссылки на редактор, как в ответе Aeon, вы также можете использовать форму:

var value = CKEDITOR.instances['my-editor'].getData();

Answer 3

var value = CKEDITOR.instances['YourInstanceName'].getData()
 alert( value);

Замените YourInstanceName именем вашего экземпляра, и вы получите желаемый результат.

Answer 4

У меня были проблемы с getData(), который не работал каждый раз, особенно при работе с живым ajax

Был в состоянии обойти это, запустив:

for(var instanceName in CKEDITOR.instances){
    CKEDITOR.instances[instanceName].updateElement();
}

Затем используйте jquery для получения значения из текстовой области.

Answer 5

Спасибо Джону Магнолии. Это моя функция postForm, которую я использую в своих проектах Symfony, и теперь можно работать с CK Editor.

function postForm($form, callback)
{
  // Get all form values
  var values = {};
  var fields = {};

  for(var instanceName in CKEDITOR.instances){
      CKEDITOR.instances[instanceName].updateElement();
  }

  $.each($form.serializeArray(), function(i, field) {
      values[field.name] = field.value;
  });

  // Throw the form values to the server!
  $.ajax({
      type        : $form.attr('method'),
      url         : $form.attr('action'),
      data        : values,
      success     : function(data) {
          callback( data );
      }
  });

Answer 6

вы можете получить данные, как это:

<script>
var data = CKEDITOR.instances.editor1.getData();
// Your code to save "data", usually through Ajax.
</script>

ссылка: http://docs.ckeditor.com/#!/guide/dev_savedata

Answer 7

Теперь, когда jQuery адаптер существует, этот ответ необходимо обновить:

Скажем, вы запустили редактор с помощью $('.ckeditor').ckeditor(opt), а затем получили значение с $('.ckeditor').val()

Answer 8

Чтобы получить данные ckeditor, вам нужно получить экземпляр ckeditor

HTML код:

<textarea class="form-control" id="reply_mail_msg" name="message" rows="3" data-form-field="Message" placeholder="" autofocus="" style="display: none;"></textarea>

Javascript:

var ck_ed = CKEDITOR.instances.reply_mail_msg.getData();

Answer 9

версия 4.8.0

$('textarea').data('ckeditorInstance').getData();

Answer 10

Простой способ получить текст внутри редактора или его длину:)

 var editorText = CKEDITOR.instances['<%= your_editor.ClientID %>'].getData();
 alert(editorText);

 var editorTextLength = CKEDITOR.instances['<%= your_editor.ClientID %>'].getData().length;
 alert(editorTextLength);