joon
joon

Reputation: 864

How do I get the values from my TinyMCE plugin back?

I'm in the process of making an extra button on the TinyMCE toolbar (it's for Wordpress but I don't think that matters).

Button is pressed and a form is shown, I'm just at a total loss in configuring it so that the values entered on the form are actually transmitted into the rest of the tinyMce plugin.

The only relevant docs I have found is this page where they show you to implement a custom browser. But it's rather cryptic for a first timer (or at least for me).

Here's what I have:

This is executed when the button is pressed:

ed.windowManager.open({
    file : url + '/dialog.html',
    width : 400,
    height : 120,
    inline : 1
}, {
    plugin_url : url, // Plugin absolute URL
    some_custom_arg : 'custom arg' // Custom argument
});

This is the contents of the dialog.html file

<html>
<head>
<title>Hello world!</title>
</head>
<body>
<form name="Hello world" method="post">
        <input size="30" name="textbox1"  type="text" id="textbox1" />
        <input type="submit" value="" name="submitbutton" />
    </form>
</body>
</html>

Obviously this does nothing (not even close the dialog), but I don't really know where to start looking for it to do something.

Upvotes: 8

Views: 4120

Answers (2)

Brett Henderson
Brett Henderson

Reputation: 1684

I answered this on the MoxieCode forums but have added my response here for others.

The example plugin that is included in TinyMCE should help and is used in the tutorial on creating a plugin

Looking at the plugin, in the js directory you will find a JavaScript library dialog.js that contains the method called when you click on submit in the example dialog. It essentially just uses the mceInsertContent via the execCommand to insert the value into the editor.

So in your example, first thing you will need to do is alter your form to call a JavaScript method when you submit. Then you will need to create that method to do whatever it is you want insert into TinyMCE.

Upvotes: 3

Thariama
Thariama

Reputation: 50832

The tinymce examples are really the place to have a look at. Additional to the info Brett has given already you may also refer to the calling tinymce instance and place variables there or you can call a function of one of your own plugins.

Examples:

// insertion of content into the calling editor instance
tinyMCEPopup.execCommand('mceInsertContent', false, 'my_content';

// store value in editor variable
tinyMCEPopup.editor.new_variable = 'new_special_blah';

// call a function from an own plugin
tinyMCEPopup.editor.plugins.my_plugin.my_custom_function(var1, var2);

Upvotes: 1

Related Questions