java easyui tree例子_Jquery EasyUI中Tree树控件结构应用案例讲解

Tree树控件使用$.fn.tree.defaults重写默认值对象，在web页面中一个将分层数据以树形结构进行显示。它提供用户展开、折叠、拖拽、编辑和异步加载等功能。

定义静态的html使用Tree树控件，标签能够定义分支和子节点。节点都定义在

• 列表内的
• 元素中，以下显示的元素将被用作树节点嵌套在
  • 元素中，具体代码如下：

    • Folder 1

      • Sub Folder 1

        • File 1

        • File 2

        • File 3

      • Sub File 2

      • Sub File 3

    • Folder 2

  定义在一个空

  • 元素利用Jquery加载数据，具体代码如下：

  $('#yoodb').tree({

  url:'tree_data.action'

  });

  EasyUI使用loadFilter函数处理，JSON数据代码如下：$('#yoodb').tree({

  url:'tree_data.action',

  loadFilter: function(data){

  if (data.result){

  return data.result;

  } else {

  return data;

  }

  }

  });

  注意：loadFilter类型(function) 返回过滤的数据去显示。这个函数需要一个参数'data'，表示原始数据。你可以把原始数据变成标准数据格式，此函数必须返回标准数据对象，含有'total'和'rows'特性。

  树控件数据格式化，每个节点都具备以下属性：

  id：节点ID，对加载远程数据很重要。

  text：显示节点文本。

  state：节点状态，'open' 或 'closed'，默认：'open'。如果为'closed'的时候，将不自动展开该节点。

  checked：表示该节点是否被选中。

  attributes: 被添加到节点的自定义属性。

  children: 一个节点数组声明了若干节点。