Question

I have a page and want to use TinyMCE to edit certain elements on the page. When I am trying to edit the following elements, the actual content loaded inside tinyMCE is as present in column 2

Original : As loaded in MCE
<dd>1234<span></span></dd> : 1234<span></span>
<tr><td><label>A</label></td><td>B</td></tr> : <label>A</label>B

I understand there is some html validation going on which checks the parent child element relationships (e.g. tr should come only if there is table as parent). Is there a way I can tell tinyMCE to stop doing this and allow me to edit tr elements directly without editing the complete table elements. i.e. I want to stop tinyMCE to make any change in the loaded HTML irrespective its valid or not.

Also, I tried the verify_html and valid_elements settings but seems not helping here

Thanks

Answer 1

You got two options here

1. You use the cleanup: false, tinymce init setting which will
   disable the html checking

or you can use the better option

2.. and define which elements and childelements the editor should accept as valid

In your case your valid_elements do niot need to get updated, cause tr, td and label are already valid elements by default (but you may define them invalid if you like).
What you will need to do is to add them as valid children to the valid_children setting.
If you want to define tr tags as valid child elements of p-tags and other elements you will need to set something like this

    valid_children: "body[p|ol|ul]" +
    ",p[a|span|b|i|u|sup|sub|img|hr|#text|tr|td|label]" +
    ",span[a|b|i|u|sup|sub|img|#text|tr|td|label]" +
    ",a[span|b|i|u|sup|sub|img|#text|tr|td|label]" +
    ",b[span|a|i|u|sup|sub|img|#text|tr|td|label]" +
    ",i[span|a|b|u|sup|sub|img|#text|tr|td|label]" +
    ",sup[span|a|i|b|u|sub|img|#text|tr|td|label]" +
    ",sub[span|a|i|b|u|sup|img|#text|tr|td|label]" +
    ",li[span|a|b|i|u|sup|sub|img|ol|ul|#text]" +
    ",ol[li]" +
    ",ul[li]",