当前位置:主页 - 在线演示 - 树列表 
树列表 报表 自由表头 小型页面控件 移动应用



 关于树列表

   Supcan Treelist (硕正树列表) 能将一
 个简单的平面二维表以多种形式展现,并且
 允许对其作一些常规的交互操作。
   Supcan Treelist 的 "树" 和 "列表"是
 互通的,可以相互切换,也就是说平面数据
 既可以以普通表格的方式展现,也可以以树
 的方式展现。
 
   Treelist 内置了丰富的输入控件,例如
 数值和日期的掩码式输入(EditMask)、各种
 下拉(包括类似PowerBuild中的Dropdown 
 Datawindow式的嵌套式下拉)、按钮等,
 使其具备了表格的完整的增、删、改功能,
 并能简洁而有效地将输入内容提交给服务
 器,从而实现了表格的高效输入。
 
   Supcan Treelist 还内置了包括反向调
 用javascript 在内的强大的表达式解析功
 能,实现了表格横向的列数据之间的逻辑关
 联、纵向的小计合计、过滤等功能。
   此外,Treelist 还有事件触发、排序、
 过滤、打印、通过API 操纵数据和更改外观
 等必备的功能。
 
   在页面中,Treelist控件是根据XML 描
 述文挡动态创建的,而表格中的数据则独立
 于该XML(也允许混合),需要通过 js 动态
 加载。本demo 中的数据都是静态文件,而
 在实际使用时通常是动态生成的,例如 
 Servlet 之类的 Http Response。
 
   通过演示,可以看出Supcan Treelist
 中有很多DevExpress、PB Datawindow
 等产品的影子。硕正公司借鉴了很多以往
 C/S类开发工具的强大的交互功能 - 而这
 正是常规的Web开发难以企及之处。


1.感受Treelist 演示Treelist基本的操作:排序、多层排序、移动列、打印、多层表头、分屏.

2.以Tree展现 感受Tree风格的操作:排序与Tree节点的关系、任意改变树、树的打印、列表与树的任意切换.

3.多层表头 二种表头分层方式:分组表头、折行显示,在企业应用中都很常见.

4.图文并茂(1) 感受Treelist的图像列、背景图的渲染功能。 本例采用了XML格式的数据.

5.图文并茂(2) 文字和小图标并排显示,由显示掩码表达式(DisplayMask)决定显示什么样的图片.

6.引用外部Treelist Treelist列的嵌套引用,实现类似主、外键的View的复用.

7.计算列、合计行 演示了表达式功能:横向的逻辑关系:列的自动计算;纵向逻辑关系:合计.

8.多种掩码输入 演示各种数值型、日期型掩码式输入, 感受限定了范围的输入、非法日期自动纠错、对全键盘输入的支持,以及仿Excle的焦点选择功能.

9.各种下拉 演示了普通下拉、嵌套Treelist下拉、下拉树、下拉允许多选的树.

10.可编辑的下拉 演示具有搜索功能的可编辑下拉,包括客户端搜索和服务器搜索.

11.显示掩码 演示了掩码表达式:同样的数据以不同的掩码显示.

12.事件 Treelist能向页面抛出各种事件:当前行变化、鼠标单击、双击、Click按钮列等.

13.分类汇总 演示了表达式:分类汇总, 以及按任意列进行分类汇总、以树展现的分类汇总.

14.单列多层树(一) 演示了另一种常见的树:单列、且多层的树,如会计科目、项目分级树.

15.单列多层树(二) 演示了单列多层树 3 种数据格式(treeformat),以及 3 种懒加载(LazyLoad)模型.

16.行的复选 演示了多行选择、动态增加列、勾选式删行,以及旋转的背景色和多色表头, 使UI 更时尚.

17.Treelist拖曳 演示了Treelist之间的拖曳、Treelist内部拖曳、单行与多行拖曳.

18.分页方案(一) 结合了 Freeform Pager 的 Treelist分页方案.

19.分页方案(二) Treelist内置的的垂直滚动条的即滚即刷新的分页方案.

20.分页的下拉 一个有分页功能的下拉输入的实例,用于服务器搜索的可编辑下拉.


21.提交修改内容 演示任意增、删、改后生成用以提交的 XML.

22.4种提交级别 演示了生成用于提交的 XML 的 4 种方案.

23.连续输入提交控制 避免重复提交的解决方案.

24.Validation (验证) 在XML描述文件中预设的客户端验证方案.

25.动态更改属性 通过调用API,动态更改了Treelist的各种属性、或操纵数据.

26.自定义右键菜单 演示了自定义的鼠标右键弹出菜单功能.

27.过滤 演示了表达式:过滤数据,注意其中反向调用 js 的实例.

28.过滤: 关联下拉 下拉框中的数据并非一成不变, 可以和行内某些列的数据相关联. 在演示中通过事件和表达式动态更新了、或过滤了下拉内容.

29.下拉的其它功能 演示一个典型的下拉问题:如何取下拉的选中的行中的其它列的内容,以及下拉的其它功能.

30.查询条件(一) 使用了FreeformBar的功能,实现了查询条件的输入.

31.查询条件(二) 一个较复杂的FreeformBar例子,集成了自定义工具条、多种可选查询方案的功能,涉及到了自由表头(Freeform)较高深的内容.

32.FreeformBar 一个使用了FreeformBar中完整的topBar、bottomBar的例子,演示了真实(实时)环境的条件查询、分页和后端排序功能.

33.合并单元格 演示了二种合并单元格的方案:通过API、以及通过设置列属性.

34.定制 用户定制化的简易解决方案.

35.遮罩效果 实现被覆盖的半透明效果,用于网页模式对话框.

36.Undo/Redo 演示 Undo/Redo (撤销和重做) 的功能.

37.性能优化 针对Firefox、Chrome浏览器的性能优化:js密集调用API导致性能下降,以及性能优化的方案.