Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Ignore/replace element attributes in TinyMCE

I have been searching without any results, does anyone here know how to ignore and/or replace element attributes in TinyMCE?

For example:

<table cellpadding="0" cellspacing="0" class="tdTable" style="margin: 0 20px 0 0;">

I would like to replace the code above to:

<table cellpadding="0" cellspacing="5">
like image 973
Alexander Palm Avatar asked Oct 09 '22 19:10

Alexander Palm


2 Answers

tinyMCE brings this functionality within its dom.parser:

    tinyMCE.activeEditor.dom.Serializer.addAttributeFilter('class,style', function(nodes, name) {
        for (var i = 0; i < nodes.length; i++) {
            console.log(nodes[i].name);
            tinyMCE.dom.setAttrib(nodes[i], 'class', null);
            tinyMCE.dom.setAttrib(nodes[i], 'style', null);
            // Process the nodes here (e.g. set attribute to null or delete Attribute)
        }
    });

You can also apply the change for the whole array:

    tinyMCE.activeEditor.dom.Serializer.addAttributeFilter('class', function(nodes, name) {
        tinyMCE.dom.setAttrib(nodes, 'class', null);
    });
    tinyMCE.activeEditor.dom.Serializer.addAttributeFilter('style', function(nodes, name) {
        tinyMCE.dom.setAttrib(nodes, 'style', null);
    });

See here for a complete documentation of the functions: http://www.tinymce.com/wiki.php/API3:namespace.tinymce.dom

like image 107
zuloo Avatar answered Oct 13 '22 12:10

zuloo


use the invalid_elements setting when initializing the editor for example, i use:

invalid_elements: '@[onclick|ondblclick|onmousedown|onmouseup|onmouseover|onmousemove|onmouseout|onkeypress|onkeydown|onkeyup],script,input,select,option,button,textarea,form',

to get rid of all the mentioned elements/attributes at the output text

like image 35
Avi Pinto Avatar answered Oct 13 '22 11:10

Avi Pinto