Ckeditor обновление textarea

Question

Я пытаюсь заставить работать ckeditor. Очевидно, он не использует текстовую область, поэтому при отправке формы текст не отправляется в редактор. Поскольку я использую полиморфные ассоциации и т. Д., Я не могу сделать функцию onsubmit, чтобы получить значение текстовой области (при отправке формы).

Итак, я нашел этот вопрос: Использование jQuery для получения содержимого из iframe CKEditor

с некоторыми очень хорошими ответами. Ответы, размещенные там, обновляют текстовую область. Это очень мило и как раз то, что мне нужно! К сожалению, я не могу заставить его работать. Кто-нибудь знает, почему (например) это не работает?

У меня есть текстовая область (рельсы, но она просто переводится в обычную текстовую область):
<%= f.text_area :body, :id => 'ckeditor', :rows => 3 %>

И следующие js:

if(CKEDITOR.instances.ckeditor ) {
  CKEDITOR.remove(CKEDITOR.instances.ckeditor);
}
CKEDITOR.replace( 'ckeditor',
{
skin : 'kama',
toolbar :[['Styles', 'Format', '-', 'Bold', 'Italic', '-', 'NumberedList', 'BulletedList', 'Link']]});


CKEDITOR.instances["ckeditor"].on("instanceReady", function()
{
//set keyup event
this.document.on("keyup", CK_jQ);

//and paste event
this.document.on("paste", CK_jQ);
}

function CK_jQ()
{
 CKEDITOR.instances.ckeditor.updateElement(); 
}

Я получаю следующую «ошибку» в моем firebug.
missing ) after argument list [Break on this error] function CK_jQ()\n

Answer 1

Перед отправкой сделайте:

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

Answer 2

Вы поняли это?

Я использую CKEditor версии 3.6.1 с обработчиком отправки формы jQuery.При отправке текстовое поле пустое, что для меня не правильно.Однако есть простой обходной путь, который вы можете использовать, предполагая, что все ваши текстовые области CKEditor имеют класс css ckeditor .

$('textarea.ckeditor').each(function () {
   var $textarea = $(this);
   $textarea.val(CKEDITOR.instances[$textarea.attr('name')].getData());
});

Выполните вышеизложенное перед обработкой отправки, т.е.проверка формы.

Answer 3

Спасибо @JohnDel за информацию, и я использую onchange, чтобы она обновляла каждое изменение.

CKEDITOR.on('instanceReady', function(){
   $.each( CKEDITOR.instances, function(instance) {
    CKEDITOR.instances[instance].on("change", function(e) {
        for ( instance in CKEDITOR.instances )
        CKEDITOR.instances[instance].updateElement();
    });
   });
});

Answer 4

Сочетание всех вышеперечисленных ответов в один.

Создайте новый файл custom.js и добавьте его:

CKEDITOR.on('instanceReady', function(){
  $.each( CKEDITOR.instances, function(instance) {

    CKEDITOR.instances[instance].on("instanceReady", function() {
      this.document.on("keyup", CK_jQ);
      this.document.on("paste", CK_jQ);
      this.document.on("keypress", CK_jQ);
      this.document.on("blur", CK_jQ);
      this.document.on("change", CK_jQ);
    });
  });

});

function CK_jQ() {
  for ( var instance in CKEDITOR.instances ) { CKEDITOR.instances[instance].updateElement(); }
}

Вам не нужно беспокоиться о названии текстовой области, просто добавьте класс ckeditor в текстовую область, указанную выше, и все готово.

Answer 5

ДОБАВИТЬ Функция JavaScript для обновления

function CKupdate() {
  for (instance in CKEDITOR.instances)
    CKEDITOR.instances[instance].updateElement();
}

Это работа. Круто

Answer 6

Просто добавьте

CKEDITOR.instances.textAreaClientId.on('blur', function(){CKEDITOR.instances. textAreaClientId.updateElement();});

, где textAreaClientId - имя вашего экземпляра

С уважением

Answer 7

под нагрузкой:

$(function () {
  setTimeout(function () {
    function CK_jQ(instance) {
      return function () {
        CKEDITOR.instances[instance].updateElement();
      };
    }

    $.each(CKEDITOR.instances, function (instance) {
      CKEDITOR.instances[instance].on("keyup", CK_jQ(instance));
      CKEDITOR.instances[instance].on("paste", CK_jQ(instance));
      CKEDITOR.instances[instance].on("keypress", CK_jQ(instance));
      CKEDITOR.instances[instance].on("blur", CK_jQ(instance));
      CKEDITOR.instances[instance].on("change", CK_jQ(instance));
    });
  }, 0 /* 0 => To run after all */);
});

Answer 8

Все вышеприведенные ответы сосредоточены на том, как исправить эту ошибку, но я хочу получить ответ о том, что вызывает у меня эту ошибку

У меня был

<textarea class="ckeditor" rows="6" name="Cms[description]"></textarea>

изменено на

<textarea class="ckedit" rows="6" name="Cms[description]"></textarea>

Я изменил значение атрибута класса на что-либо, кроме ckeditor , и ошибка бума исчезла.

Надеюсь, что поможет

Answer 9

CKEDITOR.instances["ckeditor"].on("instanceReady", function()
{
//set keyup event
this.document.on("keyup", CK_jQ);

//and paste event
this.document.on("paste", CK_jQ);
})