19

I have to use the HTML 5 data attribute in Tiny MCE, but the editor always clear them, as it's not an attribute known by the default valid_elements configuration.

So I have 2 problems here:

  • the data attribute is dynamic ( it could be data-options, data-test, data-foo, etc... ) So I would need a wildcard value or something.
  • I want to allow the data attribute for all tags.

So far, I've tried:

extended_valid_elements : '@[id|class|title|style|data-options]',

And:

extended_valid_elements : '*[id|class|title|style|data*]',

But it doesn't work :(

Thariama
  • 50,002
  • 13
  • 138
  • 166
FMaz008
  • 11,161
  • 19
  • 68
  • 100

2 Answers2

7

extended_valid_elements is not the best choice here. Hava a look at the valid_elements setting. Here is an example

    // The valid_elements option defines which elements will remain in the edited text when the editor saves.
    valid_elements: "@[id|class|title|style|data-options|data*]," +
    "a[name|href|target|title]," +
    "#p,-ol,-ul,-li,br,img[src|height|width],-b,-i,-u," +
    "-span[data-mce-type],hr",
Jasper
  • 75,717
  • 14
  • 151
  • 146
Thariama
  • 50,002
  • 13
  • 138
  • 166
  • 6
    Why extended_valid_elements is not the best choice ? Also, from what I've understood, the valid_elements option must define all the tags&attribute, as it will override the default one (it will not add/append/merge my definition to the actual one). I don't want my TinyMCE initialization to be 300+lines longs at every place I need the editor... – FMaz008 Oct 13 '11 at 12:18
  • In this case you are not adding new elements to the editor. You want to add an attribute only. It might not be very concenient, but does it work using the valid_elements parameter? – Thariama Oct 13 '11 at 14:09
  • @Thariama , I am having the same issue as FMaz008, but with tinymce stripping out my input 'style' attribute. I have `valid_elements : "@[id|class|style|title|dir – govinda Apr 23 '12 at 22:44
  • yes, Thariama is correct. See here if you are using CodeIgniter and also thinking that tinymce is stripping out more than your tinymce config. says it should be stripping: http://stackoverflow.com/questions/10290121/how-to-prevent-tinymce-from-stripping-the-style-attribute-from-input-element/10308817#10308817 – govinda Apr 25 '12 at 03:10
4

I am using:

extended_valid_elements: "+@[data-options]"

and it works for me. (TinyMCE 4.3.11. Notice the + sign?)

s k
  • 4,342
  • 3
  • 42
  • 61
  • This works for me but custom attribute is not supported – Dipak Dendage Jun 27 '16 at 10:55
  • Sorry, this isn't working for me. Can you give a bit more details? – jhned Jan 12 '17 at 20:39
  • Thank you, saved my day. Custom attributes are indeed not supported, because AFAIK they are not valid HTML, but you can use HTML5 custom data attributes ("data-*", as in "data-myamazingcustomattribute") – Oskar Hýbl Aug 03 '17 at 09:00