`
zhangdaiping
  • 浏览: 129427 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

EditTreeGrid行编辑树列表组件(更新1.5版)

阅读更多
最近有时间我又开发了一版新的EditTreeGrid,之前做过一版TreeGridEditor,不是很理想,最近一直在学习Ext,对Ext又有了新的认识,所以重新做一版,也算是自己这段时间的一个总结。



基于Ext 3.2.1的TreeGrid。

这个版本最大的改进就是使用了和Grid一样的RowEditor组件;由于使用了RowEditor,所以只能支持单行编辑。另外,TreeRowEditor和Grid RowEditor有点不同,当进入RowEditor状态后,其他所有按钮功能不可使用,你点击会无效。

代码体积减小了很多,将官方的TreeGird打包到一起,才30K的大小。

其次功能按钮的加载和扩展也有了很大的改进,可以随意定制,如下:

columns: [{
    header: 'Task',
    dataIndex: 'task',
    width: 230,
    editor: new Ext.form.TextField({
        allowBlank: false
    })
}, {
    // ...省略代码...
}, {
    header: '排序',
    width: 80,
    buttons: ['upgrade', 'degrade'],
    buttonIconCls: ['x-treegrid-button-upgrade', 'x-treegrid-button-degrade'],
    buttonTips: ['上移', '下移']
}, {
    header: '新增子分类',
    width: 80,
    buttons: 'add',
    buttonIconCls: 'x-treegrid-button-add',
    buttonTips: '新增'
}, {
    header: '操作',
    width: 130,
    buttons: ['update', 'remove'],
    buttonText: ['编辑', '删除']
}],
分享到:
评论
37 楼 962464i 2015-05-08  
麻烦问一下:edittreegrid-pkg.js这个文件是做什么的?我没有添加这个文件,貌似所有功能都可以实现呢
36 楼 blueskyxiao 2014-06-17  
楼主。问下咱们这个能实现和grid一样的双击编辑功能吗?双击只有被双击的cell可编辑。
另,如何能做到统一提交啊?求指教
35 楼 namelessmyth 2014-04-17  
新版本 怎么使用 localData呀...求楼主发案例呀...
34 楼 wokao_wg 2013-07-23  
zhangdaiping 写道
2011-6-9 更新1.5版

修正新增节点,异步加载父节点导致的BUG
增加删除树节点时,提示删除功能

楼主有个问题请看下代码:
 Ext.getCmp('tab_manage').add({
     	id: 'testPan',
	xtype: 'panel',
	closable : false,
	//autoLoad: {url:'testAction!editTree.action', scripts: true, params: {ids: '1'}},
	items:[EditTreeGrid], 用这个可以
	title: '测试'
     });
   Ext.getCmp('tab_manage').setActiveTab('testPan');

action跳转的页面:
<html>
<script type="text/javascript" src="edittreegrid.js"></script>
<body></body>
</html>

如上代码,直接添加到items里可以,但是用autoLoad加载url再跳转到目标页面,edittreeGrid不能显示出来,js错误为:TypeError: a is undefined,这应该算是个bug吧,求楼主验证
33 楼 stephansun 2012-06-29  
这个版本不能支持多选框了吗?前几个版本有的,但是下载链接好像没有了。
32 楼 zhongchao444 2012-02-09  
你好 我运行里面的示例,怎么提示拒绝访问
31 楼 Inspiration 2012-02-02  
你好,请问我想把编辑好的树结构以一种XML或JSON的方式保存起来,请问怎么弄?
30 楼 xuthus_qbxx 2011-11-25  
你好!
我这近希望开发一个类似treegrid的计划管理小程序,以便管理我的员工,但我本身自己做程序不多,所以我希望把这个小程序委外给你做,不知道感兴趣吗

我的邮箱:keybeninfo@163.com   qq:313134870
29 楼 friday007001 2011-10-30  
楼主1.5的还支持复选框吗?怎么使用呀?
28 楼 君已陌璐 2011-09-15  
请问下楼主,为什么你给的例子中修改的数据无法回写到json文件中?
27 楼 xu5420878 2011-07-23  
楼主,你的资料很好,现在我想研究下你的代码学习下,因为那增加节点save后如何保存到josn中的,我这块想弄下,但是那个edittreegrid-pkg.js文件打开后都只成一行了,所以没看明白。我该怎么做才能让数据保存到json中呢?
26 楼 zhangdaiping 2011-06-09  
qwml6179 写道
楼主会出 基于 ExtJs 4 的组件么

工作中用4的机会不多,应该不会出4的组件

其实自己对是很有兴趣,也看过很多4的例子

4的数据模型最吸引我
25 楼 zhangdaiping 2011-06-09  
lengxufeng 写道
楼主您好,正在使用你的组件,感谢。有个BUG,不知是否准确:

当第一次加载数据时,根节点还没展开时,点击根节点的新增子分类,会展开节点,并自动增加一条空叶子,而不是显示编辑框。

求证,谢谢。

其实这个问题早发现了,就是没有更新。刚发了1.5版已经修复了这个BUG
24 楼 zhangdaiping 2011-06-09  
2011-6-9 更新1.5版

修正新增节点,异步加载父节点导致的BUG
增加删除树节点时,提示删除功能
23 楼 lengxufeng 2011-06-02  
楼主您好,正在使用你的组件,感谢。有个BUG,不知是否准确:

当第一次加载数据时,根节点还没展开时,点击根节点的新增子分类,会展开节点,并自动增加一条空叶子,而不是显示编辑框。

求证,谢谢。
22 楼 qwml6179 2011-05-19  
楼主会出 基于 ExtJs 4 的组件么
21 楼 zhangdaiping 2011-04-22  
2011/4/22更新1.4版

  • 修正一些兼容性问题
20 楼 clue 2011-04-20  
zhangdaiping 写道


知道了,数据可以加载出来,再根据滚动条渲染数据。。。这个其实是可以做到的 

理论上如此。。。 目前仍未见到。。。
可能接触面不广吧,没准已经有人实现过了。
19 楼 zhangdaiping 2011-04-20  
clue 写道
zhangdaiping 写道

这是树,和grid的数据结构不一样,Tree本身就有延迟加载的机制

你还没理解我的意思,Ext的树是可以分层加载渲染,但单层的节点是只要展开就全部渲染。如果单层节点超过1000,性能就会低到难以忍受的程度。

Grid配置BufferView后,虽然加载还是那么多数据,但实际渲染出html的只有可见的那块,并根据滚动条位置动态更新,所以性能很高。


知道了,数据可以加载出来,再根据滚动条渲染数据。。。这个其实是可以做到的 
18 楼 zhangdaiping 2011-04-20  
bond88 写道
zhangdaiping 写道
bond88 写道
请教博主一个关于隐藏列的问题,如果树视图里有个隐藏列存在,显示的时候水平网格线会出现中断,光条也会中断,而且列头的隐藏列占的宽度不能消失,看起来显得很不舒服。不知道这是什么问题?


还没用过隐藏列,所以没测试过。。。

楼主有空测试下吧,我是没搞定,出现那种显示很烦。但我又怀疑会不会是我的问题,毕竟不应该有这么明显的问题却没人反应啊?(我使用系统的grid也有这样问题,列头不能完全隐藏,他的列头隐藏好像就是靠display:none或者visibility:hidden实现的).
另外再请教下,如果不用隐藏列,想要处理返回的某列不想显示的数据,有更好的方式吗?


Store里面有值,不一定要用Column显示到页面上啊

TreeGrid也一样,attributes里有值,不一定要显示成Column

相关推荐

    edittreegrid-1.5

    为了在项目中使用"edittreegrid-1.5",你需要先引入相关的JavaScript和CSS文件,然后按照文档的指导配置Ext JS的树形网格组件,利用提供的API和事件来实现节点操作和行编辑功能。在实际应用中,通常还需要考虑与其他...

    editTreeGrid ext可编辑的treegridpanel

    `editTreeGrid`是EXT JS中的一个特例,它是可编辑的TreeGrid面板,提供了在树节点中直接编辑数据的能力。这种组件通常用于管理具有层次关系的数据,比如组织结构、文件系统或数据库表的层级结构。 1. **EXT JS简介*...

    ext的edittreegrid实现

    在EXT JS库中,"ext的edittreegrid实现"是一种功能强大的组件,它结合了树形视图(Tree)和编辑网格(EditorGrid)的功能,允许用户在具有层次结构的数据上进行直观的编辑操作。这个组件对于那些需要管理结构化且...

    串流分屏 - 两台笔记本电脑屏幕共享

    串流分屏 - 两台笔记本电脑屏幕共享

    tornado-6.3.2-cp38-abi3-musllinux_1_1_x86_64.whl

    tornado-6.3.2-cp38-abi3-musllinux_1_1_x86_64.whl

    基于java的银行业务管理系统答辩PPT.pptx

    基于java的银行业务管理系统答辩PPT.pptx

    TA_Lib轮子无需编译-TA_Lib-0.4.17-cp35-cp35m-win32.whl.zip

    TA_lib库(whl轮子),直接pip install安装即可,下载即用,非常方便,各个python版本对应的都有。 使用方法: 1、下载下来解压; 2、确保有python环境,命令行进入终端,cd到whl存放的目录,直接输入pip install TA_lib-xxxx.whl就可以安装,等待安装成功,即可使用! 优点:无需C++环境编译,下载即用,方便

    机器学习(大模型):法律领域预训练的大型语言模型(LLM)微调而设计的数据集

    "Turkish Law Dataset for LLM Finetuning" 是一个专为法律领域预训练的大型语言模型(LLM)微调而设计的数据集。这个数据集包含了大量的土耳其法律文本,旨在帮助语言模型更好地理解和处理土耳其法律相关的查询和文档。 该数据集的特点包括: 专业领域:专注于土耳其法律领域,提供了大量的法律文本和案例,使模型能够深入学习法律语言和术语。 大规模:数据集规模庞大,包含了超过1000万页的法律文档,总计约135.7GB的数据,这为模型提供了丰富的学习材料。 高质量:数据经过清洗和处理,去除了噪声和非句子文本,提高了数据质量,使得模型训练更加高效。 预训练与微调:数据集支持预训练和微调两个阶段,预训练阶段使用了大量的土耳其语网页数据,微调阶段则专注于法律领域,以提高模型在特定任务上的表现。 多任务应用:微调后的模型可以应用于多种法律相关的NLP任务,如法律文本摘要、标题生成、文本释义、问题回答和问题生成等。 总的来说,这个数据集为土耳其法律领域的自然语言处理研究提供了宝贵的资源,有助于推动土耳其语法律技术的发展,并为法律专业人士提供更精准的技术支持。通过微调,

    农业信息化服务平台 SSM毕业设计 附带论文.zip

    农业信息化服务平台 SSM毕业设计 附带论文 启动教程:https://www.bilibili.com/video/BV1GK1iYyE2B

    tornado-6.1b2-cp36-cp36m-manylinux2010_i686.whl

    tornado-6.1b2-cp36-cp36m-manylinux2010_i686.whl

    计算机NLP-预训练模型文件

    计算机NLP_预训练模型文件

    随心淘网管理系统 SSM毕业设计 附带论文.zip

    随心淘网管理系统 SSM毕业设计 附带论文 启动教程:https://www.bilibili.com/video/BV1GK1iYyE2B

    计算机汇编杂谈-理解原理

    计算机汇编杂谈-理解其中的原理

    基于java的藏区特产销售平台答辩PPT.pptx

    基于java的藏区特产销售平台答辩PPT.pptx

    课设毕设基于SpringBoot+Vue的教务管理系统设计与实现源码可运行.zip

    本压缩包资源说明,你现在往下拉可以看到压缩包内容目录 我是批量上传的基于SpringBoot+Vue的项目,所以描述都一样;有源码有数据库脚本,系统都是测试过可运行的,看文件名即可区分项目~ |Java|SpringBoot|Vue|前后端分离| 开发语言:Java 框架:SpringBoot,Vue JDK版本:JDK1.8 数据库:MySQL 5.7+(推荐5.7,8.0也可以) 数据库工具:Navicat 开发软件: idea/eclipse(推荐idea) Maven包:Maven3.3.9+ 系统环境:Windows/Mac

    Jira安装包-servicedesk5.12.12

    安装包

    【java毕业设计】基于学生兴趣的学习资源推荐系统 的设计与实现源码(springboot+vue+mysql).zip

    项目经过测试均可完美运行! 环境说明: 开发语言:java jdk:jdk1.8 数据库:mysql 5.7+ 数据库工具:Navicat11+ 管理工具:maven 开发工具:idea/eclipse

    【java毕业设计】学生报名管理系统源码(springboot+vue+mysql+说明文档).zip

    项目经过测试均可完美运行! 环境说明: 开发语言:java jdk:jdk1.8 数据库:mysql 5.7+ 数据库工具:Navicat11+ 管理工具:maven 开发工具:idea/eclipse

    Windows x64操作系统dilb库dlib-19.24.1-cp311-cp311-win-amd64.whl.zip

    Windows x64 操作系统上安装 Python 3.11 版本对应的dlib库,操作简单,无需pip在下载,再也不怕网络超时等其他不确定错误 使用方法: 1、确保windows x64系统上安装了python,可以用anaconda自带的python 2、确认python版本为3.11版本 3、下载资源解压为dlib-19.24.1-cp311-cp311-win_amd64.whl到本地,cd到对应目录,终端直接输入命令pip install dlib-19.24.1-cp311-cp311-win_amd64.whl 等待安装成功提示就可以用了,非常方便,有使用问题欢迎私信哟!

    安装包JIRATimeSLA

    Jira插件安装包

Global site tag (gtag.js) - Google Analytics