Использование jQuery для извлечения контента из iframe CKEditor

Question

У меня есть пользовательская CMS, которая использует CKEditor * (FCKEditor v3) для редактирования контента. Я также использую плагин jQuery Validation , чтобы проверить все поля на наличие ошибок перед отправкой на основе AJAX. Я использую функцию serialize () для передачи данных в бэкэнд PHP.

Проблема в том, что serialize удается правильно захватить все поля, кроме фактического содержимого, набранного в CKEditor. Как и любой другой редактор WYSIWYG, этот также накладывает iframe поверх существующего текстового поля. И сериализация игнорирует iframe и ищет только текстовое поле для содержимого, которое, конечно, не находит, возвращая пустое тело содержимого.

Мой подход к этому состоит в том, чтобы создать перехват для события CKEditor onchange и одновременно обновить текстовое поле (CKEDITOR.instances.[textboxname].getData() возвращает содержимое) или какое-либо другое скрытое поле с любым изменения, внесенные в редакторе.

Однако, поскольку CKEditor все еще находится на стадии бета-тестирования и остро не хватает документации, я не могу найти подходящий вызов API, который позволил бы мне это сделать.

Кто-нибудь знает, как это сделать?

Answer 1

Я думаю, что пользователь спрашивал о сериализации, я изо всех сил пытался сериализовать форму для отправки, и это доставляло мне много проблем.

Вот что у меня сработало:

$(document).ready(function() {
$('#form').submit(function(){
if ( CKEDITOR.instances.editor1.getData() == '' ){
    alert( 'There is no data available' );//an alert just to check if its working
}else{
    var editor_data = CKEDITOR.instances.editor1.getData();
    $("#editor1").val(editor_data); //at this point i give the value to the textarea
    $.ajax({ 
                    //do your ajax here  

                     });

        }
return false;
    });
 });

Answer 2

Я всю ночь пытался заставить это работать, но оно пока не работает. Не могли бы вы объяснить, где вы разместили этот скрипт?

Я генерирую свою страницу из xquery, поэтому я не могу поместить этот скрипт на страницу, потому что он содержит "{", что прерывает обработку xquery. Помещение скрипта в cdata нарушает работу скрипта. Поэтому я включил прослушиватель instanceReady в тот же сценарий, который создает редактор, и вызвал внешний сценарий для добавления остальных. например:

<script type="text/javascript">
  var editor = CKEDITOR.replace( 'editor1' );
  editor.on("instanceReady", updateInstance() )
</script>

, затем updateInstance содержит:

function updateInstance()
{
CKEDITOR.instances["editor1"].document.on('keydown', function(event)
{
    CKEDITOR.tools.setTimeout( function()
    { 
        $("#editor1").val(CKEDITOR.instances.editor1.getData()); 
    }, 0);
});

CKEDITOR.instances["editor1"].document.on('paste', function(event)
{
    CKEDITOR.tools.setTimeout( function()
    { 
        $("#editor1").val(CKEDITOR.instances.editor1.getData()); 
    }, 0);
});

}