Javascript Extjs:Tree，创建树后选择节点

我有一个简单的树面板。我想在加载时选择一个特定的节点。节点来自远程文件（json）

树正在按预期加载。但是，未选择该节点。Firebug将节点显示为未定义。这可能是因为async属性。但是，我无法以其他方式配置此节点，或指定要选择的节点

欢迎任何建议，谢谢

    LeftMenuTree = new Ext.tree.TreePanel({
    renderTo: 'TreeMenu',
    collapsible: false,
    height: 450,
    border: false,
    userArrows: true,
    animate: true,
    autoScroll: true,
    id: 'testtest',
    dataUrl: fileName,
    root: {
  nodeType: 'async',    
     iconCls:'home-icon',
     expanded:true,
       text: rootText
    },
    listeners: {
        "click": {
    fn: onPoseClick,
                 scope: this
               }
        },
          "afterrender": {
       fn: setNode,
       scope: this 
      }  
 });
function setNode(){
 alert (SelectedNode);
  if (SelectedNode == "Orders"){
    var treepanel = Ext.getCmp('testtest');
    var node = treepanel.getNodeById("PendingItems");
    node.select();
  }
} 

---

这是因为在渲染树之前，节点实际上是不可选择的。尝试将节点选择添加到侦听渲染事件的事件侦听器。

我在TreeGrid中使用此代码来选择节点

_I.treeGrid.getSelectionModel().select(_I.treeGrid.getRootNode());

我还没有在TreePanel中尝试过这一点，但是由于TreeGrid是基于它的，所以我假设这是可行的。在XHR请求完成后，我使用loader的load事件来插入类似的代码，因此请尝试像这样编写setNode函数：

var loader = LeftMenuTree.getLoader();
loader.on("load", setNode);    
function setNode(){
     alert (SelectedNode);
      if (SelectedNode == "Orders"){
        var treepanel = Ext.getCmp('testtest');
        treepanel.getSelectionModel().select(treepanel.getNodeById("PendingItems"));
      }
    }

---

我在这里记录了一种实现类似目标的方法：

您需要确保选择的节点是可见的。您可以通过遍历树和node.expand（）并遍历所有节点的父节点（从根向下）来实现这一点

这是我的工作

var loader  = Ext.getCmp('testtest').getLoader();
loader.on("load", function(a,b,c){ 
   b.findChild("id",1, true).select(); // can find by any parameter in the json
}); 

---

如果您使用的是ExtJS的最新版本，那么我发现使用ViewModels和Selection config对这类事情来说要容易得多

比如：

LeftMenuTree = new Ext.tree.TreePanel({
renderTo: 'TreeMenu',
collapsible: false,
height: 450,
border: false,
userArrows: true,
animate: true,
autoScroll: true,
id: 'testtest',
dataUrl: fileName,
bind: {
    Selection: '{SelectedNode}'
}, 
root: {
   nodeType: 'async',    
   iconCls:'home-icon',
   expanded:true,
   text: rootText
},
listeners: {
    "click": {
       fn: onPoseClick,
       scope: this
    }
    "afterrender": {
       fn: setNode,
       scope: this 
    }  
 });

（您需要在树面板或所属视图中设置ViewModel）

然后假设您使用的是ViewController，并且setNode是成员：

setNode: function(){
 var nodeToSelect = // code to find the node object here
 this.getViewModel().set('Selection', nodeToSelect);
} 

---

ViewModel方法的优点在于它似乎可以自动处理所有渲染/数据加载问题。

我尝试了你的建议。我想它会起作用的。但是，同样的错误是，未定义节点。它在呈现子节点之前触发。+1对我有效。另外，当选定节点处于悬停状态时，如何将其字体设置为粗体？要选择第一个子节点，这将与ExtJs4 tree_dir.getSelectionModel（）配合使用。select（tree_dir.getRootNode（）.childNodes[0]）；不知何故，我的setNode函数从未被调用。相反，我必须在窗口中添加一个侦听器并等待窗口呈现，然后调用

treepanel.getSelectionModel（）.select（treepanel.getNodeById（…）

代码段，效果非常好。treepanel.getSelectionModel（）.select（treepanel.getNodeById（“PendingItems”））；不触发树面板的select事件。要触发select事件，需要执行哪些操作？