PivotGrid rowField columns do not respect allowSorting or showSort

Originally Posted 27 May 2016, 7:01 am EST

  • Originally Posted 27 May 2016, 7:01 am EST

    By default, a pivotGrid is sorted on its first rowField in ascending order. The sort direction can be changed by clicking on the rowField's column header. Unlike the columns derived from columnFields, however:

    * the rowField column is always sortable, even when myPivotGrid.allowSorting === false
    * the rowField column never displays a sort indicator, even when myPivotGrid.showSort === true

    The behavior can be seen in this plunk, which also contains instructions for replication: http://plnkr.co/edit/o98HaJ3DKIGWXGY12Hiz?p=preview
  • Reply


    Thank you for providing the sample plunker. I was able to replicate the issue at my end. However, the behaviour which you are currently observing is the expected behaviour. Since, you are binding both the PivotGrid with the same PivotEngine, hence the sorting settings applied to one PivotGrid are set in the other PivotGrid as well. You will need to assign different pivot engines to both the PivotGrid, so as to get the sorting applied to one PivotGrid and not to the other.

    Further, the sort indicator is correctly displayed when setting "myPivotGrid.showSort === true". Kindly refer to the attached HTML Page which implements the same where in the first PivotGrid is sortable and displays sort indicator where as second PivotGrid is not sortable and does not displays sort indicator.

    Hope it helps.

    Manpreet Kaur
  • Reply

    Hi David/Manpreet

    The first issue you mentioned was a bug. The PivotGrid did not honor the "allowSorting" property for row field columns as it should. This has been fixed, you can see the result in the updated plunkr below:


    Many thanks for reporting this problem.

    The second issue is by design. Row field columns are a little different from regular columns in that they are always sorted, either in ascending or descending order. This is different from regular columns, which are unsorted by default.

    We could certainly show the sort icons in row fields, but the grid would look pretty busy with sort icons on all row field headers, plus sort icons over the actual data. One alternative would be to show only descending sort icons, and leave ascending ones blank. That would look a little cleaner, but it would be inconsistent.

    Another alternative would be to add a new, special property for this. We could call it showRowFieldSortIcons, and set it to false by default, which would be the current behavior. Then users could set it to true and see the row field icons if they chose to do so.

    What do you think? Any preferences, or other suggestions?

    Thanks in advance for your feedback!
  • Reply

    The property seems like it might solve our issue, with a caveat: we need a way to hide the sorting arrow after the user clicks on a non-row field column header.

    If I understand your explanation correctly, row fields are still sorted, even when a sort on another column is in play (please correct me if I'm wrong). The problem is that we our pivot table has a single, fixed row field; from our users' perspective, the row field is just another column. So we need the sort behavior and the UI to reflect that: there's only ever one "sorted column" at a time. Any idea how we can accomplish that?
  • Reply

    HI David

    Your understanding is correct: row fields are always sorted (in ascending or descending order), and regular data fields may or may not be sorted.

    If we did add a <b>showRowFieldSortIcons</b> property, you could handle the <b>sortedColumn</b> event and set the new property to true if the column that was sorted is not a data column.

    This way, sorting on any data columns would cause the grid to show the sort icons on the data column that was sorted; sorting on the row field would show the sort over the row field only.

    I tested this using this code:

    $scope.sortedColumn = function (s, e) {

    // option 1:
    // show row field sort icons when the user sorts on the row fields
    // in this case, removing a data sort will *NOT* show the row field sort icons
    s.showRowFieldSort = (e.panel == s.topLeftCells);

    // option 2
    // show row field sort icons when the data is unsorted
    // in this case, removing a data sort *WILL* show the row field sort icons
    //s.showRowFieldSort = s.collectionView.sortDescriptions.length == 0;

    As you can see, there are two possible ways to handle this. The first removes the row field icons whenever the user changes the data sorts (even when they use ctrl+click to remove the data sorts. The second removes the row field icons only when the data is sorted.

    I like this flexibility, it gives you more opportunity to choose the behavior that makes most sense.

    Would this solution work for you?
  • Marked as Answer


    Yep, that'll work for us! Thanks. Do you know when you'd be able to release a version with that property?
Need extra support?

Upgrade your support plan and get personal unlimited phone support with our customer engagement team

Learn More

Forum Channels