[CLOSED] Trigger the loading of TreePanel´s data

[RCN]

Hi folks, in the following example the load of root node´s content occurs when it is expanded. If i set the rootVisible property to false the "root" nodes are loaded automatically. I would like to know whether it´s possible to control the load of "root" nodes when rootVisible property is set to false. In other works i want that to load the data just when the button "_btn" is clicked, but without show root node.

1 - View

<ext:Button ID="_btn" Text="add" runat="server">
    <Listeners>
        <Click Handler="doLoad();" />
    </Listeners>
</ext:Button>
<ext:TreePanel ID="TreePanel1" runat="server" Title="Tree" Height="500" Width="200"
    Border="false">
    <Store>
        <ext:TreeStore ID="TreeStore1" NodeParam="nodeId" runat="server">
            <Proxy>
                <ext:AjaxProxy Url="/Example/loadNodeChildren">
                    <Reader>
                        <ext:JsonReader Root="data" />
                    </Reader>
                </ext:AjaxProxy>
            </Proxy>
        </ext:TreeStore>
    </Store>
    <Root>
        <ext:Node NodeID="0" Text="Ext" />
    </Root>
</ext:TreePanel>

2 -Controller

public StoreResult loadNodeChildren(string nodeId)
{
    NodeCollection nodes = new NodeCollection(false);

    if (!string.IsNullOrEmpty(nodeId))
    {
        for (int i = 1; i < 6; i++)
        {
            Node asyncNode = new Node();
            asyncNode.Text = nodeId + i;
            asyncNode.NodeID = nodeId + i;
            nodes.Add(asyncNode);
        }
    }

    return new StoreResult { Data = nodes.ToJson() };
}

3 - JavaScript

var doLoad = function () {
    //Trigger load
}

[RCN]

I could remove the root node from TreePanel

<ext:Button ID="_btn" Text="add" runat="server">
    <Listeners>
        <Click Handler="doLoad();" />
    </Listeners>
</ext:Button>
<ext:TreePanel ID="TreePanel1" runat="server" Title="Tree" Height="500" Width="200"
    Border="false">
    <Store>
        <ext:TreeStore ID="TreeStore1" NodeParam="nodeId" runat="server">
            <Proxy>
                <ext:AjaxProxy Url="/Example/loadNodeChildren">
                    <Reader>
                        <ext:JsonReader Root="data" />
                    </Reader>
                </ext:AjaxProxy>
            </Proxy>
        </ext:TreeStore>
    </Store>
</ext:TreePanel>

And then add it when button _btn is clicked.

var doLoad = function () {
    App.TreePanel1.setRootNode({
        expanded: true
    });
    //how to hide the root node?
}

but how to hide the root node?

[Daniil]

Hi,

Please set up:

<ext:TreeStore runat="server">
    <CustomConfig>
        <ext:ConfigItem Name="autoLoad" Value="false" Mode="Raw" />
    </CustomConfig>    
</ext:TreeStore>

We will review it to allow setting it via the TreeStore AutoLoad property.

[RCN]

I did it setting TreePanel´s RootVisible property to false and overriding the Ext.tree.View.setRootNode function, as shown bellow. Then i just set the node of the store when the button _btn is clicked

But your approach is MUCH better

var doLoad = function () {
    App.TreePanel1.view.store.setNode(App.TreePanel1.getRootNode());
}

Ext.tree.View.override({

    setRootNode: function (node) {
        var me = this;
        //me.store.setNode(node);
        me.node = node;
        if (!me.rootVisible) {
            //node.expand();
        }
    }
});

[RCN]

Daniil, please mark as as resolved.

[Daniil]

Thanks for the update.

I would prefer to mark the thread as closed after a decision on this aspect:

We will review it to allow setting it via the TreeStore AutoLoad property.

[Daniil]

Now you can just set up

<ext:TreeStore runat="server" AutoLoad="false">

instead of using CustomConfig.

Thanks for the question.