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: ['编辑', '删除']
}],

评论

17 楼 clue 2011-04-19  

zhangdaiping 写道

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

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

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

16 楼 bond88 2011-04-19  

zhangdaiping 写道

bond88 写道

请教博主一个关于隐藏列的问题，如果树视图里有个隐藏列存在，显示的时候水平网格线会出现中断，光条也会中断，而且列头的隐藏列占的宽度不能消失，看起来显得很不舒服。不知道这是什么问题？

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

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

15 楼 zhangdaiping 2011-04-19  

bond88 写道

请教博主一个关于隐藏列的问题，如果树视图里有个隐藏列存在，显示的时候水平网格线会出现中断，光条也会中断，而且列头的隐藏列占的宽度不能消失，看起来显得很不舒服。不知道这是什么问题？

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

14 楼 zhangdaiping 2011-04-19  

clue 写道

zhangdaiping 写道

clue 写道

我对BufferTree比较感兴趣，不知道有没有人实现过？
类似Grid的BufferView，或者应该叫BufferNodeUI？

TreeGrid在数据量大时实在是杯具啊，所有行都渲染了，只不过是display:none隐藏。

BufferTree是什么，给链接

还没人实现呢... 参考Grid的BufferView，用于大量数据情况下的缓冲显示，即只显示可见数据。
例如1000条的gird，当前滚动条位置下只能看到50~70行，那就只渲染这20来行。

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

13 楼 clue 2011-04-19  

zhangdaiping 写道

clue 写道

我对BufferTree比较感兴趣，不知道有没有人实现过？
类似Grid的BufferView，或者应该叫BufferNodeUI？

TreeGrid在数据量大时实在是杯具啊，所有行都渲染了，只不过是display:none隐藏。

BufferTree是什么，给链接

还没人实现呢... 参考Grid的BufferView，用于大量数据情况下的缓冲显示，即只显示可见数据。
例如1000条的gird，当前滚动条位置下只能看到50~70行，那就只渲染这20来行。

12 楼 bond88 2011-04-19  

请教博主一个关于隐藏列的问题，如果树视图里有个隐藏列存在，显示的时候水平网格线会出现中断，光条也会中断，而且列头的隐藏列占的宽度不能消失，看起来显得很不舒服。不知道这是什么问题？

11 楼 zhangdaiping 2011-04-18  

clue 写道

我对BufferTree比较感兴趣，不知道有没有人实现过？
类似Grid的BufferView，或者应该叫BufferNodeUI？

TreeGrid在数据量大时实在是杯具啊，所有行都渲染了，只不过是display:none隐藏。

BufferTree是什么，给链接

10 楼 clue 2011-04-18  

我对BufferTree比较感兴趣，不知道有没有人实现过？
类似Grid的BufferView，或者应该叫BufferNodeUI？

TreeGrid在数据量大时实在是杯具啊，所有行都渲染了，只不过是display:none隐藏。

9 楼 zhangdaiping 2011-04-18  

2011-4-18 更新1.3版

• 修正改变列宽时，grid宽度resize出错的问题
• 修正一些已知的小BUG
• 增加功能按钮显示/隐藏，启用/禁用的接口

8 楼 zhangdaiping 2011-01-10  

kdmhh 写道

EditTreeGrid支不支持多选框？

EditTreeGird是后开发的，和TreeGridEditor是不同的。

EditTreeGird不支持多选

7 楼 kdmhh 2011-01-10  

EditTreeGrid支不支持多选框？

6 楼 kdmhh 2011-01-10  

不好意思，哪一个版本是最新的呀？1.2为什么在1.4之后发布？

5 楼 kdmhh 2011-01-10  

请教一下：
能不能单击某一列直接进入编辑状态，鼠标离开自动保存。不出现"save"和"cancel"等按钮？
谢谢

4 楼 se7en8974 2010-12-16  

zhangdaiping 写道

什么的Itemselector？描述详细点

就是ux文件夹下的那个itemselector multiselect 左右选择框的 支持拖拽。

3 楼 zhangdaiping 2010-12-16  

什么的Itemselector？描述详细点

2 楼 se7en8974 2010-12-16  

请教下楼主，Itemselector的数据过滤的问题。

1 楼 zhangdaiping 2010-12-16  

2010/12/16更新1.2版

• 新增/修改动作提交AJAX请求，调用URL出错的BUG
• 行编辑状态，提交AJAX时，增加一个参数parentNodeId（父节点ID）
• 增加API注释，详细查看源码EditTreeGrid.js