1. API reference
  2. Welcome
    1. Component overview
    2. Quick start
    3. System requirements
    4. Troubleshooting
    5. Managing license keys
  3. Connecting to Data Source
    1. JSON
      1. Connecting to JSON
      2. Connecting to JSON using the Data Compressor
      3. Data types in JSON
    2. CSV
      1. Connecting to CSV
      2. Connecting to CSV using the Data Compressor
      3. Data types in CSV
    3. Database
      1. Connecting to SQL databases
      2. Connecting to other databases
      3. Connecting to a database with Node.js
      4. Connecting to a database with .NET
      5. Connecting to a database with .NET Core
      6. Connecting to a database with Java
      7. Connecting to a database with PHP
    4. Microsoft Analysis Services
      1. Connecting to Microsoft Analysis Services
      2. Getting started with the Accelerator
      3. Installing the Accelerator as a Windows service
      4. Referring the Accelerator as a DLL
      5. Configuring the authentication process
      6. Configuring a secure HTTPS connection
      7. Troubleshooting
    5. Pentaho Mondrian
      1. Connecting to Pentaho Mondrian
      2. Getting started with the Accelerator
      3. Configuring Mondrian roles
      4. Configuring username/password protection
      5. Configuring a secure HTTPS connection
      6. Troubleshooting
    6. Elasticsearch
      1. Connecting to Elasticsearch
      2. Configuring the mapping
  4. Security
    1. Security in Flexmonster
    2. Security aspects when connecting to an OLAP cube
      1. The data transfer process
      2. Data security
      3. Data access management
    3. Security aspects when connecting to a database
      1. The data transfer process
      2. Data access management
  5. Configuring report
    1. What is a report
    2. Data source
    3. Slice
    4. Options
    5. Number formatting
    6. Conditional formatting
    7. Set the report for the component
    8. Get the report from the component
    9. Date and time formatting
    10. Configuring global options
    11. Export and print
    12. Calculated values
    13. Custom sorting
  6. Integration with frameworks
    1. Available tutorials
    2. Integration with AngularJS (v1.x)
    3. Integration with Angular
    4. Integration with React
    5. Integration with Webpack
    6. Integration with ASP.NET
    7. Integration with jQuery
    8. Integration with JSP
    9. Integration with TypeScript
    10. Integration with RequireJS
    11. Integration with PhoneGap
  7. Integration with charts
    1. Integration with Highcharts
    2. Integration with Google Charts
    3. Integration with FusionCharts
    4. Integration with any charting library
  8. Customizing
    1. Customizing toolbar
    2. Customizing appearance
    3. Customizing context menu
    4. Localizing component
  9. Updating to the latest version
    1. Updating to the latest version
    2. Release notes
    3. Migration guide from 2.6 to 2.7
    4. Migration guide from 2.5 to 2.6
    5. Migration guide from 2.4 to 2.5
    6. Migration guide from 2.3 to 2.4
    7. Migration guide from 2.2 to 2.3
    8. Documentation for older versions
Table of contents

Custom sorting

Flexmonster Pivot allows you to set the specific sorting order for hierarchy members in columns, rows, or report filters. By default, hierarchy members are sorted alphabetically in the component. In OLAP cubes, Flexmonster takes the order that was defined inside the cube. The following options are available to define sorting:

  1. set alphabetical, reverse alphabetical, or an unsorted order for members
  2. define custom sorting using a sorting function
  3. define custom sorting using an array (for JSON, CSV, and OCSV)

Set alphabetical, reverse alphabetical, or an unsorted order for members

Alphabetical order is used by default. To set reverse alphabetical order or display members unsorted, use setSort(). This API call has the following parameters:

  • hierarchyName – String. The name of the hierarchy to which the sorting is applied.
  • sortType – String. The following sorting types can be applied: "asc", "desc", or "unsorted".

Here is a simple example:

flexmonster.setSort("Category", "desc");

Try the example on JSFiddle.

The sorting type can also be specified directly in the report:

{
    "dataSource": {
        "filename": "http://www.flexmonster.com/download/data.csv"
    },
    "slice": {
        "rows": [
            {
                "uniqueName": "Category",
                "sort": "desc"
            }
        ],
        "measures": [ {"uniqueName": "Price"} ]
    }
}

Define custom sorting using a sorting function

The sort order can be set via sortingMethod(). This API call has the following parameters:

  • hierarchyName – String. The unique name of the hierarchy to which the sorting is applied.
  • compareFunction – Function. Defines the sort order. The input parameters are the same as for the compareFunction of the Array.sort() method.

Here is a simple example, where the new sorting function is applied to the "Category" hierarchy:

flexmonster.sortingMethod("Category", function (a, b) {
    return a < b ? 1 : -1;
});

Try the example on JSFiddle.

Adding a custom sorting function is used to override the default alphabetical order. For example, you can make sure that some members are always kept at the end or at the start of the list.

Define custom sorting using an array (for JSON, CSV, and OCSV)

Custom sorting for JSON, CSV, and OCSV data sources can be set via the sortOrder array. This property can be specified like so: ["member_1", "member_2", etc.].

We will analyze a simple example to understand how it works. There is a report with one hierarchy defined as a row:

{
    "dataSource": {
        "filename": "http://www.flexmonster.com/download/data.csv"
    },
    "slice": {
        "rows": [
            {
                "uniqueName": "Category"
            }
        ],
        "measures": [ {"uniqueName": "Price"} ]
    }
}

This hierarchy has the following members: “Accessories”, “Bikes”, “Clothing”, “Components”, and “Cars”. To define custom sorting we add the sortOrder property:

{
    "dataSource": {
        "filename": "http://www.flexmonster.com/download/data.csv"
    },
    "slice": {
        "rows": [
            {
                "uniqueName": "Category",
                "sortOrder": ["Bikes", "Cars", "Clothing", 
                    "Accessories", "Components"]
            }
        ],
        "measures": [ {"uniqueName": "Price"} ]
    }
}

Open the example on JSFiddle.

Now hierarchy members will be displayed in the predefined order:

custom sort

The reverse alphabetical order will sort in the opposite order to the one defined in the sortOrder property:

customsort-za

If you remove both alphabetical and reverse alphabetical sorting, hierarchy members will be displayed in the same order they came from the data source:

customsort-no-order

Custom sorting is an easy way to predefine your own order for columns, rows, or report filters in the slice.