ExtJS Tree刷新后自动展开并选择节点

很久没写EXTJS的tip了...

 

今天帮组员写了一个Tree的自动展开/选择的示例,如下:

ps:用的是treegrid,但是用tree也是一样可以的.

 

防止爬虫原文地址:http://atian25.iteye.com/blog/724092

 

关键代码:

Ext.onReady(function(){
  Ext.BLANK_IMAGE_URL = '../js/extjs/3.2.0/resources/images/default/s.gif';
  Ext.chart.Chart.CHART_URL = '../js/extjs/3.2.0/resources/charts.swf';
  Ext.QuickTips.init();
  testTreeGrid();
});

function testTreeGrid(){
  var tree = new Ext.ux.tree.TreeGrid({
    title: '地市',
    width: 550,
    height: 300,
    dataUrl: 'treegrid-data.json',
    renderTo: Ext.getBody(),
    enableDD: true,
    columns:[{
      header: 'ID',
      dataIndex: 'id',
      width: 200
    },{
      header: '名称',
      dataIndex: 'fdcName',
      width: 180
    },{
      header: '描述',
      dataIndex: 'fdcDesp',
      width: 100,
      align: 'center',
      sortType: 'string',
      tpl: new Ext.XTemplate('{fdcDesp:this.formatDesp}', {
        formatDesp: function(v) {
          return v||'-'
        }
      })
    }],
    tbar:[{
      text:'当前路径',
      tooltip:'保存当前选择节点的路径',
      scope:this,
      handler:function(b,e){
        //获取当前选择节点的路径
        var node = tree.getSelectionModel().getSelectedNode();
        var path = node.getPath('id');
        Ext.getCmp('tf').setValue(path);
      }
    },{
      xtype:'textfield',
      id:'tf',
      width:300,
      value:''
    },{
      text:'选择路径',
      scope:this,
      handler:function(b,e){
        var path = Ext.getCmp('tf').getValue();
        //展开路径,并在回调函数里面选择该节点
        tree.expandPath(path,'id',function(bSucess,oLastNode){
          tree.getSelectionModel().select(oLastNode);
        });
      }
    },{
      text:'选择江门',
      scope:this,
      handler:function(b,e){
        var path = '/xnode-11/cn86/gd020/gd020areas/jm0750';
        //展开路径,并在回调函数里面选择该节点
        tree.expandPath(path,'id',function(bSucess,oLastNode){
          tree.getSelectionModel().select(oLastNode);
        });
      }
    },{
      text:'重载',
      tooltip:'重载数据并选择上一次的节点',
      scope:this,
      handler:function(b,e){
        var path = tree.getSelectionModel().getSelectedNode().getPath('id');
        //重载数据,并在回调函数里面选择上一次的节点
        tree.getLoader().load(tree.getRootNode(),function(treeNode){
          //展开路径,并在回调函数里面选择该节点
          tree.expandPath(path,'id',function(bSucess,oLastNode){
            tree.getSelectionModel().select(oLastNode);
          });
        },this);
      }
    }]
  });
}

 

 

评论

3 楼 njliukang 2014-12-04  

请问一下，如果是异步树，应该怎么解决？貌似用expandpath没法解决，因为你传入path的时候，树上面或许还没有加载所需节点

2 楼 atian25 2012-04-26  

八岭书生 写道

请问 如果通过后台去获取路径 用json格式封装出来 要怎么去写啊

没看懂

1 楼 八岭书生 2012-04-26  

请问 如果通过后台去获取路径 用json格式封装出来 要怎么去写啊