jstree Example - Checkboxes

by HemalathaThanigaivel

HTML

<script src="http://static.jstree.com/3.0.0-beta3/assets/dist/jstree.min.js"></script>
<link rel="stylesheet" href="http://static.jstree.com/3.0.0-beta3/assets/dist/themes/default/style.min.css">
<div id="tree">
    <ul>
        <li id="folder_1">Folder 1
            <ul>
                <li id="child_1">Child 1</li>
                <li id="child_2">Child 2</li>
            </ul>
        </li>
        <li id="folder_2">Folder 2</li>
    </ul>
</div>

JavaScript

$(function () {
    $("#tree").jstree({
        "checkbox": {
            "keep_selected_style": false
        },
        "plugins": ["checkbox"]
    });
    $("#tree")
    .bind("loaded.jstree", function (event, data) {
        $(this).jstree("open_all");
    })
    .bind("changed.jstree",
    function (e, data) {
        alert("Checked: " + data.node.id);
        alert("Parent: " + data.node.parent); 
        //alert(JSON.stringify(data));
    })
    
    
    /* var $treeview = $("#tree") */;
		/* 	$treeview.jstree().on('ready.tree', function() {
			  $treeview.jstree('open_all');
			}); */
});