SMART datagrid v.1 > Examples

Back  Forward

Column Sorting  Example

可以通过点击列标头或调用GridBase.orderBy方法,进行各个列的排序。 如果想让用户通过点击列标头进行排序,就需要首先在GridBase.operateOptions设置相关排序的功能。 如果是调用方法的排序,则与属性无关。 

Code -1
    function (ev) {
        grdMain.operateOptions().setSortingEnabled(ev.target.value);
    }

即使是可以在网格级别进行排序的状态,同样可以通过DataColumn.sortable属性,指定用户能否进行各个列的排序。 如果点击下列"Change Column Sortable"按钮,可以交替设置能否进行所选列的排序。 

Code -2
    function (ev) {
        var column = grdMain.focusedIndex().column;
        if (column instanceof DataLudi.DataColumn) {
            column.setSortable(!column.sortable());
            // 如果sortable变成false,就会变更背景颜色。
            // Styles将会在下列例题中进行说明。
            column.styles().setBackground(column.sortable() ? '#fff' : '#10000000');
        }
    }
Grid - 1
rows
Sort Style:
OperateOptions.SortHandleVisibility:
ColumnHeader.SortHandleVisibility:

实际上,排序过程是以连接在列的数据字段(而非列单位)为标准而运行的。 我们可以对一个以上字段同时进行排序,而这时,将会在保持首先排序的字段值顺序的状态下,排序所添加的字段值。 

如果将sortStyle属性指定为SortStyle.INCLUSIVE,则可以实现多重排序。 可以在上面的Sort Style选择框中进行确认。 

Code -3
    function (ev) {
        grdMain.operateOptions().setSortStyle(ev.target.value);
    }

SortStyle.REVERSE是首先排序后来被点击的字段的方式。 

如果将OperateOptions.keepFocusedRowWhenSort指定为true,排序后就会保持聚焦行位置。 


查看源代码 JSP 

See Also
GridBase.orderBy
operateOptions
DataColumn.sortable
SortStyle
OperateOptions.sortingEnabled
DataField
Examples
列筛选
列标头