Dynatree ignores select property when using ajax

Question

I am using the dynatree plugin to display a checkbox tree, using multi-select mode (mode 3).

When the tree is initialized using ajax (no lazy loading), it seems to forget that some nodes are loaded initially selected. When I select one of these nodes, the value of the flag passed into the onSelect handler is true, i.e: it thinks I want to select the node.

When I click the checkbox again it deselects. It seems that in the background the selection isn't registered until I physically click the checkbox. I want to load the tree with this node already selected.

The json that I am using to load the tree looks fine to me; the select property is true for the node in question, the root node. Here is a snippet of the JSON:

{
"expand":true,
"title":"All",
"isFolder":false,
"key":"0",
"isLazy":false,
"addClass":null,
"select":true,
"unselectable":false,
"children": [... omitted for clarity]
}

UPDATE

I am loading the tree this way:

$("#locationsTree").dynatree({
    checkbox: true,
    selectMode: 3,
    initAjax: {
        type: "POST",
        url: dynaTreeInitUrl
    },
    classNames:
    {
        nodeIcon: ""
    }        
});

where dynaTreeInitUrl is the url that returns the json.

If I hardcode the JSON like so:

$("#locationsTree").dynatree({
    checkbox: true,
    selectMode: 3,
    children: {
        "expand":true,
        "title":"All",
        "isFolder":false,
        "key":"0",
        "isLazy":false,
        "addClass":null,
        "select":true,
        "unselectable":false,
        "children": [{
            "expand": true,
            "title": "Child",
            "isFolder": false,
            "key": "1",
            "isLazy": false,
            "addClass": null,
            "select": true,
            "unselectable": true,
            "children": []
        }]
    },
    classNames:
    {
        nodeIcon: ""
    }        
});

it works. :/

UPDATE:

I discovered why this is happening:

It is a bug in dynatree - or maybe intended behaviour where it is trying to be too clever.

If the child node has unselectable = true, the parent will be unselected when the child is loaded, even if the parent has select = true. This makes it impossible create a tree where the selection is hierarchical - i.e.: to have it so that if parent is selected, all children are automatically selected, and cannot be unselected. I suppose this could be added to dynatree as another "mode".

Answer 1

I discovered why this is happening:

It is a bug in dynatree - or maybe intended behaviour where it is trying to be too clever.

If the child node has unselectable = true, the parent will be unselected when the child is loaded, even if the parent has select = true. This makes it impossible create a tree where the selection is hierarchical - i.e.: to have it so that if parent is selected, all children are automatically selected, and cannot be unselected. I suppose this could be added to dynatree as another "mode".

Answer 2

you can use this code:

onPostInit: function() {
$.map(this.getSelectedNodes(), function(node){
    node.makeVisible();
});

}

Dynatree Expand Parents of Selected Nodes