SMART datagrid v.1 > Examples

Back  Forward

Row Styles  Example

如同列样式,无关于运行时间内的数据单元格的值,行样式可以指定特定数据行的样式属性。 但是,因为数据行的数量可能不胜枚举,并且会在运行时间内被删除或添加,所以我们无法预先指定所有数据行的样式组。 

如下列代码中所示,SMART datagrid格可以通过两种方式,指定各个行的样式组。 

Code -1
    grid.body().setRowRangeStyles({
        '0': { background: '#10ff0000' },
        '1': { background: '#20ff0000' },
        '2': { background: '#30ff0000' },
        'rows': [{
            'range': 'row % 2 == 1',
            'styles': {
                'background': '#08000000'
            }
        }, {
        }] 
    });
Grid - 1
rows

通过GridBase.bodyrowStyles,指定各个行的样式组。 如果是固定不变的数据行,则可以用行的号码为标准进行设置,或可以设置通过range表达式而指定在rows属性中的各个行组的样式组。 range表达式中,可以使用相应数据行号码的"row"变量。 

当发生渲染时,相比包含列样式在内的其他所有动态样式,将会预先适用行样式。 也就是说,因为适用优先级最低,所以行样式将会被其他样式所覆盖。 如区分奇数和偶数行的情况等,无关于数据单元格的值,行样式可以被用于有效区分和显示行。 


查看源代码 JSP 

See Also
GridBody.rowStyles
GridBody.rowDynamicStyles
GridColumn.styles
GridBase.body
GridRowStyles
GridStyles
动态样式概述
表达式概述
Examples
交替行背景颜色
行动态样式