SMART datagrid v.1

Back  Forward

Examples

(SMART datagrid格不支持IE8及以下版本。 请参考产品设置页面。)
 

(发布新版本的过程中,例题可能会暂时停止运行。 所公开的例题都会运行在用户浏览器上,无需另外进行设置。) 


光标

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

页眉样式

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

列自动筛选

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

选取显示

如果将DisplayOptions.selectDisplay指定为CELL, 就会替代使用不透明掩码显示所选区域的方式, 通过使用GridStyles.selectedBackground和selectedColor并且以单元格为单位,显示选择状态。

掩码编辑器

如果使用MaskCellEditor,可以通过运行时间等多种方式,限制用户的输入形式。(Testing)

异步导出

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

工具提示

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

列表编辑器的两个值

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

数据单元格按钮

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

火花图(Spark Chart)渲染器

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

撤消(Undo)和重做(Redo)

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

累计计算列

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

衍生字段和行标签

如果将数据标签适用到衍生字段, 则无需变更源数据,也可以在运行时间动态显示数据组的不同方面。 在衍生字段的表达式中,可以使用tag变量, 而这是通过DataSet.setRowTag设置的值。

行高

如果具有两个以上子列的垂直layout的列组不包含在内, 并且如果将variableRowHeight指定为true, 就可以区分各个数据行的高度。

滚动条

网格滚动条的宽度、开始位置、按钮开始位置等,可以通过多种方式进行指定。 而且,也可以另外指定各个因素的样式。 可以通过GridBase.vscrollBarhscrollBarScrollBar的对象属性来设置这些属性。

信号格数(Signal Bar)单元格渲染器

通过显示信号强度的、非连续性barCount数量的信号格数,显示数据单元格的值和对minimummaximum范围的比例。 因为按信号格数的数量单位进行显示,所以可以被用于显示各阶段的值(而非正确的值)等。

图像单元格渲染器

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

列单元格合并

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

形状单元格渲染器

ShapeCellRenderer将指定为GridStyles.shapeName的形状,显示在指定为shapeLocation的位置。 默认值为LEFT_SIDE。 通过shapeRotate等样式和scaleX等渲染器属性, 可以使用多种方式显示形状。 关于可显示的形状类型,请参考ShapeCellRenderer帮助主题。

列标头

包括基本页眉文本在内的子文本、图像图标、复选框、菜单句柄等, 都可以被显示在列标头

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