Unplanned
Last Updated: 29 Jan 2026 15:17 by Niraj
Niraj
Created on: 29 Jan 2026 15:17
Category: PivotGrid
Type: Bug Report
0
PivotGrid rows field order in the table does not match the field order in the configurator

Description

The data order displayed in the PivotGrid does not follow the field order shown in the Rows configuration. Similar issue: #12989

Steps To Reproduce

  1. Run the example posted below:

  2. From the Fields list, check ContractNumber. It is added to the Columns section by default.

  3. Drag ContractNumber from Columns to the Rows section.

  4. Verify in the PivotGrid settings that the Rows area now shows:

    • Station
    • ContractNumber
      (in this order)
  5. View the data the table.

@using Telerik.Blazor.Components.PivotGrid

<TelerikButton OnClick="@OnRefresh">Refresh</TelerikButton>
<TelerikLoaderContainer Visible="@_isLoading" Text="Please wait..." />

<div class="pivot-main-container">
    <TelerikPivotGridContainer>
        <TelerikPivotGridConfiguratorButton></TelerikPivotGridConfiguratorButton>
        <TelerikPivotGridConfigurator></TelerikPivotGridConfigurator>
        <div class="pivot-grid-container">
            <TelerikPivotGrid Data="@PivotData" DataProviderType="@PivotGridDataProviderType.Local"
                              @ref="_PivotGridRef" ColumnHeadersWidth="100px" RowHeadersWidth="130px">
                <ColumnHeaderTemplate>
                    @{
                        var ctx = (PivotGridColumnHeaderTemplateContext)context;
                        int underscoreIndex = ctx.Text.IndexOf("-");
                        string text = ctx.Text;
                        if (underscoreIndex > 0)
                        {
                            text = text.Replace(text.Substring(0, underscoreIndex + 1), "");
                            <span>@text</span>
                        }
                        else
                        {
                            <span>@ctx.Text</span>
                        }
                    }
                </ColumnHeaderTemplate>

                <RowHeaderTemplate>
                    @{
                        var ctx = (PivotGridRowHeaderTemplateContext)context;
                        int underscoreIndex = ctx.Text.IndexOf("-");
                        if (underscoreIndex == 1)
                        {
                            string text = ctx.Text;
                            text = text.Replace(text.Substring(0, underscoreIndex + 1), "");
                            <span>@text</span>
                        }
                        else
                        {
                            <span>@ctx.Text</span>
                        }
                    }
                </RowHeaderTemplate>

                <DataCellTemplate Context="dataCellContext">
                    @{
                        var c = (PivotGridDataCellTemplateContext)dataCellContext;
                        string amt;

                        if (c.Value is AggregateException || c.Value?.GetType().Name == "AggregateError")
                        {
                            amt = "-";
                        }

                        else if (c.Value == null)
                        {
                            amt = (0m).ToString("C2");
                        }
                        else if (c.Value is IConvertible)
                        {
                            // Safe convert for numbers
                            amt = Convert.ToDecimal(c.Value).ToString("C2");
                        }
                        else
                        {
                            amt = c.Value?.ToString() ?? string.Empty;
                        }
                    }
                    <div style="text-align: right;">
                        @amt
                    </div>
                </DataCellTemplate>


                <PivotGridRows>
                    <PivotGridRow Name="@nameof(RptContractSalesSummaryModel.Station)" Title="Station" />
                </PivotGridRows>

                <PivotGridColumns>
                    <PivotGridColumn Name="@nameof(RptContractSalesSummaryModel.Year)" Title="Year" HeaderClass="year-header" />
                    <PivotGridColumn Name="@nameof(RptContractSalesSummaryModel.Month)" Title="Month" />
                </PivotGridColumns>

                <PivotGridMeasures>
                    <PivotGridMeasure Name="@nameof(RptContractSalesSummaryModel.Rate)" Title="Total"
                                      Aggregate="@PivotGridAggregateType.Sum" />
                </PivotGridMeasures>
            </TelerikPivotGrid>
        </div>
    </TelerikPivotGridContainer>
</div>


@code
{
    private List<RptContractSalesSummaryModel> PivotData { get; set; } = [];
    public TelerikNotification NotificationReference { get; set; } = default!;
    public TelerikPivotGrid<RptContractSalesSummaryModel> _PivotGridRef { get; set; } = default!;
    private CancellationTokenSource cancelToken = new CancellationTokenSource();
    private bool _isDisposed { get; set; } = default!;
    private bool _isLoading { get; set; } = default!;


    protected override async Task OnInitializedAsync()
    {
        await LoadReportData(cancelToken.Token);
        await base.OnInitializedAsync();
    }

    private async Task LoadReportData(CancellationToken token)
    {
        _isLoading = true;
        await Task.Delay(1000);

        var dataItemCount = 10000;
        var stationCount = 30;
        var rnd = Random.Shared;

        for (int i = 1; i <= dataItemCount; i++)
        {
            var stationNumber = rnd.Next(1, stationCount);
            if (token.IsCancellationRequested || _isDisposed) { return; }
            ;
            PivotData.Add(new RptContractSalesSummaryModel()
            {
                Station = $"Station {stationNumber}",
                ContractMonth = DateTime.Today.AddMonths(-rnd.Next(0, 13)),
                Rate = rnd.Next(123, 987) * 1.23m,
                ContractNumber = i,
                InternetOrderID = i * 10
            });
        }

        PivotData = PivotData
                        .OrderBy(x => x.Station)
                        .ThenBy(x => x.Year)
                        .ThenBy(x => x.Month).ToList();

        if (_PivotGridRef != null && !_isDisposed)
        {
            _PivotGridRef?.Rebind();
        }

        _isLoading = false;
    }

    public async Task OnRefresh()
    {
        await LoadReportData(cancelToken.Token);
        await Task.CompletedTask;
    }

    public async ValueTask DisposeAsync()
    {
        PivotData = [];
        await Task.CompletedTask;
    }

    public class RptContractSalesSummaryModel
    {
        public DateTime ContractMonth { get; set; }
        public int Year => ContractMonth.Year;
        public string Month => $"{MapMonthToLetter(ContractMonth.Month)}-{ContractMonth:MMMM}";
        public string Station { get; set; } = string.Empty;
        public string? SalesPerson { get; set; }
        public string? AdvertiserName { get; set; }
        public string? AgencyName { get; set; }
        public string? Product_Description { get; set; }
        public string? Brand { get; set; }
        public string AccountType1 { get; set; } = string.Empty;
        public string AccountType2 { get; set; } = string.Empty;
        public decimal? Rate { get; set; }
        //public int? RptUserKey { get; set; }
        public string? Demographics { get; set; }
        public string? OrderType { get; set; }
        public string? SalesOffice { get; set; }
        public int? ContractNumber { get; set; }
        public string? SectionLevel { get; set; }
        public string? AgencyGroup { get; set; }
        public string? AdvertiserGroup { get; set; }
        public string? ProductGroup { get; set; }
        public string? LineNumber { get; set; }
        public string? RevenueClassDescription { get; set; }
        public string? InternetIntegrationType { get; set; }
        public string? LineType { get; set; }
        public string? RateType { get; set; }
        public string? InternetAdType { get; set; }
        public string? InternetSubAdType { get; set; }
        public DateTime? LineStartDate { get; set; }
        public DateTime? LineEndDate { get; set; }
        public long? InternetOrderID { get; set; }
        public DateTime? InitialDelivery { get; set; }
        public string? QuantityType { get; set; }
        public long? QuantityOrdered { get; set; }
        public long? ImpressionsDelivered { get; set; }
        public long? ClicksDelivered { get; set; }
        public long? Goal { get; set; }
        public string? Limit { get; set; }
        public string? BillingType { get; set; }
        public decimal? DeliveredRevenue { get; set; }
        public string? PerformanceStatus { get; set; }
        public DateTime? LastSuccessfulJobRun { get; set; }
        public string? InternetEnvironment { get; set; }
        public string? UserField1 { get; set; }
        public string? ExternalID { get; set; }

        // to sort the months correctly in the pivot grid
        private static string MapMonthToLetter(int month)
        {
            return month switch
            {
                1 => "A",
                2 => "B",
                3 => "C",
                4 => "D",
                5 => "E",
                6 => "F",
                7 => "G",
                8 => "H",
                9 => "I",
                10 => "J",
                11 => "K",
                12 => "L",
                _ => "?"
            };
        }
    }
}

Actual Behavior

The data order displayed in the PivotGrid does not follow the field order shown in the Rows configuration.

Image

Expected Behavior

The rendered PivotGrid data should strictly follow the order of fields as defined in the Rows (or Columns) area settings.

Browser

All

Last working version of Telerik UI for Blazor (if regression)

No response

0 comments