Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>The template in your jsfiddle example:</p> <pre><code>{{#each subjects}} &lt;li&gt;{{subject_name}}&lt;/li&gt; {{/each}} &lt;table class="table"&gt; {{#each subjects}} &lt;tr&gt; &lt;td&gt;{{subject_name}}&lt;/td&gt; &lt;/tr&gt; {{else}} &lt;tr&gt; &lt;td colspan="4"&gt;No Subjects Added Yet.&lt;/td&gt; &lt;/tr&gt; {{/each}} &lt;/table&gt; </code></pre> <p>is not valid HTML. If you put that inside a <code>&lt;div&gt;</code> (even a hidden one), the browser will often try to rewrite it to make it valid HTML. That clean up process generally butchers your template.</p> <p>You need to put your template inside something that the browser won't try to interpret. The standard solution is to use a <a href="http://www.w3.org/TR/html-markup/script.html" rel="nofollow"><code>&lt;script&gt;</code></a> with an appropriate content type:</p> <pre><code>&lt;script id="subjectlist" type="text/x-handlebars"&gt; ... &lt;/script&gt; </code></pre> <p>Also, an <code>&lt;li&gt;</code> needs to have a <a href="http://www.w3.org/TR/html-markup/li.html#li-context" rel="nofollow"><code>&lt;ul&gt;</code>, <code>&lt;ol&gt;</code>, or <code>&lt;menu&gt;</code> parent</a> so your jsfiddle template should look more like this:</p> <pre><code>&lt;script id="subjectList" type="text/x-handlebars"&gt; &lt;ul&gt; {{#each subjects}} &lt;li&gt;{{subject_name}}&lt;/li&gt; {{/each}} &lt;/ul&gt; ... &lt;/script&gt; </code></pre> <p>Demo: <a href="http://jsfiddle.net/ambiguous/kxc52/" rel="nofollow">http://jsfiddle.net/ambiguous/kxc52/</a></p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
    3. VO
      singulars
      1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload