How to get the input of a TinyMCE editor when using on the front-end?

I’m not sure why I haven’t been able to find this, but does anyone know how to get the input of the TinyMCE editor? I am using it in the front end and want to be able to save whatever the user has typed into the TinyMCE to a database but cannot find the best way to capture that value.

The two solutions that I’ve implemented with some success are:

  1. tinyMCE.activeEditor.getContent(); – This one seems to only get the value of the visual editor so if I’m in the HTML editor and make changes and then save, they aren’t picked up.

  2. $('#html_text_area_id').val(); – This one is the opposite, it only seems to get the value of the HTML editor.

I know there is a better way – I just can’t seem to find it…

p.s Yes, I’m going to implement security measures to make sure people can’t blow up the database.

6 s
6

Ok apparently WordPress keeps track of what kind of editor (visual or html) is active as a class which is added to the content wrapper so here is a solution that will get you the latest content in the editor

function get_tinymce_content(){
    if (jQuery("#wp-content-wrap").hasClass("tmce-active")){
        return tinyMCE.activeEditor.getContent();
    }else{
        return jQuery('#html_text_area_id').val();
    }
}

Leave a Comment