How to customize the field drop axis in a Blazor Pivot Table?

Introduction

By default, when you select a field using the checkbox selection in the field list, it will be automatically added to the value axis if the field is of the number type. Otherwise, it will be added to the row axis. However, in certain scenarios where this default behavior does not meet your requirements, you need to customize the drop axis for certain fields. This article explains how to customize the field drop axis in a Blazor Pivot Table.

Customize the field drop axis

To customize the field drop axis, you need to use the FieldDrop event. This event is triggered whenever a field is dropped onto an axis, enabling you to programmatically modify the field drop axis.

Here is a code example that shows how to modify the drop axis for a specific field when it is selected in the field list:

[Index.razor]

<SfPivotView @ref="Pivot" TValue="ProductDetails" ShowFieldList="true">
    <PivotViewEvents TValue="ProductDetails" FieldDrop="FieldDrop"></PivotViewEvents>
</SfPivotView>

@code {
    public void FieldDrop(FieldDropEventArgs args)
    {
        if (args.DraggedAxis == "fieldlist" && args.FieldName == "Year")
        {
            args.DropAxis = "Columns";
        }
    }
}

In the above code example, when the “Year” field is selected from the field list, we change its drop axis to column. This means that the field will be placed on the column axis of the pivot table instead of the row axis.

The following GIF image, which portrays the results of the code snippet mentioned above,

GIF

You can refer to this GitHub sample for a practical demonstration of this code.

Conclusion

I hope you enjoyed learning how to apply custom styles to customize the field drop axis in a Blazor Pivot Table.

You can also refer to our Blazor Pivot Table feature tour page to learn about its other groundbreaking feature representations and documentation, and how to quickly get started for configuration specifications. You can also explore our Blazor Pivot Table example to understand how to create and manipulate data.

For current customers, you can check out our components on the License and Downloads page. If you are new to Syncfusion, you can try our 30-day free trial to check out our other controls.

If you have any queries or require clarifications, please let us know in the comments section below. You can also contact us through our support forums, support portal, or feedback portal. We are always happy to assist you!