Question

I created CKEditor plugin that has some tabs and on each tab there is a different iframe. In those iframes are tables that have titles of some content on the site. I want to be able to click on a table row and have it insert the title of the clicked item.

The problem is I can't figure out how to add that kind of custom javascript to the plugin. I have the plugin.js which adds the init function for adding the button which when clicked executes the command to add the dialog window. Then in my myDialog.js I have the dialog window defined as such:

CKEDITOR.dialog.add( 'addLinkDialog', function( editor ) {
  return {
    title: 'Links',
    minWidth: 800,
    minHeight: 600,
    contents: [
      {
        id : 'articlesTab',
        label : Drupal.t('Articles'),
        title : Drupal.t('Articles'),
        elements : [
      /* {
            id : 'articlenid',
            type : 'text',
            label : Drupal.t('Article Node ID')
          }, */
          {
            type : 'html',
            html : '<iframe src="/links/articles?link=1" style="width:900px; height:600px;"></iframe>',
          }
        ]
      },
      {
        id : 'menuTab',
        label : Drupal.t('Menu Items'),
        title : Drupal.t('Menu Items'),
        elements : [
          {
            type : 'html',
            html : '<div>MENU TEST</div>',
          }
        ]
      },
      {
        id : 'videosTab',
        label : Drupal.t('Videos'),
        title : Drupal.t('Videos'),
        elements : [
          {
            type : 'html',
            html : '<div>VIDEOS TEST</div>',
          }
        ]
      }
    ],
    onOk: function() {
      var editor = this.getParentEditor();
      // var content = this.getValueOf( 'articlesTab', 'articlenid' );
      // alert(content);
    }
  };
});

I know that my onOk works when I click the button on the dialog window, but I'm just not sure how to grab information from the iframe, and where a function like that should go (in my plugin.js or myDialog.js?).

Was it helpful?

Solution

I ended up having to make another js file and include it on the iframe page, then use the parent.document selector with .find in jquery to manipulate dom elements outside of the iframe.

$(".videoUrlInput", parent.document).find('input.cke_dialog_ui_input_text').val(assetUrl);
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top