Prefill jsrender template

Question

How to render the select (having the option) as part of the table?

 $('select').append($('<option>').text('single')); $('table').append($('#rowTmpl').render({name:'peter'})); 

 th,td {border:1px solid black;} 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://rawgit.com/BorisMoore/jsrender/master/jsrender.min.js"></script> <div style="display:none" id="statis"> <select></select> </div> <script id="rowTmpl" type="text/x-jsrender"> <tr> <td>{{:name}}</td> <td>{{include tmpl=#statis /}}</td> </tr> </script> <table> <tr> <th>Name</th> <th>Stat</th> </tr> </table> 

The first javascript line appends an option to the select (4th html-line). The second javascript line should render a row to the table for the person peter .

Problem:

1. I can not make the div to a script-tag because the first javascript line will not find the select-tag.
2. I can not render the div via the {{include because #statis is a div and not a script-tag.

Answer 1

Your {{include}} has a syntax error. It should be:

<td>{{include tmpl="#statis" /}}</td>

In fact you can declare a JsRender template in a hidden div, but it is generally not good practice, since there can be side effects. See: https://stackoverflow.com/a/25609895/1054484 .

You can also declare templates from strings - and dynamically manipulate the string beforehand if you want.

See also:

• http://www.jsviews.com/#compiletmpl
• http://www.jsviews.com/#tagsyntax@composition

 $('select').append($('<option>').text('single')); $('table').append($('#rowTmpl').render({name:'peter'})); 

 th,td {border:1px solid black;} 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://rawgit.com/BorisMoore/jsrender/master/jsrender.min.js"></script> <div style="display:none" id="statis"> <select></select> </div> <script id="rowTmpl" type="text/x-jsrender"> <tr> <td>{{:name}}</td> <td>{{include tmpl="#statis" /}}</td> </tr> </script> <table> <tr> <th>Name</th> <th>Stat</th> </tr> </table>