OK. i know may be this question has been asked before :

Here

But my question is that how can i call a plugin function from outside button not from toolbar button.

I have added a custom plugins:

tinymce.PluginManager.add('example', function(e) {
        function customfunction(){
                    e.focus(true);
                    alert('Hello TinyMce');
            }
        }
);

Check this on Fiddle

and i am calling this customfunction from other function which is called when i click on Custom Button. Like this:

function clickme()
{
   tinymce.get('textareaid').plugins.example.customfunction();

}

Button:

<button onclick="clickme()" >Custom Button</button>

But it is not working for me?

Am i doing right thing by calling custom plugin function with that way?

Am i missing anything?

OK. i know may be this question has been asked before :

Here

But my question is that how can i call a plugin function from outside button not from toolbar button.

I have added a custom plugins:

tinymce.PluginManager.add('example', function(e) {
        function customfunction(){
                    e.focus(true);
                    alert('Hello TinyMce');
            }
        }
);

Check this on Fiddle

and i am calling this customfunction from other function which is called when i click on Custom Button. Like this:

function clickme()
{
   tinymce.get('textareaid').plugins.example.customfunction();

}

Button:

<button onclick="clickme()" >Custom Button</button>

But it is not working for me?

Am i doing right thing by calling custom plugin function with that way?

Am i missing anything?

• javascript
• tinymce-4

Share Improve this question Follow edited May 23, 2017 at 12:17 CommunityBot 111 silver badge asked May 25, 2014 at 9:57 Shail ParasShail Paras 1,16322 gold badges1414 silver badges3535 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 3

One possibility would be to add a button with a unique ID to the toolbar and call the click event of the button. The plugin would look like this:

tinymce.PluginManager.add('example', function(e) {

        function customfunction() {
                    e.focus(true);
                    alert('Hello TinyMce');
            }


        e.addButton('testButton', {
            id: "testButton",
            text: 'Example',
            icon: false,
            onclick: function() {
                    // calls the custom function
                    customfunction();
                }
            });
    }
);

Then initialise the tinymce editor like this:

tinymce.init({
    selector: "textarea",
    plugins: "example",
    // show the button
    toolbar: "testButton undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image"
});

Finally call the button click event:

function clickme()
{
   document.getElementById("testButton").click();
}

Don't use the add_filter. The plete code form your tinymce fiddle:

<script type="text/javascript">
tinymce.PluginManager.add('example', function(e) {
        function customfunction() {
                    e.focus(true);
                    alert('Hello TinyMce');
            }


    e.addButton('testButton', {
        id: "testButton",
        text: 'Example',
        icon: false,
        onclick: function() {
                customfunction();
            }
        });
}
);

tinymce.init({
    selector: "textarea",
    plugins: "example",
    toolbar: "testButton undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image"
});
//add_filter('mce_external_plugins', 'example');
function clickme()
{
   document.getElementById("testButton").click();
}

</script>

<form method="post" action="">
    <textarea name="content" id="textareaid"></textarea>
</form>

<button onclick="clickme();" >abc</button>

your function is stored in

tinymce.PluginManager.items[0]

inspecting the dom you can see that function. try to alert it