SMART datagrid v.1
Examples
(SMART datagrid格不支持IE8及以下版本。 请参考
产品设置页面。)
(发布新版本的过程中,例题可能会暂时停止运行。 所公开的例题都会运行在用户浏览器上,无需另外进行设置。)

如果指定ValueColumn.cursor属性,就可以在鼠标处于数据单元格上方时,分别为各个列变更所显示的鼠标光标形状。 而且,也可以通过使用DisplayOptions.cursorCallback,分别为各个数据单元格指定光标。

通过调整网格边框和页眉单元格边框大小等, 设计更加丰富的页眉区域。

通过使用数据列的autoFilter属性, 只为用户显示包含在列的值中不重复的值, 并且可以只显示相关所选值的数据行。 而且,可以与现有的列筛选器同时使用。

将大量网格数据转换成Excel的操作,可能会根据系统性能而需要较长时间。 因为JavaScript用户界面运行在单一线程上, 所以当创建Excel的操作持续很长时间时,UI会停止运行。
为应对这种问题, DataLudi.格通过异步方式运行Excel导出操作。

包含数据单元格在内,如果移动鼠标至页眉、页脚、概述单元格上方并保持一定时间时, 将会显示工具提示。 另外,可以使用html并根据实际情况,构成显示在工具提示的内容。

在列表编辑器的下拉列表框中, 可以同时显示分别相关values和labels的两个值或显示其中一个值。 可以通过ListCellEditor.listItemDisplay属性,指定显示方式。

如果指定DataColumn.button属性,就可以在数据单元格的右侧显示按钮。 目前,可以通过CellButton.POPUP或ACTION进行指定。

SeriesColumn同时显示相关的一个以上的字段值。 可以通过一个视觉模式, 确认各个时点的值的变化或各个组织的比较等多个值。

与一般的文件编辑应用相同, DataLudi.格提供可以分阶段撤消(Undo)和重做(Redo) 用户输入或数据组修改的功能。

通过cached而设置的计算列, 可以在必要时通过保管和重新使用已计算的值而提高性能。
这时,如果将计算区域扩展到网格或行组级别,则可以在计算列单元格显示具有特殊目的的值。

ImageCellRenderer加载和绘制储存在单元格的值中的URL的图像。 如果单元格的值不具有所有路径, 则可以通过使用计算列的valueCallback,动态创建所有路径。

可以通过合并的形式,显示属于一个列的一个以上的邻居单元格。 合并单元格的标准是指定在ValueColumn.mergeExpression属性的表达式的结果值。 也就是说,如果通过表达式计算各个行并且前后单元格的值相同,就会合并显示这两个单元格。 如果DataLudi.表达式不足时,也可以在mergeCallback属性中指定JavaScript回调函数。

包括基本页眉文本在内的子文本、图像图标、复选框、菜单句柄等, 都可以被显示在列标头。
- Hello Grid
- 说明创建和连接数据组和网格的最基本的过程。
- 列分组
- 通过使用列组,可以构成多种列布局。
- 聚焦单元格
- 说明数据单元格位置的意义、指定具有焦点的数据单元格位置的方法及位置变更事件。
- 列注脚
- 显示注脚并且在相关注脚显示各个列的数据统计值的例题。
- 列注脚回调
- 通过使用回调函数,在注脚中显示各个列的数据统计值的例题。
- 列排序
- 了解列数据排序。
- 列筛选
- 了解列筛选。
- 列样式
- 设置和变更列样式。
- Excel导出
- 通过Excel文件,导出网格内容的例题。
- 动态样式导出
- 通过Excel文件,导出设置在列或行的动态样式的例题。
- 单元格渲染器
- 了解数据单元格渲染器的概念和基本使用方法。
- 列动态样式
- 了解动态指定绘制数据单元格的单元格渲染器的方法。
- 动态单元格渲染器
- 通过使用动态样式并且根据单元格的值或行的状态,指定不同的单元格样式的例题。
- 固定列
- 设置固定列并了解相关属性。
- 系列列
- 使用SeriesColumn的例题。
- 加载CSV数据
- 将CSV类型的数据导入到网格数据组的行的例题。
- 加载JSON数据
- 将JSON类型的数据导入到网格数据组的行的例题。
- 加载XML数据
- 将XML类型的数据导入到网格数据组的行的例题。
- 延迟加载数据
- 分步(并非同时)导入所有数据组的例题。
- 设置数据行
- 通过调用API,填充数据组的初始行的例题。
- 网格数据组的数据处理
- 了解连接到GridView的GridDataSet的基本数据处理方式。
- 网格数据组的数据导入
- 了解连接到GridView的GridDataSet的数据导入方法。
- 设置行计数
- 不用追加调用行,也可以变更GridDataSet的行的数量。
- 搜索行
- 了解可以搜索适合指定条件的行的方法。
- 网格页眉
- 了解GridHeader的属性。
- 网格页脚
- 了解GridFooter的属性。
- 网格页眉概述
- 了解HeaderSummary的属性。
- 行指示器
- 了解RowIndicator的属性。
- 数据行状态
- 了解相关数据行状态的内容。
- 试件
- 了解相关CheckBar属性和网格行的Checked状态。
- 可选的表达式和回调
- 通过表达式和回调函数,可以控制用户可变更的选中状态的行。
- 滚动条
- 了解布置ScrollBar等的方法。
- 行悬停掩码
- 了解显示行悬停掩码的方法。
- 固定行
- 设置固定行并了解相关属性。
- 列单元格合并
- 以值为标准,合并和显示数据单元格的例题。
- 行分组
- 了解通过指定字段值为标准,分组数据行等的方法。
- 合并行分组
- 了解通过合并单元格的方式,实现行分组的方法。
- 行组级别
- 了解分别为各个行组级别指定属性和样式的方法。
- 选择
- 了解通过多种形式,选择数据单元格区域的方法。
- 竖条单元格渲染器
- 了解竖条单元格渲染器的使用方法。
- 单元格编辑
- 了解相关单元格编辑的基本内容。
- 只读和可编辑
- 了解指定能否编辑和修改单元格的方法。
- 行修改
- 了解通过用户编辑,修改现有行的方法。
- 行插入
- 了解通过用户编辑,添加行的方法。
- 行删除
- 了解用户删除行的方法。
- 布尔值
- 了解在数据组储存和在数据单元格显示布尔字段值的方法。
- 数值
- 了解在数据组储存和在数据单元格显示数字字段值的方法。
- 日期时间值
- 了解在数据组储存和在数据单元格显示日期时间字段值的方法。
- 链接单元格渲染器
- 了解链接单元格渲染器的使用方法。
- 检查单元格渲染器
- 了解检查单元格渲染器的使用方法。
- 数据查找
- 了解通过使用查找功能,显示数据单元格的值的方法。
- 标号字段
- 了解通过使用标号字段,替代原有字段值而显示其他字段值的方法。
- 单元格样式
- 了解通过使用CellStyle,指定各个数据单元格样式的方法。
- 列布局
- 了解通过使用列布局,变更列的布局的方法。
- 上下文菜单
- 了解替代浏览器上下文菜单的方法。
- 列弹出菜单
- 在数据列中添加弹出菜单的例题。
- 分页
- 了解最简单的分页方法。
- 分页数据
- 了解加载需要变更页面时所需数据的方式。
- 分页偏移
- 了解通过不同方式,指定将显示在页面上的行的方式。
- 分页行
- 了解明确指定将显示在页面上的行的方法。
- 图标单元格渲染器
- 了解图标单元格渲染器的使用方法。
- 图像单元格渲染器
- 了解图像单元格渲染器的使用方法。
- 形状单元格渲染器
- 了解形状单元格渲染器的使用方法。
- 信号格数单元格渲染器
- 了解信号格数单元格渲染器的使用方法。
- 条码单元格渲染器
- 了解条码单元格渲染器的使用方法。
- 火花图渲染器
- 了解可用于系列列单元格的火花图。
- 吐司视图
- 当调用长时间运行的函数时,显示吐司视图的例题。
- 编辑键
- 了解用于单元格之间的移动或单元格编辑的键入。
- 单元格验证
- 了解在编辑过程中,运行单元格单位验证的方法。
- 行验证
- 了解在结束编辑时,运行行单位验证的方法。
- 文本编辑器
- 了解关于输入文本的编辑器。
- 列表编辑器
- 了解展开包含选择项的下拉列表框的编辑器。
- 在下拉列表中显示两个值
- 了解在下拉列表中,显示两个值的方法。
- 日期编辑器
- 了解可输入日期的编辑器。
- 动态编辑器
- 各个数据行可分别使用不同的编辑器。
- Hello Tree
- 创建和连接树视图和树数据组的基本过程。
- 树数据组
- 了解TreeDataSet的基本功能。
- 加载树数据组
- 从多种样式的外部数据源加载树数据的例题。
- 延迟加载树数据组
- 必要时加载子行的例题。
- 树视图筛选
- 在树视图中,适用列筛选器。
- 树视图行筛选
- 在树视图中,适用行筛选器。
- 树视图编辑
- 了解在树视图中,用户修改数据的方法。
- 树行页脚
- 了解根据各个树行,显示页脚的方法。
- 剪贴板复制
- 了解将系统剪贴板复制到数据单元格区域的方法。
- 剪贴板粘贴
- 了解将剪贴板文本粘贴到数据单元格区域的方法。
- 撤消和重做
- 撤消和重做(Undo & Redo)。
- 行样式
- 了解在数据行,适用样式的方法。
- 交替行背景颜色
- 了解区分显示网格行的背景颜色的方法。
- 网格数据组共享
- 了解多个网格共享数据组的方式。
- 网格行源共享
- 了解多个网格共享行源的方式。
- Hello Animation
- 通过使用环规渲染器,在变更数据时实现动画效果。
- 线性规渲染器
- 线性规渲染器的使用例题。
- Hello Chart
- 通过使用图表显示相关的一个以上字段值,使用户更为有效地查看数据组。
- 行组图
- 了解在已进行行分组的合并单元格中,显示图表的方法。
- 组页脚图
- 在已进行行分组的各个组的页脚区域,通过使用图表,显示分组行的值。
- 组页眉图
- 在已进行行分组的各个组的页眉区域,通过使用图表,显示分组行的值。
- 树页脚图
- 在各个树级别的页脚区域,显示由子行的值所构成的图表。
- 树页眉图
- 在各个树级别的页眉区域,显示由子行的值所构成的图表。
- 衍生字段
- 了解衍生字段的基本使用方法。
- 计算列
- 了解计算列的基本使用方法。
- 行概述
- 了解使用衍生字段或计算列,显示行单位合计的方法。
- 代表列
- 了解指定代表列组的列的方法。
- 列标头概述
- 在标头合计区域显示列合计等。
- 列标头
- 了解修饰列标头的方法。
- 加载样式
- 适用设置为其他对象的网格样式表的例题。
- 搜索树行
- 了解搜索适合树视图指定条件的行的方法。
- 数据单元格按钮
- 分别为各个数据单元格设置菜单按钮和动作按钮。