Multi-Column Sorting in WPF Pivot Grid

15 Jul 20219 minutes to read

Multicolumn sorting allows you to sort the fields one after the other. For example, if a user has three different fields rendered in the pivot grid, then it is possible to sort like: OrderBy(field1).ThenBy(field2).ThenBy(field3)..

A separate index number is used at the top of each column to maintain the order of the sorted columns while doing the multicolumn sorting. Also, multicolumn sorting can be applied for both Normal and Row Pivots Only modes of the pivot grid control.

Multicolumn sorting in normal mode

You can enable the sorting through XAML or code-behind using the SortOption property of the pivot grid control.
For XAML, refer to the following code sample.

  • XAML
  • <Grid>
            <syncfusion:PivotGridControl HorizontalAlignment="Left" Name="pivotGrid" VerticalAlignment="Top" SortOption="All" ItemSource="{Binding   Source={StaticResource data}}">
    
                <syncfusion:PivotGridControl.PivotRows>
                    <syncfusion:PivotItem FieldHeader="Product" FieldMappingName="Product" TotalHeader="Total" />
                    <syncfusion:PivotItem FieldHeader="Date" FieldMappingName="Date" TotalHeader="Total" />
                </syncfusion:PivotGridControl.PivotRows>
                <syncfusion:PivotGridControl.PivotColumns>
                    <syncfusion:PivotItem FieldHeader="Country" FieldMappingName="Country" TotalHeader="Total" />
                    <syncfusion:PivotItem FieldHeader="State" FieldMappingName="State" TotalHeader="Total" />
                </syncfusion:PivotGridControl.PivotColumns>
                <syncfusion:PivotGridControl.PivotCalculations>
                    <syncfusion:PivotComputationInfo CalculationName="Total" FieldName="Amount" Format="C" SummaryType="DoubleTotalSum" />
                    <syncfusion:PivotComputationInfo CalculationName="Total" FieldName="Quantity" SummaryType="Count" />
                </syncfusion:PivotGridControl.PivotCalculations>
            </syncfusion:PivotGridControl>
        </Grid>

    For code-behind, refer to the following code sample.

  • C#
  • public partial class MainWindow: Window {
        PivotGridControl pivotGrid = new PivotGridControl();
        public MainWindow() {
            InitializeComponent();
            grid1.Children.Add(pivotGrid);
            pivotGrid.ItemSource = ProductSales.GetSalesData();
            PivotItem m_PivotItem = new PivotItem() {
                FieldHeader = "Product", FieldMappingName = "Product", TotalHeader = "Total"
            };
            PivotItem m_PivotItem1 = new PivotItem() {
                FieldHeader = "Date", FieldMappingName = "Date", TotalHeader = "Total"
            };
            PivotItem n_PivotItem = new PivotItem() {
                FieldHeader = "Country", FieldMappingName = "Country", TotalHeader = "Total"
            };
            PivotItem n_PivotItem1 = new PivotItem() {
                FieldHeader = "State", FieldMappingName = "State", TotalHeader = "Total"
            };
            // Adding PivotItem to PivotRows
            pivotGrid.PivotRows.Add(m_PivotItem);
            pivotGrid.PivotRows.Add(m_PivotItem1);
            // Adding PivotItem to PivotColumns
            pivotGrid.PivotColumns.Add(n_PivotItem);
            pivotGrid.PivotColumns.Add(n_PivotItem1);
            PivotComputationInfo m_PivotComputationInfo = new PivotComputationInfo() {
                CalculationName = "Amount", FieldName = "Amount", Format = "C", SummaryType = SummaryType.DoubleTotalSum
            };
            PivotComputationInfo m_PivotComputationInfo1 = new PivotComputationInfo() {
                CalculationName = "Quantity", FieldName = "Quantity", SummaryType = SummaryType.Count
            };
            pivotGrid.PivotCalculations.Add(m_PivotComputationInfo);
            pivotGrid.PivotCalculations.Add(m_PivotComputationInfo1);
    
            pivotGrid.SortOption = PivotSortOption.All;
        }
    }
    • The following screenshot shows the normal pivot grid.

      Pivot grid without sorting

    • The Quantity column has been sorted in the pivot grid.

      Sorting the quantity column in pivot grid

    • By pressing the Ctrl key, the Amount column is sorted. Now, the pivot grid is sorted by multiple columns.

      Sorting the amount column in pivot grid

    • Then, by pressing the Ctrl key again, you can the sort the pivot grid for ā€˜nā€™ number of columns.

      Sorting the n number of columns in pivot grid

    Multicolumn sorting in row pivots only mode

    You can enable the sorting through XAML or code-behind using the SortOption property of the pivot grid control in RowPivotsOnly mode.
    For XAML, refer to the following code sample.

  • XAML
  • <Grid>
            <syncfusion:PivotGridControl Name="pivotGrid" SortOption="All" RowPivotsOnly="True">
    
                <syncfusion:PivotGridControl.PivotRows>
                    <syncfusion:PivotItem AllowFilter="False" FieldHeader="PID" FieldMappingName="PID" TotalHeader="Total" />
                    <syncfusion:PivotItem AllowFilter="False" FieldHeader="Location" FieldMappingName="Location" TotalHeader="Total" />
                </syncfusion:PivotGridControl.PivotRows>
                <syncfusion:PivotGridControl.PivotCalculations>
                    <syncfusion:PivotComputationInfo FieldHeader="Color" FieldName="Color" Format="0.0" SummaryType="DoubleTotalSum" AllowSort="True" />
                    <syncfusion:PivotComputationInfo FieldHeader="Class" FieldName="Class" Format="0.0" SummaryType="DoubleTotalSum" AllowSort="True" />
                    <syncfusion:PivotComputationInfo FieldHeader="PID" FieldName="PID" Format="0.0" SummaryType="DoubleTotalSum" AllowSort="True" />
                    <syncfusion:PivotComputationInfo FieldHeader="Units" FieldName="Units" Format="0.0" SummaryType="DoubleTotalSum" AllowSort="True" />
                    <syncfusion:PivotComputationInfo FieldHeader="Retail" FieldName="Retail" Format="0.0" SummaryType="DoubleTotalSum" AllowSort="True" />
                    <syncfusion:PivotComputationInfo FieldHeader="Cost" FieldName="Cost" Format="0.0" SummaryType="DoubleTotalSum" AllowSort="True" />
                    <syncfusion:PivotComputationInfo FieldHeader="TestStr" FieldName="TestStr" Format="0.0" PadString="***" SummaryType="DisplayIfDiscreteValuesEqual" AllowSort="True" />
                    <syncfusion:PivotComputationInfo FieldHeader="TestInt" FieldName="TestInt" Format="0.0" PadString="***" SummaryType="DisplayIfDiscreteValuesEqual" AllowSort="True" />
                    <syncfusion:PivotComputationInfo FieldHeader="TestDouble" FieldName="TestDouble" Format="0.00" PadString="***" SummaryType="DisplayIfDiscreteValuesEqual" AllowSort="True" />
                </syncfusion:PivotGridControl.PivotCalculations>
    
            </syncfusion:PivotGridControl>
        </Grid>

    For code-behind, refer to the following code sample.

  • C#
  • public partial class MainWindow: Window {
        public MainWindow() {
            InitializeComponent();
            pivotGrid.SortOption = PivotSortOption.All;
        }
    }

    Similarly, you can perform ā€˜nā€™ number of sorting in RowPivotsOnly mode by pressing the Ctrl key.

    Multicolumn sorting in row pivots only mode

    NOTE

    You can refer to our WPF Pivot Grid feature tour page for its groundbreaking feature representations. You can also explore our WPF Pivot Grid example to knows how to organizes and summarizes business data and displays the result in a cross-table format.