Customizing JavaScript Visualization Toolkit Spacetree Node

The Spacetree can be customized very much. The nodes can display images or anything we want. We can have custom click events for the nodes. To have custom events, you will have to redraw the whole tree in the onclick event.

Here is an example. On the success function of the click event. Here I have called the click event on the class “clickable”

      $.ajaxSetup({ cache: false });             
           $(".clickable").live("click", function () {              
            $.ajax({
                url: url + "?id=" + parentId + "&ts=" + new Date().getMilliseconds(),
                type: "POST",
                cache: false,
                dataType: "html",
                success: function (html) {                       
                    init(html);                        
                }
              });
            });

The name property can be used to give the image like this:

{id:"90", name:"<a href="https://stackoverflow.com/questions/4455241/javascript:;" class="clickable" name="90"><img src="images/picture.gif" width="30" height="30" alt="pic" /></a>", data:{}, children:[]}

Mark as Answer if useful. thanks.

Leave a Comment