Double Quotes in Single Quotes

Question

I need to put json in an html attribute like so:

<video id="video1" 
class="video-js vjs-default-skin" 
width="640" height="480" 
data-setup='{"controls" : true, "autoplay" : false, "preload" : "auto"}'>

Hamlet does not understand html single quote strings, it creates the error message:

unexpected ":" expecting ">"

What is the recommended practice for adding literal json to html attributes in a string?

Answer 1

Escape the quotes in html using "

<video id="video1" 
class="video-js vjs-default-skin" 
width="640" height="480" 
data-setup='{ &quot;controls&quot;:true,&quot;autoplay&quot;:false,&quot;preload&quot;: &quot;auto&quot;}'>

Answer 2

The attribute syntax used is correct by HTML rules, and the attribute value is correct by JSON syntax, so if some software fails to process it, check its documentation for applicable limitations and/or submit a bug report.

If the issue is really that the software cannot handle HTML attribute specifications when attribute value is single quotes, use double quotes around it and correspondinly single quotes inside it:

data-setup="{'controls' : true, 'autoplay' : false, 'preload' : 'auto'}"