This example show default script behaviour.
$('#tree1').checkboxTree();
This example show how to use images to handle collapse/expand feature.
$('#tree2').checkboxTree({
collapseImage: 'images/minus.png',
expandImage: 'images/plus.png',
});
This example show:
$('#tree3').checkboxTree({
onCheck: {
node: 'expand'
},
onUncheck: {
node: 'collapse'
},
collapseImage: 'images/downArrow.gif',
expandImage: 'images/rightArrow.gif',
});
This example show how to add buttons to collapse/expand all tree.
$('#tree4').checkboxTree({
collapseAllButton: {
html: 'Self-generated Collapse all',
container: $('#buttons-4')
},
collapseAllElement: '#collapseAll',
expandAllButton: {
html:'Self-generated Expand all',
container: $('#buttons-4')
},
expandAllElement: $('#expandAll')
});
This example show how to use external API.
tree = $('#tree5').checkboxTree();
$('#collapse').click(function(){
tree.collapse($('#node23'));
});
$('#expand').click(function(){
tree.expand($('#node23'));
});
$('#check').click(function(){
tree.check($('#node23'));
});
$('#uncheck').click(function(){
tree.uncheck($('#node23'));
});
This example show how to initialize a tree.
$('#tree6').checkboxTree({
initializeChecked: 'expanded',
initializeUnchecked: 'collapsed'
});