JavaScript DataSource sorting

In this blog entry, we review the ShieldUI DataSource sorting capabilities.
Shield UI DataSource supports sorting data by single or multiple fields. To specify sorting parameters, use the sort initialization setting when creating a new DataSource instance:

1 2 3 4 5 6 7 8

var ds = new shield.DataSource( {     data: [/*...*/],     sort: { path: "name", desc: true } }); ds.read().then(function () {     var dataView = ds.view;     //dataView contains the sorted data });

To set sorting parameters after the DataSource is initialized, use the sort property of the component:

1 2 3 4 5 6

ds.sort = { path: "birthDate" }   ds.read().then(function () {     var dataView = ds.view;     //dataView contains the newly sorted data });

Shield UI DataSource sorting by multiple fields. To specify multi-field sorting, set the sort initialization setting or DataSource property to an array of objects, each object containing a single sorting setting:

1 2 3 4 5 6 7 8 9 10 11

var ds = new shield.DataSource( {     data: [/*...*/],     sort: [         { path: "name", desc: true },         { path: "birthDate" }     ] }); ds.read().then(function () {     var dataView = ds.view;     //dataView contains the data sorted by multiple fields });

By default, Shield UI DataSource sorts the data locally. If using remote data binding and the DataSource.remote.operations array contains “sort”, the component sends sorting parameters to the server and does not explicitly sort the resulting data. Thus, server-side sorting is supported.

The default sorting algorithm in Shield UI DataSource adheres to the following rules:

1. Numeric data is sorted in numeric order.
2. Date objects are converted to numeric data using getTime() and sorted numerically.
3. Strings are sorted in lexicographic order.
4. Null and undefined values are treated equal and are sorted according to their source order.
5. Any other non-null data is converted to string and sorted in a lexicographic order.

For cases when a different sorting algorithm is required, Shield UI DataSource supports custom sort functions. To specify a custom sort function, set the sort initialization setting or DataSource field to a function expression:

1 2 3 4 5 6 7 8 9 10 11

var ds = new shield.DataSource( {     data: [/*...*/],     sort: function (a, b) {         //custom sort function         return a.birthDate - b.birthDate;     } }); ds.read().then(function () {     var dataView = ds.view;     //dataView contains the custom sorted data });