title: CKEditor sourcedialog get html data
body: <p>I am struggling to get the HTML data from the sourcedialog in ckeditor.</p>
  
  <p>I can get the HTML data from the editor itself, no problem. But getting it from the dialog is a pain in the ass.</p>
  
  <p>I want to display a live preview of the HTML entered in the source dialog, and for that I need the HTML data, not from the editor, but from the dialog which the user is editing.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>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");
      });
    }
  });</code></pre>
  </div>
  </div>
  </p>
  
  <p>This is what I have so far (sorry about all the console.logs, this is work in progress). I am obviously getting HTML data from the varible: htmlData, but this is from the editor, not the dialog.</p>