0

I am having an issue with initializing the inline link toolbar in a custom instance of the WP editor.

The instance is added in a dynamically loaded modal using the wp_editor function and some JavaScript. It has been working correctly up to WordPress 4.5, but is now broken.

There are some parts that work. When I click the button to add/edit a link, the text does get highlighted as a placeholder, it’s just that the toolbar does not show. The markup for the TinyMCE plugins does get added to the bottom of the document and if I open and close the media editor attached to the new instance, the inline link toolbar will then function correctly.

There are no JavaScript errors when the toolbar is not functioning correctly, it just doesn’t seem as if the JavaScript handlers are bound correctly or something.

I would really appreciate any help or advice that anyone might have.

Here is the JS code I use to initialize the WP editor instance.

var $element = jQuery('#newcontent');
var qt;
var textfield_id = $element.attr('id');

window.tinyMCEPreInit.mceInit[textfield_id] = _.extend({}, tinyMCEPreInit.mceInit['content']);

if(_.isUndefined(tinyMCEPreInit.qtInit[textfield_id])) {
    window.tinyMCEPreInit.qtInit[textfield_id] = _.extend({}, tinyMCEPreInit.qtInit['replycontent'], {id: textfield_id})
}
qt = quicktags( window.tinyMCEPreInit.qtInit[textfield_id] );
QTags._buttonsInit();

//make compatable with TinyMCE 4 which is used starting with WordPress 3.9
if (tinymce.majorVersion === "4") {
    tinymce.execCommand( 'mceAddEditor', false, textfield_id );
}

window.switchEditors.go(textfield_id, 'tinymce');
//focus on this RTE
tinyMCE.get(textfield_id).focus();
window.wpActiveEditor = textfield_id;

An update, this issue does appear to be tied in with the Bootstrap modal in which I am adding the instance of wp_editor. I am not sure what about opening and closing the WordPress media modal makes this come un-stuck. I have tried manually re-focusing on the wpbody-content ID when the modal / editor is initialized using the following code, but that did not work. jQuery(#wpbody-content’).focus();


Edit, solved.. it turns out the link dialog does not work if the body has the "modal-open" class.

  • An update, this issue does appear to be tied in with the Bootstrap modal in which I am adding the instance of wp_editor. I am not sure what about opening and closing the WordPress media modal makes this come un-stuck. I have tried manually re-focusing on the wpbody-content ID when the modal / editor is initialized using the following code, but that did not work. jQuery(#wpbody-content’).focus(); – JChew May 5 '16 at 16:15
  • Please add updates as edit to your question or to your answer. Thanks. – kaiser May 5 '16 at 23:02
  • Why this question is a copy/paste of the following wp.org topic? wordpress.org/support/topic/… – vard Jan 16 '17 at 11:22
-1

Solved.. it turns out the link dialog does not work if the body has the "modal-open" class.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.