Clever Geek Handbook

Get content with tinyMCE?

I have tinyMCE textarea #frmbody and I am using a jquery instance of it.

<textarea class="tinymce" name="frmbody" id="frmbody" cols="30" rows="20"></textarea>

I am trying to get the content of a textbox as a custom type.

$("#frmbody").live('keyup', function(e) {
    alert("keyup");
});

The code above doesn't work and I'm not sure why. If I delete the tinyMCE instance the code above works fine. Any ideas?

+3


source to share


5 answers


This is because the TinyMCE instance is not a true text field, so no keyup events are detected. Try onchange callback instead .



+2


source


You can make your own tinyMCE listener: http://www.tinymce.com/wiki.php/API3:event.tinymce.Editor.onKeyUp



or write your own and use the built-in getContent function: http://www.tinymce.com/wiki.php/API3:method.tinymce.Editor.getContent

+1


source


One can simply grab the content of the editor using:

tinymce.activeEditor.getContent();

If you want to add an onchange event, according to this page http://www.tinymce.com/wiki.php/api4:class.tinymce.Editor , create an editor using the following code:

var ed = new tinymce.Editor('textarea_id', { 
    init_setting_item: 1,
    ...
}, tinymce.EditorManager);

ed.on('change', function(e) {
    var content = ed.getContent();
    $("#textarea_id").val(content); // update the original textarea with the content
    console.log(content);
});

ed.render();

Note that onchange is fire, when the user is not focused, press enter or press a button on the toolbar instead of every key press.

+1


source


It is very easy to write your own handler and assign it to the iframe document editor. There are tinymce handlers for various events which are already defined as keyUp

Here is the standard way to assign custom handler for iframe document editor

var my_handler = function(event) {
    alert('my handler fired!');
};

var ed = tinymce.get('my_editor_id');
$(ed.getDoc()).bind('keyup', my_handler);
0


source


TinyMCE hides the text area and creates an html container. If you write content in a box, its an iFrame named "TEXTAREANAME_ifr"

.

So try this:

$("#frmbody_ifr").live('keyup', function(e) {
    alert("keyup");
});

I think, as Tariama already said, TinyMCE's EventHandler would be the best way.

0


source






More articles:


All Articles