`
tesia
  • 浏览: 33113 次
  • 性别: Icon_minigender_2
  • 来自: 广州
社区版块
存档分类
最新评论

树形面板Ext.tree.Panel

阅读更多
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<link  rel="stylesheet" type="text/css"  href="ext-4.0.7-gpl/resources/css/ext-all.css" />
<script type="text/javascript"  src="ext-4.0.7-gpl/bootstrap.js"></script>
<script type="text/javascript" src="ext-4.0.7-gpl/locale/ext-lang-zh_CN.js"></script>
<script type="text/javascript">
Ext.onReady(function(){
Ext.create('Ext.tree.Panel',{
   title:'tree 面板简单示例',
   width:180,
   height:200,
   renderTo:Ext.getBody(),
   root:{
    text:'树根',
expanded:true, //默认展开根节点
children:[{
text:'节点一',
leaf:true //true说明为叶子节点
},{
text:'节点二',
leaf:true
}]
   }
});
});

</script>
</head>

<body>

</body>
</html>
  • 大小: 6.8 KB
分享到:
评论

相关推荐

    ExtJS4+Accordion+SERVLET/STRUTS2+JSON+Ext.tree.Panel实例

    例如,Ext.tree.Panel可能会通过Ajax请求从服务器获取JSON格式的树结构数据,然后动态渲染出树形视图。 Ext.tree.Panel是ExtJS中的一个组件,用于展示树状数据结构。它可以显示多级嵌套的节点,支持拖放操作,节点...

    Ext.Tree.Panel

    `Ext.Tree.Panel`是EXT JS库中的一个重要组件,用于展示层次结构的数据,通常用作树形菜单或文件系统目录的视图。这个组件是EXT JS框架中用于创建交互式、可扩展的树结构的工具。以下是对`Ext.Tree.Panel`相关知识的...

    extjs中Ext.Panel和TreePanel 组件动态加载本地页面数据

    接下来,`TreePanel`是用来展示树形结构数据的组件,常用于文件系统或组织结构的展示。与`Ext.Panel`类似,`TreePanel`也可以动态加载本地数据。这通常涉及到`TreeStore`和`TreeNode`的概念。`TreeStore`用于存储和...

    editTreeGrid ext可编辑的treegridpanel

    在EXT JS这个强大的JavaScript框架中,`TreeGrid`是一种结合了树形结构和表格功能的组件,它允许用户同时展示数据的层次结构和表格信息。`editTreeGrid`是EXT JS中的一个特例,它是可编辑的TreeGrid面板,提供了在树...

    Ext.js教程和Ext.js API

    4. **表格(Grid)和树形视图(Tree)**:如何创建和定制数据展示组件,包括排序、分页、编辑等功能。 5. **表单(Forms)**:介绍表单组件(Fields)、表单布局、验证和数据提交。 6. **菜单和工具栏**:创建和使用...

    ext 下拉树

    在Ext 4.0版本中,下拉树的实现主要依赖于几个关键组件:`Ext.tree.Panel`(树面板)、`Ext.form.field.Tree`(树形字段)以及可能用到的`Ext.data.TreeStore`(树存储)。下面我们将详细探讨这些知识点: 1. **Ext...

    Ext JS 深入浅出 树形结构

    这个简单的例子展示了如何创建一个包含两个初始子节点的树形面板。你可以根据需求进一步定制,比如添加图标、使用延迟加载、监听事件等。 总的来说,Ext JS 提供了强大且灵活的树形结构组件,使得开发者可以轻松地...

    使用ExtJs构建树形菜单功能

    该类继承自`Panel`面板,提供了许多特性和方法来方便地构建和操作树形结构。下面我们通过一个简单的例子来创建一棵基础的树: ```javascript Ext.onReady(function() { var tree = new Ext.tree.TreePanel({ el: ...

    Ext组件描述,各个组件含义

    - **功能描述**:Tree Panel 是一个树形结构的组件,可以用来展示层次结构的数据。 - **主要用途**:适用于展示目录结构或组织架构图。 **2.13 Viewport (Ext.Viewport)** - **xtype**: `viewport` - **功能描述**...

    Ext树例子

    在本篇文章中,我们将深入探讨Ext树的基本概念、其主要功能以及如何通过`tree1.txt`和`tree2.txt`这两个文件来创建和理解树形结构。 首先,让我们了解Ext树的基础。Ext树的核心组件是`Ext.tree.Panel`,它继承自`...

    Ext4+JSON+Servlet+Tree构建Web应用框架

    它提供了大量的可重用组件,如表格、树形视图、面板、窗口等,支持拖放、数据绑定、高级布局等特性,使得前端界面的开发变得简单而高效。Ext4在性能、可维护性和API设计上都有显著提升,适合大型企业级应用。 2. ...

    Ext树形菜单(我自己做的)

    1. **配置树形面板**:首先,你需要创建一个`Ext.tree.Panel`实例,配置项包括store(用于存储树节点数据)、rootVisible(是否显示根节点)、useArrows(是否显示展开/折叠箭头)等。 2. **定义数据源**:数据通常...

    exxtjs4.0中树的用法

    在EXTJS 3.x中,创建一个树形面板的示例如下: ```javascript var tree = new Ext.tree.TreePanel({ renderTo: 'tree-div', title: 'Tree test', height: 300, width: 400, useArrows: true, autoScroll: ...

    Extjs折叠布局中添加树

    在请求成功后,使用`Ext.each`遍历JSON数据,为每个菜单项创建一个新的`Ext.panel.Panel`,并添加一个包含该菜单树的`Ext.tree.Panel`。这些新创建的面板会被添加到`leftPanel`中,这样就实现了在折叠面板中展示树形...

    简单的ext树

    创建树形视图的主要组件是`Ext.tree.Panel`。这个组件提供了一个容器,可以嵌入树节点并管理它们的显示。在描述中提到的“树”就是通过这个组件实现的。你需要定义树的配置,包括数据源、列、样式等。 3. **数据源...

    ExtJS5树形菜单

    树形菜单由`Ext.tree.Panel`类创建,它是一个包含树节点的面板。每个节点都是一个`Ext.tree.Node`实例,可以包含子节点。节点的数据可以通过`NodeInterface`定义,这个接口包含了节点的各种属性,如文本、图标、...

    Ext树创建说明.rar

    Ext.create('Ext.tree.Panel', { title: '我的树', width: 200, height: 300, store: store, rootVisible: true, renderTo: Ext.getBody() }); } }); ``` 在这个例子中,我们首先创建了一个TreeStore,...

    4.0Ext 树型结构

    var tree = Ext.create('Ext.tree.Panel', { renderTo: Ext.getBody(), title: 'TreeGrid', width: 300, height: 150, fields: ['name', 'description'], columns: [ {xtype: 'treecolumn', text: 'Name', ...

    checkbox_tree.zip_tree

    通过深入理解`checkbox_model`配置、`Ext.tree.Panel`组件、数据存储以及事件处理,我们可以创建出具有高度交互性和用户体验的树形界面。这个项目是学习和实践ExtJS中树形结构和复选框交互功能的一个宝贵资源。

    Ext.3.0.中文文档

    5. **树形视图(Tree)**:学习如何创建和操作树形结构,包括节点的增删改查和拖放操作。 6. **数据存储(Store)**:了解数据存储的概念,包括本地存储和远程数据源的连接,以及使用XML、JSON等数据格式进行数据...

Global site tag (gtag.js) - Google Analytics