aciTree using leaves links demo - A treeview control with jQuery

A demo to show how you can have a link for each tree leaf node (item without children).

Note: a custom property named ‘my-url’ is used here to hold the URL for each item (see the JSON).

see the JSON behind this tree

Sample tree

<![CDATA[

$(function() {

// init the tree
$('#tree').aciTree({
ajax: {
url: '../json/sample.json'
},
itemHook: function(parent, item, itemData, level) {
if (!itemData.inode) {
// a custom item implementation to show a link
this.setLabel(item, {
label: '‘ + itemData.label + ”
});
}
}
});

});

]]><![CDATA[

$(function() {

var log = $('.log div');

// write to log
$('#tree').on('acitree', function(event, api, item, eventName, options) {
if (api.isItem(item)) {
log.prepend('

‘ + eventName + ‘ [‘ + api.getId(item) + ‘]’);
} else {
log.prepend(‘

‘ + eventName + ‘ [tree]’);
}
});

$(‘.clear_log’).click(function() {
$(‘.log div’).html(”);
return false;
});

$('script.code').each(function() {
$(this).before('

');
 $(this).prev('div').find('pre').text($(this).html());
 });
 });
 ]]>