Tutorials

Sorting

Preface

In Basic Grid section we did simple grid.
Now, let us add sorting to columns.
For that we need add property sortable: true to column. 

defaults: {
  sortable: true,
  resizable: true,
  draggable: true
},
columns: [{
  index: 'name',
  title: 'Name'
}, {
  index: 'surname',
  title: 'SurName'
}, {
  index: 'country',
  title: 'Country'
}, {
  index: 'position',
  title: 'Position'
}, {
  index: 'email',
  title: 'Email'
}]

Events

Let's learn a bit about events on example of sorting.
To get handler on sorting event it requires to add property events 

events: [{
  sort: function(grid, options){
    
  }
}]
...
In options we will have 2 params.
  • key - String|Number.
    Column index(key).
  • action - String.
    Sort direction: asc, desc, drop.

Methods

Let us imagine that we need to sort grid outside not over clicking column header.
For that there is method sort with params key and action.
That to run methods for grid it needs to have link of grid.
More about methods Doc Methods.