`
zhangdaiping
  • 浏览: 130068 次
  • 性别: 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)的功能,允许用户在具有层次结构的数据上进行直观的编辑操作。这个组件对于那些需要管理结构化且...

    基于FPGA的四相八拍步进电机控制系统设计:集成交付、正反转、加速减速及调速功能

    内容概要:本文详细介绍了基于FPGA的四相八拍步进电机控制系统的开发过程。主要内容包括:1. 使用VHDL和Verilog编写LED显示屏驱动代码,用于显示角度、学号和姓名等信息;2. 实现步进电机的正反转控制,通过状态机管理相序变化;3. 开发加速减速控制模块,确保电机启动和停止时的平稳性;4. 设计调速功能,通过调节脉冲频率实现速度控制。此外,文中还讨论了调试过程中遇到的问题及其解决方案。 适合人群:对FPGA开发和步进电机控制感兴趣的电子工程师、嵌入式系统开发者以及相关专业的学生。 使用场景及目标:适用于需要高精度运动控制的应用场合,如工业自动化、机器人技术和精密仪器等领域。目标是帮助读者掌握FPGA控制步进电机的基本原理和技术细节。 其他说明:文中提供了详细的代码片段和调试经验分享,有助于读者更好地理解和应用所学知识。同时,作者还提到了一些实用技巧,如通过PWM调节实现多级变速,以及如何避免步进电机的共振问题。

    Android开发:基于SQLite的日历备忘录记事本项目详解与实现

    内容概要:本文详细介绍了基于Android Studio开发的日历备忘录记事本项目,涵盖日历查看、添加备忘录、闹钟提醒和删除备忘录等功能。项目使用SQLite数据库进行数据存储,通过CalendarView、EditText、Button等控件实现用户交互,并利用AlarmManager和PendingIntent实现闹钟提醒功能。此外,项目还包括数据库的设计与管理,如创建DatabaseHelper类来管理数据库操作,确保数据的安全性和完整性。文章还探讨了一些常见的开发技巧和注意事项,如时间戳的使用、手势监听的实现等。 适用人群:适用于初学者和有一定经验的Android开发者,尤其是希望深入了解Android开发基础知识和技术细节的人群。 使用场景及目标:该项目旨在帮助开发者掌握Android开发的基本技能,包括UI设计、数据库操作、闹钟提醒机制等。通过实际项目练习,开发者能够更好地理解和应用这些技术,提升自己的开发能力。 其他说明:文中提到一些进阶任务,如用Room替换SQLite、增加分类标签、实现云端同步等,鼓励开发者进一步扩展和优化项目。同时,项目源码公开,便于学习和参考。

    Matlab实现基于SVM-Adaboost支持向量机结合Adaboost集成学习时间序列预测的详细项目实例(含完整的程序,GUI设计和代码详解)

    内容概要:本文档详细介绍了一个基于SVM(支持向量机)和Adaboost集成学习的时间序列预测项目。该项目旨在通过结合这两种强大算法,提升时间序列预测的准确性和稳定性。文档涵盖了项目的背景、目标、挑战及其解决方案,重点介绍了模型架构、数据预处理、特征选择、SVM训练、Adaboost集成、预测与误差修正等环节。此外,文档还探讨了模型在金融市场、气象、能源需求、交通流量和医疗健康等多个领域的应用潜力,并提出了未来改进的方向,如引入深度学习、多任务学习、联邦学习等先进技术。 适合人群:具备一定机器学习基础的研究人员和工程师,特别是那些从事时间序列预测工作的专业人士。 使用场景及目标:①用于金融市场、气象、能源需求、交通流量和医疗健康等领域的复杂时间序列数据预测;②通过结合SVM和Adaboost,提升预测模型的准确性和稳定性;③处理噪声数据,降低计算复杂度,提高模型的泛化能力和实时预测能力。 其他说明:文档不仅提供了详细的理论解释,还附有完整的Matlab代码示例和GUI设计指导,帮助读者理解和实践。此外,文档还讨论了模型的部署与应用,包括系统架构设计、实时数据流处理、可视化界面、GPU加速推理等方面的技术细节。

    #游戏之追逐奶酪123

    #游戏之追逐奶酪123

    威纶通触摸屏配方管理系统解析:宏程序、数据结构与UI设计

    内容概要:本文详细介绍了威纶通触摸屏配方管理系统的实现方法及其应用场景。首先,文章讲解了配方管理的基本概念和技术背景,强调了配方管理在工业自动化中的重要性。接着,通过具体的宏程序代码示例,展示了如何实现配方的保存、加载以及安全校验等功能。文中还提到配方数据结构的设计,如使用寄存器地址偏移来确保数据不冲突,并通过CSV文件格式方便地管理和维护配方数据。此外,文章深入探讨了UI设计方面的内容,包括动态图层技术和按钮交互效果的应用,使得用户界面更加友好和直观。最后,作者分享了一些实际项目中的经验和技巧,如文件操作的异常处理和宏指令调试方法。 适合人群:从事工业自动化领域的工程师和技术人员,尤其是对触摸屏配方管理系统感兴趣的读者。 使用场景及目标:适用于需要频繁切换设备参数的生产环境,如食品加工、注塑成型等行业。通过使用威纶通触摸屏配方管理系统,可以提高工作效率,减少人为错误,同时简化设备调试和维护流程。 其他说明:附带的工具包提供了完整的宏指令注释版、图库资源和调试工具,帮助用户更好地理解和应用该系统。

    张彩明-图形学简明教程 配书资源

    张彩明-图形学简明教程 PPT课件

    计算机术语.pdf

    计算机术语.pdf

    基于改进粒子群算法的微电网多目标优化调度模型与算法分析

    内容概要:本文详细介绍了利用改进粒子群算法(IPSO)进行微电网多目标优化调度的方法和技术。首先指出了传统粒子群算法(PSO)存在的局限性,如初始化随机性和易陷入局部最优等问题。接着提出了多种改进措施,包括混沌映射初始化、动态权重调整、自适应变异以及引入帕累托前沿机制等。文中通过具体的代码实例展示了这些改进的具体实现,并通过实验验证了改进后的算法在处理微电网优化调度问题时的有效性,尤其是在应对风光发电不确定性方面表现突出。此外,文章还讨论了实际应用场景中的约束处理方法,如功率平衡约束的修复策略,确保理论与实践相结合。 适合人群:对智能优化算法及其在电力系统特别是微电网中的应用感兴趣的科研人员、工程师及研究生。 使用场景及目标:适用于需要对微电网进行多目标优化调度的研究和工程项目,旨在提高微电网运行效率,降低成本并减少环境污染。通过学习本文提供的改进算法和技术手段,能够更好地理解和掌握如何针对特定业务场景定制化地改进经典优化算法。 其他说明:文章不仅提供了详细的理论分析和算法改进思路,还包括了大量的代码片段和实验结果,有助于读者深入理解并快速应用于实际项目中。

    S7-1200 PLC与组态王实现7车位3x3立体车库控制系统

    内容概要:本文详细介绍了基于西门子S7-1200 PLC和组态王的7车位3x3升降横移立体车库控制系统的设计与实现。主要内容涵盖IO分配、梯形图程序、接线图、组态画面设计以及安全防护逻辑等方面。文中强调了硬件互锁、软件互锁、模块化编程、精确控制和平移控制等关键技术点,并分享了一些调试经验和注意事项。此外,还讨论了光电传感器误触发、急停按钮处理、故障记录等实际应用中的挑战及其解决方案。 适合人群:从事工业自动化领域的工程师和技术人员,特别是熟悉PLC编程和组态软件使用的专业人员。 使用场景及目标:适用于需要设计和实施立体车库控制系统的工程项目。目标是帮助读者掌握S7-1200 PLC与组态王的具体应用方法,提高系统可靠性和安全性。 其他说明:文中提供了详细的代码片段和配置示例,有助于读者更好地理解和实践相关技术。同时,作者分享了许多宝贵的实战经验,对于初学者和有一定经验的技术人员都非常有价值。

    数据结构解析:线性表顺序表示的原理、操作及应用

    内容概要:本文详细介绍了线性表及其顺序表示的概念、原理和操作。线性表作为一种基础数据结构,通过顺序表示将元素按顺序存储在连续的内存空间中。文中解释了顺序表示的定义与原理,探讨了顺序表与数组的关系,并详细描述了顺序表的基本操作,包括初始化、插入、删除和查找。此外,文章分析了顺序表的优点和局限性,并讨论了其在数据库索引、图像处理和嵌入式系统中的实际应用。最后,对比了顺序表和链表的性能特点,帮助读者根据具体需求选择合适的数据结构。 适合人群:计算机科学专业的学生、软件开发人员以及对数据结构感兴趣的自学者。 使用场景及目标:①理解线性表顺序表示的原理和实现;②掌握顺序表的基本操作及其时间复杂度;③了解顺序表在实际应用中的优势和局限性;④学会根据应用场景选择合适的数据结构。 其他说明:本文不仅提供了理论知识,还附带了具体的代码实现,有助于读者更好地理解和实践线性表的相关概念和技术。

    计算机数学1 -5 重言式与蕴含式.pdf

    计算机数学1 -5 重言式与蕴含式.pdf

    风电永磁直驱发电并网系统的控制策略与仿真建模

    内容概要:本文详细介绍了风电永磁直驱发电并网系统的构成及其关键控制部分。首先探讨了真实的风速模型构建方法,利用MATLAB生成带有随机扰动和突风成分的风速曲线,用于模拟自然界的风况。接着深入解析了永磁电机的转速控制机制,特别是最大功率点跟踪(MPPT)算法的具体实现方式,以及如何通过PI控制器调节电磁转矩。随后讨论了并网过程中LCL滤波器的设计要点,确保谐波失真小于3%的同时保持系统稳定性。此外,还涉及到了网侧变流器的锁相环(PLL)设计,增强了其在电网电压跌落情况下的快速跟踪能力。最后讲述了整套系统联调时遇到的问题及解决方案,如协同惯量控制策略应对电网扰动等。 适合人群:从事风力发电研究的技术人员、高校相关专业师生、对新能源发电感兴趣的工程爱好者。 使用场景及目标:适用于希望深入了解永磁直驱风力发电系统的工作原理和技术细节的人群。目标是掌握从风速建模到最终并网控制的完整流程,能够独立进行系统仿真和优化。 其他说明:文中提供了大量具体的代码示例,涵盖MATLAB、Python、C等多种编程语言,有助于读者更好地理解和实践所介绍的内容。

    《基于yolov8的昆虫检测识别检测项目》(包含源码、完整数据集、部署教程)简单部署即可运行。功能完善、操作简单,适合毕设或课程设计.zip

    资源内项目源码是均来自个人的课程设计、毕业设计或者具体项目,代码都测试ok,包含核心指标曲线图、混淆矩阵、F1分数曲线、精确率-召回率曲线、验证集预测结果、标签分布图。都是运行成功后才上传资源,答辩评审绝对信服的,拿来就能用。放心下载使用!源码、数据集、部署说明一站式服务,拿来就能用的绝对好资源!!! 项目备注 1、该资源内项目代码都经过测试运行成功,功能ok的情况下才上传的,请放心下载使用! 2、本项目适合计算机相关专业(如计科、人工智能、通信工程、自动化、电子信息等)的在校学生、老师或者企业员工下载学习,也适合小白学习进阶,当然也可作为毕设项目、课程设计、大作业、项目初期立项演示等。 3、如果基础还行,也可在此代码基础上进行修改,以实现其他功能,也可用于毕设、课设、作业等。 下载后请首先打开README.dataset.txt文件,仅供学习参考, 切勿用于商业用途。

    辞郁报表设计器(2025-03-30)

    本程序使用于:思迅软件、科脉软件、百威软件、泰格软件、嬴通软件等。 安装配置完连接参数后,用默认管理员账号:辞郁,密码:ciyu登录,主界面左上角,双击输入管理员辞郁密码:ciyu 进入设计模式。下载内容中有详细示例截图。 辞郁POP打印工具是一款专业的打印解决方案,主要针对零售行业的商品POP促销单。它支持多种零售软件系统,包括但不限于思迅软件、科脉软件、百威软件、泰格软件和嬴通软件。这种工具的出现极大地便利了零售业者在商品推广和营销方面的操作,通过快速生成并打印商品促销单,帮助商家更好地吸引顾客、提升销售业绩。

    基于蒙特卡洛法的电动汽车负荷预测模型及其MATLAB实现与分析

    内容概要:本文详细介绍了利用蒙特卡洛法对电动汽车负荷进行预测的方法。首先解释了基本原理,即通过建立电动汽车出行时间、行驶里程和充电时间的概率模型,采用蒙特卡洛法进行抽样并累加每辆车的充电负荷,从而得出负荷预测结果。随后展示了具体的MATLAB代码实现,包括初始化参数设置、蒙特卡洛仿真循环、结果处理和可视化。代码中涉及到随机数生成、概率分布、数组操作等关键技术点。通过对不同类型的电动汽车(如私家车和出租车)进行建模,模拟了它们的充电行为,并分析了充电负荷的时间分布特点。最后讨论了模型的可扩展性和改进方向,如引入智能充电策略等。 适合人群:对电力系统、电动汽车技术和蒙特卡洛仿真方法感兴趣的科研人员、工程师和技术爱好者。 使用场景及目标:适用于研究和评估电动汽车对电网的影响,帮助规划和设计充电基础设施,确保电网稳定运行。同时,也为进一步优化充电策略提供了理论支持。 其他说明:文中提供的MATLAB代码可以作为学习和研究的基础,用户可以根据具体情况进行修改和完善。此外,还提到了一些常见的编程技巧和注意事项,有助于提高代码质量和效率。

    基于Python的电网故障仿真:序分量分析与应用

    内容概要:本文详细介绍了如何利用Python进行电网故障仿真,重点在于不同类型故障(单相接地、相间短路、相间短路接地)下的序分量分析。文中首先准备了必要的工具包,定义了系统参数,并通过具体的代码实例展示了如何计算和可视化各种故障状态下的正序、负序和零序分量。此外,还讨论了不同类型的故障对序分量的具体影响及其在继电保护中的应用。通过这些仿真,能够更好地理解和预测保护装置的动作特性。 适合人群:从事电力系统分析、继电保护设计以及相关领域的工程师和技术人员。 使用场景及目标:适用于研究和开发电力系统的故障检测和保护机制,帮助工程师们优化继电保护装置的参数设置,提高电力系统的稳定性和可靠性。 其他说明:文章强调了仿真过程中需要注意的关键点,如接地电阻设置、变压器接线方式、线路参数单位等,确保仿真结果的准确性。同时,提供了多个代码片段作为参考,便于读者快速上手实践。

    使用量子退火来优化6G网络中的路径选择-Quantum Annealing to optimize path selection in a 6G network-matlab

    6G中基于量子计算的路由 该代码使用量子退火来优化6G网络中的路径选择 基于图的网络,在考虑干扰和拥塞的同时,根据最短路径优化路由路径。

Global site tag (gtag.js) - Google Analytics