Skip to content Skip to sidebar Skip to footer

How To Set Focus On Rich-text-field, In Edit-mode Of A Contenttype?

I'd like to initially set the focus onto the text-field of an item when editing it, but cannot overcome TinymMCE'S iframe kickin' in. When disableling TinyMCE, everything works as

Solution 1:

I know this is kind of old but I definitely struggled finding a solution for this online, so I'm sharing. Add this, in your tinymce.init() codeblock. Change selector or event if needed.

selector: "textarea.tinymce",
setup: function (editor) {
        editor.on('mouseup', function (e) {
        this.focus();
    });
}

Solution 2:

TinyMCE is loaded inside an IFRAME so it's not in the DOM of the main document. Direct jQuery calls will not work.

This is an old code I used (TinyMCE version shipped with Plone 4.3):

(function($) {

    functioncheckTinyMCELoaded () {

        if (window.tinymce==undefined || !tinymce.editors.length) {
            setTimeout(checkTinyMCELoaded, 100);
            return;
        }

        $('#text_ifr').contents().find(".mceContentBody").get(0).focus();

    }

    $(document).ready(function() {
        setTimeout(checkTinyMCELoaded, 100);
    });

})(jQuery);

It's ugly. Best way is to get rid of setTimeout and attach an handler on TinyMCE load event, but when I looked into this I found this is not so easy on Plone as you must change the .init() call of TinyMCE done by Plone JS.

Post a Comment for "How To Set Focus On Rich-text-field, In Edit-mode Of A Contenttype?"