Skip to content

Instantly share code, notes, and snippets.

@pure
Created December 6, 2009 10:45
Show Gist options
  • Save pure/250157 to your computer and use it in GitHub Desktop.
Save pure/250157 to your computer and use it in GitHub Desktop.
Recursion
<html>
<head>
<title>PURE Unobtrusive Rendering Engine</title>
<script src="../libs/jquery.js"></script>
<script src="../libs/pure.js"></script>
</head>
<body>
<ul class="treeItem">
<li>
<a class="name" href="javascript:void(0)">name</a>
<div class="children"></div>
</li>
</ul>
<script>
var data = {
children: [{
name: 'Europe',
children: [{
name: 'Belgium',
children: [{
name: 'Brussels',
children:null},{
name: 'Namur'},{
name: 'Antwerpen'}]},{
name: 'Germany'},{
name: 'UK'}]},{
name: 'America',
children: [{
name: 'US',
children: [{
name: 'Alabama'},{
name: 'Georgia'}]},{
name: 'Canada'},{
name: 'Argentina'}]},{
name: 'Asia'},{
name: 'Africa'},{
name: 'Antarctica'}
]
};
var directive = {
'li': {
'child <- children': {
'a': 'child.name',
'a@onclick':'alert(\'#{child.name}\');',
'div.children': function(ctxt){
return ctxt.child.item.children ? rfn(ctxt.child.item):'';
}
}
}
};
var rfn = $('ul').compile( directive );
$('ul').render( data, rfn );
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment