template engine allowing multiple views (form editing, report snipet) for same template

42 views
Skip to first unread message

Hirsch

unread,
Jul 24, 2015, 7:14:59 PM7/24/15
to nodejs
Looking for Node.js and/or client side javascript template engine where I can use one template for different views (editable form, layout for print, layout for screen). For example template (forgive messy meta-markup) like:

Alergen|Found|Intensity
[loop A]
[label a][combo(Yes/No) b][input c]
[/loop]
[choose x=1]bla bla bla 1
[choose x=2]bla bla bla 2

together with data like:

{A:[{a:'allergen 1',b:1}{a:'allergen 2',c:7}{a:'allergen 3',b:1}},x:2]}

will produce following HTML in EDIT mode:

<table>
<tr><th>Alergen<th>Found<th>Intensity
<tr><td>allergen 1<td><select><option value=1 selected>Yes<option value=0>No</select><td><input>
<tr><td>allergen 2<td><select><option value=1>Yes<option value=0>No</select><td><input value='7'>
<tr><td>allergen 3<td><select><option value=1 selected>Yes<option value=0>No</select><td><input>
</table>
<div><input type=radio value=1>bla bla bla 1</div>
<div><input type=radio value=2 selected>bla bla bla 2</div>
<script>
function getData() {//return updated data structure
}
</script>

but also able to produce different HTML in REPORT mode:

<table>
<tr><th>Alergen<th>Found<th>Intensity
<tr><td>allergen 1<td>Yes<td>
<tr><td>allergen 2<td><td>7
<tr><td>allergen 3<td>Yes<td>
</table>
<div>bla bla bla 2</div>

and perhaps other HTML in other views. That is, I want user to be able to design interactive form templates, edit them and include as snipets in reports. Template designing must be as intuitive and simple for non programmer as possible, like in word or WYSIWYG html editor.
There are so many node.js template engines (Handlebars,Nunjucks,Dust,Marko e.t.c.) and even more for client side javascript, many perhaps with additional libraries for visual template editing, custom widgets and data binding, very hard to find what is best match to my needs.

Patrick Steele-Idem

unread,
Aug 5, 2015, 10:34:24 AM8/5/15
to nodejs
Hi Hirsch,

I'm the author of Marko. I would recommend using Marko and wrapping the rendering logic for each form element in a custom tag. A custom tag maps to a JavaScript renderer(input, out) function that would contain all of the logic to control how the form element renders based on the current view type. This keeps the complexity out of your templates and solves your problem. 

Hope that helps.

--Patrick
Reply all
Reply to author
Forward
0 new messages