Question

Hi I have a problem with dojo’s domConstruct.toDom and domConstruct.place.
Which ever I use both domConstruct functions or only domConstruct.place, I can’t seem to
place the long html list tags.
Please see my script below:

var row = domConstruct.toDom('<ul id="list">
<li class="odd">
    <div class="bold">
        <a class="odd">Odd</a>
    </div>
</li>
<li class="even">
    <div class="italic">
        <a class="even">Even</a>
    </div>
</li>
<li class="odd">
    <a class="odd">Odd</a>
</li>
<li class="even">
    <div class="bold">
        <a class="even">Even</a>
    </div>
</li>
<li class="odd">
    <div class="italic">
        <a class="odd">Odd</a>
    </div>
</li>
<li class="even">
    <a class="even">Even</a>
</li>

<ul id="list2">
<li class="odd">Odd</li></ul>');

domConstruct.place(row,"CPane_Chart");

Please advise, thanks in advance

Clement

Answer 1

The problem isn’t Dojo, it’s that you can’t have multi-line strings in JavaScript unless you escape the new line with a \ at the end. So you could do something like this:

var row = domConstruct.toDom('<ul id="list"> \
<li class="odd"> \
    <div class="bold"> \
        <a class="odd">Odd</a> \
....
<li class="odd">Odd</li></ul>');

Personally, though, I prefer putting HTML like this into an external HTML file and using dojo/text to load it:

require(["dojo/text!myListHtml.html"], function(myListHtml){
     var row = domConstruct.toDom(myListHtml);
});

See http://dojotoolkit.org/reference-guide/1.8/dojo/text.html