moffeltje moffeltje - 1 year ago 125
jQuery Question

How to tell if TinyMCE is initiated/created on a page?

I have a page with a canvas where a user can add text with the "add text" button. When the user clicks this, a new TinyMCE is created right on the canvas. I would like to change this new TinyMCE, but because I cannot access the tinyMCE creation code (the init) I got to have some kind of "on init listener" for TinyMCE in my `document.ready()'.

I know you can make a callback on init of the TinyMCE like this:

setup: function (ed) {
ed.on('init', function(args) {

But as I said I can't reach the creation code of the TinyMCE.

How can I check whether a new TinyMCE instance has been created (and use it in Javascript)?

Answer Source

If your page provides you a configuration object but you want to tweak its settings, you can always use JavaScript to modify/extend your standard init on a page by page basis.

For example, start with your standard configuration:

baseConfig = {
    selector: 'textarea'

...since this is just a simple JavaScript object you can inject additional properties/methods into that object before you use it to initialize TinyMCE.

For example:

 customConfig = {
    image_advtab: true,
    content_css : "CSS/content.css?"  + new Date().getTime(),
    setup: function (editor) {
        editor.on('init', function () {
            //Do what you need to do once TinyMCE is initialized

Then you can "inject" customConfig into baseConfig. The easiest way is to use jQuery's extend method:

$.extend(baseConfig, customConfig);

...this will take all the methods and properties from customConfig and add them to baseConfig. Once you are done you can then load TinyMCE using the newly updated baseConfig:


You can also use JavaScript to remove properties (read up on the delete) so you could also remove configuration properties that you don't want in your TinyMCE init.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download