TheTC TheTC - 7 months ago 27
Javascript Question

Can't seem to close tinymce 4 popup from a custom plugin

I have created a custom plugin inside of tinyMCE 4. It pops up a modal window and displays images in a said directory. You pick the image, then it adds it to the content and closes the popup. I have it inserting the image into the content, but I can't seem to close the popup. I've tried many different ways and none of them work.

One of the errors I get is:

Uncaught TypeError: Cannot read property 'win' of undefined


That's happening with the current code which follows:

Plugin:

tinymce.PluginManager.add('imageuploads', function(editor, url) {
// Add a button that opens a window
editor.addButton('imageuploads', {
text: 'Insert Image',
icon: false,
onclick: function() {
// Open window
editor.windowManager.open({
title: "Insert Uploaded Image",
url: 'insertimage.php',
width: 700,
height: 600,
inline: true,
close_previous: "yes"
});
}
});
});


Plugin File:

$(document).ready(function(){
$('#submit-image-url').bind('click', function(){
var image_url = $('.image_choice:checked').val();
var insert_url = '<img src="/editor/uploads/' + image_url + '">';

parent.tinymce.activeEditor.selection.setContent(insert_url);
parent.tinymce.activeEditor.windowManager.close(this);
});
});


There is some HTML before that, but all it is is the images listed out with a radio input to determine which one is selected. Inserting works, but I can't seem to close the popup.

Any help would be greatly appreciated! Thanks!

The errors are coming from tinymce.js on line #22746, so the close() method is getting called. It just can't see the popup for some reason.

Answer

I fixed it with the following:

var ed = parent.tinymce.editors[0];
ed.windowManager.windows[0].close();

So, now my jQuery code looks like this:

$('.image_choice').bind('click', function(){
    var image_url = $('.image_choice:checked').val();
    var insert_url = '<img src="/editor/uploads/' + image_url + '">';

    parent.tinymce.activeEditor.selection.setContent(insert_url);

    var ed = parent.tinymce.editors[0];
    ed.windowManager.windows[0].close();
});

I hope this helps someone that runs into the same problem. This one puzzled me for a few days now.