`
JavaTestJava
  • 浏览: 54651 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

漂亮的树Tree控件代码

EXT 
阅读更多
Ext.TreeComboField=Ext.extend(Ext.form.TriggerField,{      
     valueField:"id",      
     displayField:"name",      
     haveShow:false,      
     editable:false,      
     onTriggerClick : function(){      
        if(!this.tree.rendered)      
        {      
        this.treeId = Ext.id();      
        panel.id = this.treeId;      
        this.getEl().dom.parentNode.appendChild(panel);      
        this.tree.render(this.treeId);      
        this.tree.setWidth(this.width);      
        this.tree.getEl().alignTo(this.getEl(), "tl-bl");         
        }          
        this.tree.show();      
     },      
     initComponent : function(){      
        Ext.TreeComboField.superclass.initComponent.call(this);      
             
     },      
     onRender : function(ct, position){      
        Ext.TreeComboField.superclass.onRender.call(this, ct, position);              
        this.tree.on("click",this.choice,this);      
        if(this.hiddenName){      
            this.hiddenField = this.el.insertSibling({tag:'input', type:'hidden', name: this.hiddenName, id: (this.hiddenId||this.hiddenName)},      
                    'before', true);      
            this.hiddenField.value =      
                this.hiddenValue !== undefined ? this.hiddenValue :this.value !== undefined ? this.value : '';      
            this.el.dom.removeAttribute('name');      
        }      
         if(!this.editable){      
            this.editable = true;      
            this.setEditable(false);      
        }      
     },      
     getValue : function(){             
       return typeof this.value != 'undefined' ? this.value : '';              
    },      
    clearValue : function(){      
        if(this.hiddenField){      
            this.hiddenField.value = '';      
        }      
        this.setRawValue('');      
        this.lastSelectionText = '';      
        this.applyEmptyText();      
    },      
    readPropertyValue:function(obj,p)      
    {      
        var v=null;      
        for(var o in obj)      
        {      
            if(o==p)v=obj[o];      
        }      
        return v;      
    },      
    setValue : function(obj){         
        if(!obj){      
            this.clearValue();      
            return;      
        }      
        var v=obj;        
        var text = v;      
        var value=this.valueField||this.displayField;      
       if(typeof v=="object" && this.readPropertyValue(obj,value)){      
            text=obj[this.displayField||this.valueField];      
            v=obj[value];             
        }      
        var node = this.tree.getNodeById(v);            
        if(node){      
                text = node.text;      
            }else if(this.valueNotFoundText !== undefined){      
                text = this.valueNotFoundText;      
            }      
        this.lastSelectionText = text;      
        if(this.hiddenField){      
            this.hiddenField.value = v;      
        }      
       Ext.TreeComboField.superclass.setValue.call(this, text);      
       this.value = v;      
    },      
     setEditable : function(value){      
        if(value == this.editable){      
            return;      
        }      
        this.editable = value;      
        if(!value){      
            this.el.dom.setAttribute('readOnly', true);      
            this.el.on('mousedown', this.onTriggerClick,  this);      
            this.el.addClass('x-combo-noedit');      
        }else{      
            this.el.dom.setAttribute('readOnly', false);      
            this.el.un('mousedown', this.onTriggerClick,  this);      
            this.el.removeClass('x-combo-noedit');      
        }      
    },      
    choice:function(node,eventObject)      
    {      
    if(node.id!="root") this.setValue(node.id);      
    else this.clearValue();      
    this.tree.hide();      
    },            
    onDestroy : function(){      
    if(this.tree.rendered){      
       this.tree.getEl().remove();      
      }      
    Ext.TreeComboField.superclass.onDestroy.call(this);      
    }      
});      
Ext.reg('treecombo', Ext.TreeComboField);    
分享到:
评论

相关推荐

    Labview Tree控件简单应用

    在Labview中,树形控件(Tree)是一种常用的数据组织和显示工具,尤其适用于处理层次结构数据。本文将深入探讨Labview树形控件的简单应用,包括其使用方法、内容添加与显示,以及如何添加父节点与子节点。 首先,...

    VB自制的漂亮Tree树控件源码

    "VB自制的漂亮Tree树控件源码"是一个实用资源,它提供了自定义的Tree控件,用于创建视觉上吸引人的树形菜单或折叠菜单。Tree控件在许多应用程序中都有广泛的应用,例如文件浏览器、组织结构展示、设置菜单等。 这个...

    学习Tree控件的例子

    此外,压缩包中的“操作Tree控件”可能是源代码文件或者相关的示例程序,包括头文件、cpp源代码文件以及可能的资源文件。通过查看这些文件,我们可以更具体地了解如何实现Tree控件的动态加载数据、节点的增删改查...

    vc树形控件源代码 超炫控件

    1. 创建树形控件:在对话框或窗口的资源编辑器中添加一个控件,并将其类型设置为"Tree View",然后在代码中使用CTreeCtrl成员函数Create()初始化控件。 2. 插入节点:使用InsertItem()函数可以向树形控件中插入根...

    selectTree 下拉树菜单控件

    首先,SelectTree控件的核心功能是将数据结构化为可交互的树形展示,并提供下拉操作。在JavaScript中,通常通过AJAX技术从服务器获取JSON格式的数据,这些数据包含了节点信息(如ID、父ID、文本等)以及层级关系。...

    selectTree tree控件 日历控件 tree控件 radio CheckBox demo

    "selectTree tree控件 日历控件 tree控件 radio CheckBox demo"这个标题揭示了几个关键的组件,它们是网页交互中的重要元素。下面将详细介绍这些控件及其应用场景。 1. **selectTree(选择树控件)**: 选择树控件...

    wpf_combobox_tree下拉树形控件

    在实现这些功能后,我们就可以创建一个自定义的wpf_combobox_tree控件,供其他开发者在项目中使用。开发完成后,记得进行充分的测试,确保在各种情况下都能正常工作,包括但不限于数据更新、多线程环境、内存管理等...

    LabVIEW中树形控件的基本操作

    在LabVIEW编程环境中,树形控件是一种非常实用的用户界面元素,用于展示层次结构的数据。本教程将深入探讨LabVIEW中树形控件的基本操作,包括创建、配置、数据绑定以及交互方式。 首先,创建树形控件是通过拖拽“树...

    Tab+Tree控件联合使用

    "Tab+Tree控件联合使用"的主题意味着我们要在不同的选项卡页面上利用树形结构来展示数据,这样既能保持界面的整洁,又能提供层次分明的信息浏览方式。 首先,我们来看“Tab控件”。Tab控件,又称为选项卡控件,允许...

    常用树形控件

    树形控件(Tree Control)是一种控件元素,它以层级结构显示数据,每个层级称为一个节点,节点可以包含子节点或叶子节点。通常,根节点位于顶部,而叶子节点没有子节点。用户可以通过展开和折叠节点来查看或隐藏子...

    tree 控件 使用代码(项目可直接运行)

    本项目提供的"tree 控件 使用代码(项目可直接运行)"旨在帮助开发者理解和应用Tree控件在实际项目中的工作原理。 首先,我们要理解Tree控件的基本概念。在Windows应用程序开发中,如使用.NET Framework的WinForms...

    树形控件的增删改查(代码)

    树形控件是计算机图形用户界面(GUI)中常见的一种数据展示形式,它以树状结构展示信息,常用于文件管理器、数据库浏览器、菜单系统等场景。在本主题中,我们将深入探讨树形控件的增删改查操作,这些操作是构建交互...

    VC TREE 控件使用

    1. **创建TREE控件**:首先,你需要在资源编辑器中添加一个新的控件到对话框或窗口,选择"视图"类别中的"树控件"。然后,你可以在代码中通过ID找到这个控件,并用CTreeCtrl类实例化它。 2. **添加节点**:你可以...

    Element的el-tree控件后台数据结构的生成以及方法的抽取

    最近用到了el-tree控件,主要是数据的格式,按照官网的数据格式来就可以显示节点的树形结构了。 代码参考很多 这里给出一个比较好的链接:https://www.jb51.net/article/181990.htm 代码说明在注释里写的很详细...

    Tree Control树形控件

    在Windows编程领域,树形控件(Tree Control)是一种常用且功能...这个项目可能包含了创建、操作树形控件的代码,以及相关的事件处理函数,通过运行和分析这个示例,你可以更直观地了解树形控件的工作原理和使用方法。

    Tree树形控件

    在计算机编程领域,树形控件(Tree Control)是一种常用的数据可视化组件,它通常用于展示层次结构的数据。在Windows应用程序开发中,Visual C++(简称VC)提供了对树形控件的支持,使得开发者能够轻松地在用户界面...

    VC++ TREE控件使用实例大全

    1. **控件介绍**:TREE控件(CTreeCtrl)是MFC库中的一个类,基于Windows API中的TVN类控件,提供了一种可视化的方式来显示树形结构数据,如文件系统目录、组织结构等。每个节点可以有子节点,并可以通过展开或折叠...

    vc Tree控件使用源码

    在给定的“vc Tree控件使用源码”中,我们可以通过查看和学习源代码来了解如何在VC6.0中实现对Tree控件的添加、查看、排序和删除等操作。 1. **添加节点**: 在CTreeCtrl中,添加节点通常通过调用`InsertItem()`...

    树形控件和列表控件的结合

    在本项目中,我们关注的是"树形控件(CTreeCtrl)"和"列表控件(CListCtrl)"的结合使用。这两种控件在Windows应用程序中非常常见,它们各自具有独特的功能,而将它们整合在一起可以实现更复杂的界面布局和数据展示...

    c# winfrom 自定义简单的tree控件(入门)

    在C# WinForm开发中,有时我们可能需要创建自定义的控件来满足特定的界面需求,例如构建一个简单的Tree控件。这个教程将引导初学者如何从零开始实现一个基本的Tree控件,主要涉及的技术点包括自定义控件、事件处理...

Global site tag (gtag.js) - Google Analytics