Skip to content

Instantly share code, notes, and snippets.

@mjumbewu

mjumbewu/index.html

Last active December 30, 2015 07:39
Show Gist options
  • Save mjumbewu/7797761 to your computer and use it in GitHub Desktop.
Save mjumbewu/7797761 to your computer and use it in GitHub Desktop.
Download ZIP
Simple static handlebars.js renderer
Raw
index.html
<html>
<head>
<script src="//cdnjs.cloudflare.com/ajax/libs/handlebars.js/1.1.2/handlebars.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
</head>
<body>
<!-- Your handlebars template goes below... -->
<script id="my-one-template" type="text/x-handlebars-template">
{{#each people}}
<p>{{first}} {{last}}</p>
{{/each}}
</script>
<div class="render-space"></div>
<script>
var source = $('#my-one-template').html();
var template = Handlebars.compile(source);
// The path to your JSON file goes below...
$.getJSON('test-data.json', function(data) {
var html = template(data);
$('.render-space').html(html);
});
</script>
</body>
</html>
Raw
test-data.json
{
"people": [
{"first": "Frank", "last": "Hebbert"},
{"first": "Mjumbe", "last": "Poe"}
]
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment