Think In Geek

In geek we trust

TinyMCE checkbox toggler for jQuery

Here’s a small jQuery code snippet that you can use to have an easy to use checkbox toggler to enable or disable a TinyMCE editor with ease (tested on TinyMCE version 4 and jQuery version 2.1.1).

It’s really easy to use. You just need to create a checkbox element with the class tiny_mce_toggler and a data attribute with the key editor and the text area id used as a TinyMCE editor as a value. The snippet can be easily extracted if you want to use it differently.

Here is the javascript snippet:

$(function() {
  var TinyMceToggler = function(_checkbox){
    var checkbox = $(_checkbox);
    var editor ='editor');{
      if (this.checked) {
        tinyMCE.execCommand( 'mceAddEditor', false, editor );
      else {
        tinyMCE.execCommand( 'mceRemoveEditor', false, editor );

    new TinyMceToggler(this);

And here you can see how to integrate it on a page with a TinyMCE editor:

  TinyMCE - Toggler

You can run the example on this fiddle:

, ,

Leave a Reply

Your email address will not be published. Required fields are marked *