+ -
当前位置:首页 → 问答吧 → 请求帮助,Extjs treegrid 数据显示问题

请求帮助,Extjs treegrid 数据显示问题

时间:2010-04-17

来源:互联网

大家好,我是新手,最近遇到一个Extjs的问题,由于项目需要用到Extjs 但是我从来没接触过,现在要做一个页面, 用columntree 或者 treegrid 但是无法动态生成数据,请各位大侠帮帮忙,告诉我怎么实现,小弟在此 万分感谢!
Ext.onReady(function() {
  Ext.QuickTips.init();
 
  var toolbar = new Ext.Toolbar({
  height: 30,
  hideBorders: true,
  buttons: [{
  text: ' 新建机构',
  icon: 'img/icon042a2.gif'
   
   
  }, {
  text: ' 编辑',
  icon: 'img/icon042a4.gif'
  }, {
  text: ' 删除',
  icon: 'img/icon042a3.gif'
}]
  });
 
 
 
  var sm = new Ext.grid.CheckboxSelectionModel();
 
 
 
  var tree = new Ext.ux.tree.TreeGrid({
 
  width: 900,
  height: 300,
  renderTo: Ext.getBody(),
  enableDD: true,
  tbar: toolbar,
  columns: [
 
  {
  header: 'Task',
  dataIndex: 'task',
  width: 300
  }, {
  header: 'Duration',
  width: 300,
  dataIndex: 'duration',
  align: 'center',
  sortType: 'asFloat',
  tpl: new Ext.XTemplate('{duration:this.formatHours}',
  {
  formatHours: function(v) {
  if (v < 1) {
  return Math.round(v * 60) + ' mins';
  } else if (Math.floor(v) !== v) {
  var min = v - Math.floor(v);
  return Math.floor(v) + 'h ' + Math.round(min * 60) + 'm';
  } else {
  return v + ' hour' + (v === 1 ? '' : 's');
  }
  }
  })
  }, {
  header: 'Assigned To',
  width: 300,
  dataIndex: 'user'
}],
  dataUrl: 'treegrid-data.json'
  });


treegrid-data.json文件:
[{
  task:'Project: Shopping',
  duration:13.25,
  user:'Tommy Maintz',
  iconCls:'task-folder',
  expanded: true,
  children:[{
  task:'Housewares',
  duration:1.25,
  user:'Tommy Maintz',
  iconCls:'task-folder',
  children:[{
  task:'Kitchen supplies',
  duration:0.25,
  user:'Tommy Maintz',
  leaf:true,
  iconCls:'task'
  },{
  task:'Groceries',
  duration:.4,
  user:'Tommy Maintz',
  leaf:true,
  iconCls:'task'
  },{
  task:'Cleaning supplies',
  duration:.4,
  user:'Tommy Maintz',
  leaf:true,
  iconCls:'task'
  },{
  task: 'Office supplies',
  duration: .2,
  user: 'Tommy Maintz',
  leaf: true,
  iconCls: 'task'
  }]
  }, {
  task:'Remodeling',
  duration:12,
  user:'Tommy Maintz',
  iconCls:'task-folder',
  expanded: true,
  children:[{
  task:'Retile kitchen',
  duration:6.5,
  user:'Tommy Maintz',
  leaf:true,
  iconCls:'task'
  },{
  task:'Paint bedroom',
  duration: 2.75,
  user:'Tommy Maintz',
  iconCls:'task-folder',
  children: [{
  task: 'Ceiling',
  duration: 1.25,
  user: 'Tommy Maintz',
  iconCls: 'task',
  leaf: true
  }, {
  task: 'Walls',
  duration: 1.5,
  user: 'Tommy Maintz',
  iconCls: 'task',
  leaf: true
  }]
  },{
  task:'Decorate living room',
  duration:2.75,
  user:'Tommy Maintz',
  leaf:true,
  iconCls:'task'
  },{
  task: 'Fix lights',
  duration: .75,
  user: 'Tommy Maintz',
  leaf: true,
  iconCls: 'task'
  }, {
  task: 'Reattach screen door',
  duration: 2,
  user: 'Tommy Maintz',
  leaf: true,
  iconCls: 'task'
  }]
  }]
},{
  task:'Project: Testing',
  duration:2,
  user:'Core Team',
  iconCls:'task-folder',
  children:[{
  task: 'Mac OSX',
  duration: 0.75,
  user: 'Tommy Maintz',
  iconCls: 'task-folder',
  children: [{
  task: 'FireFox',
  duration: 0.25,
  user: 'Tommy Maintz',
  iconCls: 'task',
  leaf: true
  }, {
  task: 'Safari',
  duration: 0.25,
  user: 'Tommy Maintz',
  iconCls: 'task',
  leaf: true
  }, {
  task: 'Chrome',
  duration: 0.25,
  user: 'Tommy Maintz',
  iconCls: 'task',
  leaf: true
  }]
  },{
  task: 'Windows',
  duration: 3.75,
  user: 'Darrell Meyer',
  iconCls: 'task-folder',
  children: [{
  task: 'FireFox',
  duration: 0.25,
  user: 'Darrell Meyer',
  iconCls: 'task',
  leaf: true
  }, {
  task: 'Safari',
  duration: 0.25,
  user: 'Darrell Meyer',
  iconCls: 'task',
  leaf: true
  }, {
  task: 'Chrome',
  duration: 0.25,
  user: 'Darrell Meyer',
  iconCls: 'task',
  leaf: true
  },{
  task: 'Internet Exploder',
  duration: 3,
  user: 'Darrell Meyer',
  iconCls: 'task',
  leaf: true
  }]
  },{
  task: 'Linux',
  duration: 0.5,
  user: 'Aaron Conran',
  iconCls: 'task',
  children: [{
  task: 'FireFox',
  duration: 0.25,
  user: 'Aaron Conran',
  iconCls: 'task',
  leaf: true
  }, {
  task: 'Chrome',
  duration: 0.25,
  user: 'Aaron Conran',
  iconCls: 'task',
  leaf: true
  }]
  }]
}]

作者: zhiwu891123   发布时间: 2010-04-17

该回复于2010-04-19 08:15:36被版主删除

  • 对我有用[0]
  • 丢个板砖[0]
  • 引用
  • 举报
  • 管理
  • TOP
#2楼 得分:0回复于:2010-06-22 17:41:06
我也试验了这个范例,也是不显示,搞不懂什么问题?而且extjs官网上显示的是2.0的样式,晕

作者: hqs19821108   发布时间: 2010-04-19

数据没加载成功吧

作者: hyc023   发布时间: 2010-06-22

谢谢 楼主

作者: IBM_hoojo   发布时间: 2010-06-22

学习中。。。。。。。

作者: zhengqingming   发布时间: 2010-06-23