JavaScript Data Grid

Row Sorting

javascript logo

This page describes how to sort row data in the grid and how you can customise that sorting to match your requirements.

Sorting

Sorting is enabled by default for all columns. You can sort a column by clicking on the column header. To enable / disable sorting per column use the sortable column definition attribute.

const gridOptions = {
    columnDefs: [
        { field: 'name' },
        { field: 'age' },
        // disable sorting by address
        { field: 'address', sortable: false },
    ],

    // other grid options ...
}

To disable sorting for all columns, set sorting in the default column definition.

const gridOptions = {
    // disable sorting on all columns
    defaultColDef: {
        sortable: false
    },
    columnDefs: [
        // Override default to enable sorting by name
        { field: 'name', sortable: true },
        { field: 'age' },
        { field: 'address' },
    ],

    // other grid options ...
}

Custom Sorting

Custom sorting is provided at a column level by configuring a comparator on the column definition.