Rendering JSON data

[tobiassjosten]

HInclude does a good job of fetching HTML and injecting that into the DOM. This obviously requires the data to be rendered server side. I would like to explore the possibility of extending this with the ability to render data client side.

There are quite a few JavaScript libraries for taking JSON data and render it in HTML. One of my favorite ones is mustache.js. It can be extended with ICanHaz.js to allow you to define the templates inline in the HTML.

I would love something like this for HInclude, so it can help remove the glue code you need today if you want to fetch JSON and have it rendered in HTML. The following is an example of what it could look like.

<hx:render src="/api/members.json">
  <h1>Meet our <em>{{count}}</em> members!</h1>
  <ul>
  {{#members}}
    <li>{{name}}</li>
  {{/members}}
  </ul>
</hx:render>

What do you think of this idea? Would functionality along these lines fit within the scope of HInclude?

[tobiassjosten]

Another rendering engine that looks promising is Handlebars.js. It springs from mustache.js and adds functionality like precompiled templates.

[leroy0211]

Maybe a template and an engine attribute can be added, that template attribute wil be the DOM identifier where to find the template itself. And the engine will be which template engine to use. Because some would like to user handlebars, and some would like to use lodash templating, etc.