Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Correctly format boolean tag attributes with tinymce editor plugin

i am building a plugin for tinymce editor which adds some microdata to selected text, and i want to make sure the final markup will be valid. as specified by the draft microdata spec, a new item is indicated by adding the attribute itemscope to an element, for example:

<section itemscope itemtype="http://example.com/vocab/someobject" itemid="someid" >
<meta itemprop="topic" content="something very interesting" />
  ....
  other microdata stuff
</section> 

i have extended the configuration parameters of tinymce to recognize these microdata attributes:

tinyMCE.init({
    ...
    schema: "html5",
    extended_valid_elements:"@[itemscope|itemtype|itemid|itemprop|content],div,span,time[datetime]"
    ...
});

and things are generally working. however, when i use the plugin, tiny mce is still "correcting" my markup by adding an empty value to the itemscope attribute, like so: itemscope="". but the itemscope attribute is a boolean element, which AFAIU means that it should have no value.

so the question is, a) is it still valid markup if the itemscope attribute has a value? and b) if not, (how) can i configure tinymce to leave itemscope as a proper boolean attribute, and not append the ="" bit?

thanks!

like image 580
jessykate Avatar asked Apr 16 '12 02:04

jessykate


People also ask

How do I set HTML content in TinyMCE?

The TinyMCE getContent and setContent methods You can do this using the getContent() API method. Let's say you have initialized the editor on a textarea with id=”myTextarea”. This will return the content in the editor marked up as HTML.

How do you add CSS to TinyMCE editor?

These content CSS files can be enabled in the editor using the content_css configuration option. Copied! These content CSS files can also be used as a template for creating a custom content CSS file for the editor. For the CSS files, see: tinymce-dist GitHub Repository - Content CSS files.


1 Answers

The value of a boolean attribute must either be the empty string, or the name of the attribute itself. So, <div itemscope>, <div itemscope="">, and <div itemscope="itemscope"> are all equivalent.

like image 159
cygri Avatar answered Sep 23 '22 21:09

cygri