CKEditor sourcedialog get html data

Question

私はckeditorのソースコードからHTMLデータを取得するのに苦労しています。

私はエディタ自体からHTMLデータを取得できますが、問題はありません。しかしダイアログからそれを得ることは、お尻の痛みです。

ソースダイアログに入力されたHTMLのライブプレビューを表示したいのですが、エディターではなくユーザーが編集しているダイアログからHTMLデータが必要です。

CKEDITOR.on('dialogDefinition', function(ev) { 
 
    var editor = ev.editor; 
 
    var dialog = ev.data.definition.dialog; 
 
    var dialogName = ev.data.name; 
 
    var dialogDefinition = ev.data.definition; 
 
    var editorName = ev.editor.name; 
 
    var htmlData = CKEDITOR.instances[editorName].getData(); 
 

 
    if (dialogName == 'sourcedialog') { 
 
    dialog.on('show', function() { 
 
     //console.log(this.getSize().width); 
 
     console.log(this); 
 
     $("#sourcePreview").css("display", "block"); 
 
     $("#sourcePreview").html(htmlData); 
 

 
     $(".cke_dialog_ui_input_textarea textarea").on("keyup", function() { 
 
     //var dialogElementUpdated = dialogObj.getElement().getFirst(); 
 
     //console.log(editorData); 
 
     //$("#sourcePreview").html(htmlDataUpdated); 
 
     }); 
 
    }); 
 
    dialog.on('hide', function() { 
 
     console.log('dialog ' + dialogName + ' closed.'); 
 
     $("#sourcePreview").css("display", "none"); 
 
    }); 
 
    } 
 
});

これは私がこれまで持っているものです（申し訳ありませんすべてのconsole.logsについて、これは進行中の作業です）。私は明らかにHTMLデータをvarible：htmlDataから取得していますが、これはダイアログではなくエディタからのものです。

Answer 1

CKEditorは素晴らしいですが、ええ、それについては多くのことが、お尻の痛みです。

if (dialogName == 'sourcedialog') 
{ 
    dialog.on('show', function() 
    { 
    // 'input' is the correct event to listen to for a textarea, 
    // it fires on paste too. 
    this.getContentElement('main', 'data').getInputElement().on('input', function() 
    { 
     console.log('textarea contents: ' + this.$.value); 
    } 
    } 
}