Skip to content

962647- Update the Excel Export Sample and Value sorting Sample with Description. #6100

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 3 commits into
base: development
Choose a base branch
from
Open

962647- Update the Excel Export Sample and Value sorting Sample with Description. #6100

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
2bc6821
962647- Update the Excel Export Sample and Value sorting Sample with …
DeebigaSF4971 Jun 9, 2025
52aecc4
952647: Modify the Review changes
DeebigaSF4971 Jun 10, 2025
492b9bc
962647: Add the review changes
DeebigaSF4971 Jun 11, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
119 changes: 100 additions & 19 deletions blazor/pivot-table/excel-export.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,14 @@ documentation: ug

# Excel export in Blazor Pivot Table component

The Excel export allows Pivot Table data to be exported as Excel document. To enable Excel export in the pivot table, set the [AllowExcelExport](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.SfPivotView-1.html#Syncfusion_Blazor_PivotView_SfPivotView_1_AllowExcelExport) property in [SfPivotView](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.SfPivotView-1.html) class to **true**. Once the API is set, user needs to call the [ExportToExcelAsync](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.SfPivotView-1.html#Syncfusion_Blazor_PivotView_SfPivotView_1_ExcelExport_System_Object_System_Nullable_System_Boolean__System_Object_System_Nullable_System_Boolean__) method for exporting on external button click.
The Excel export allows Pivot Table data to be exported as Excel document. To enable Excel export in the pivot table, set the [AllowExcelExport](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.SfPivotView-1.html#Syncfusion_Blazor_PivotView_SfPivotView_1_AllowExcelExport) property in [SfPivotView](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.SfPivotView-1.html) class to **true**. Once the API is set, user needs to call the [ExportToExcelAsync](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.SfPivotView-1.html#Syncfusion_Blazor_PivotView_SfPivotView_1_ExcelExport_System_Object_System_Nullable_System_Boolean__System_Object_System_Nullable_System_Boolean__) method for exporting on external button click.

This method accepts a boolean parameter, **"asMemoryStream"**, which determines the export behavior:

* **false:** Downloads the Excel file directly.
* **true:** Returns the file as a memory stream for custom processing, storage, or manipulation.

In this example, false is used to initiate a direct download.

N> The pivot table component can be exported to Excel format using options available in the toolbar. For more details [refer](./tool-bar) here.

Expand Down Expand Up @@ -43,12 +50,12 @@ N> The pivot table component can be exported to Excel format using options avail
public List<ProductDetails> Data { get; set; }
protected override void OnInitialized()
{
this.data = ProductDetails.GetProductData().ToList();
this.Data = ProductDetails.GetProductData().ToList();
//Bind the data source collection here. Refer "Assigning sample data to the pivot table" section in getting started for more details.
}

public void OnExcelExport(Microsoft.AspNetCore.Components.Web.MouseEventArgs args){
this.pivot.ExportToExcelAsync();
this.pivot.ExportToExcelAsync(false);
}
}
```
Expand Down Expand Up @@ -91,7 +98,7 @@ N> By default, material theme will be applied to the pivot table during Excel ex
public List<ProductDetails> Data { get; set; }
protected override void OnInitialized()
{
this.data = ProductDetails.GetProductData().ToList();
this.Data = ProductDetails.GetProductData().ToList();
//Bind the data source collection here. Refer "Assigning sample data to the pivot table" section in getting started for more details.
}

Expand Down Expand Up @@ -223,7 +230,7 @@ The Excel export provides an option to change file name of the document before e
public List<ProductDetails> Data { get; set; }
protected override void OnInitialized()
{
this.data = ProductDetails.GetProductData().ToList();
this.Data = ProductDetails.GetProductData().ToList();
//Bind the data source collection here. Refer "Assigning sample data to the pivot table" section in getting started for more details.
}

Expand All @@ -246,7 +253,14 @@ By default, Microsoft Excel supports only 1,048,576 records in an Excel sheet. H

## CSV Export

The Excel export allows pivot table data to be exported in **CSV** file format as well. To enable CSV export in the pivot table, set the [AllowExcelExport](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.SfPivotView-1.html#Syncfusion_Blazor_PivotView_SfPivotView_1_AllowExcelExport) property in [SfPivotView](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.SfPivotView-1.html) class as **true**. Once the API is set, user needs to call the [ExportToCsvAsync](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.SfPivotView-1.html#Syncfusion_Blazor_PivotView_SfPivotView_1_CsvExport_System_Object_System_Nullable_System_Boolean__System_Object_System_Nullable_System_Boolean__) method for exporting on external button click.
The Excel export allows pivot table data to be exported in **CSV** file format as well. To enable CSV export in the pivot table, set the [AllowExcelExport](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.SfPivotView-1.html#Syncfusion_Blazor_PivotView_SfPivotView_1_AllowExcelExport) property in [SfPivotView](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.SfPivotView-1.html) class as **true**. Once the API is set, user needs to call the [ExportToCsvAsync](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.SfPivotView-1.html#Syncfusion_Blazor_PivotView_SfPivotView_1_CsvExport_System_Object_System_Nullable_System_Boolean__System_Object_System_Nullable_System_Boolean__) method for exporting on external button click.

This method accepts a boolean parameter, **"asMemoryStream"**, which determines the export behavior:

* **false:** Downloads the Excel file directly.
* **true:** Returns the file as a memory stream for custom processing, storage, or manipulation.

In this example, false is used to initiate a direct download.

N> The pivot table component can be exported to CSV format using options available in the toolbar. For more details [refer](./tool-bar) here.

Expand Down Expand Up @@ -278,14 +292,14 @@ N> The pivot table component can be exported to CSV format using options availab
@code{
SfPivotView<ProductDetails> pivot;
public List<ProductDetails> Data { get; set; }
protected override void OnInitialized(Microsoft.AspNetCore.Components.Web.MouseEventArgs args)
protected override void OnInitialized()
{
this.data = ProductDetails.GetProductData().ToList();
this.Data = ProductDetails.GetProductData().ToList();
//Bind the data source collection here. Refer "Assigning sample data to the pivot table" section in getting started for more details.
}

public void OnCsvExport() {
this.pivot.ExportToCsvAsync();
this.pivot.ExportToCsvAsync(false);
}
}

Expand Down Expand Up @@ -332,6 +346,73 @@ When the [EnableVirtualization](https://help.syncfusion.com/cr/blazor/Syncfusion
};
}
```

## Saving Excel document to stream

Rather than exporting the Pivot Table as a downloadable file, the user can save the Excel document as a memory stream. This is achieved by setting the **asMemoryStream** parameter to **true** in the [ExportToExcelAsync](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.SfPivotView-1.html#Syncfusion_Blazor_PivotView_SfPivotView_1_ExcelExport_System_Object_System_Nullable_System_Boolean__System_Object_System_Nullable_System_Boolean__) method. The resulting memory stream can then be further processed and customized by the user before being exported as a document.

N> This option is only available if virtualization is enabled in the pivot table.

```cshtml
@using Syncfusion.Blazor.PivotView
@using Syncfusion.Blazor.Buttons
@using Syncfusion.Blazor
@inject IJSRuntime JSRuntime

<SfButton OnClick="OnExcelExport" Content="Excel Export"></SfButton>
<SfPivotView TValue="ProductDetails" @ref="@pivot" AllowExcelExport="true" ShowValuesButton="true" EnableVirtualization="true">
<PivotViewDataSourceSettings DataSource="@Data" EnableSorting=true>
<PivotViewColumns>
<PivotViewColumn Name="Year"></PivotViewColumn>
<PivotViewColumn Name="Quarter"></PivotViewColumn>
</PivotViewColumns>
<PivotViewRows>
<PivotViewRow Name="Country"></PivotViewRow>
<PivotViewRow Name="Products"></PivotViewRow>
</PivotViewRows>
<PivotViewValues>
<PivotViewValue Name="Sold" Caption="Units Sold"></PivotViewValue>
<PivotViewValue Name="Amount" Caption="Sold Amount"></PivotViewValue>
</PivotViewValues>
<PivotViewFormatSettings>
<PivotViewFormatSetting Name="Amount" Format="C0" UseGrouping=true></PivotViewFormatSetting>
</PivotViewFormatSettings>
</PivotViewDataSourceSettings>
</SfPivotView>

<script type="text/javascript">
function saveAsFile(filename, bytesBase64) {
var link = document.createElement('a');
link.download = filename;
link.href = "data:application/octet-stream;base64," + bytesBase64;
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
}
</script>

@code {
private SfPivotView<ProductDetails> pivot;
private List<ProductDetails> Data { get; set; }
protected override void OnInitialized()
{
this.Data = ProductDetails.GetProductData().ToList();
//Bind the data source collection here. Refer "Assigning sample data to the pivot table" section in getting started for more details.
}
private async Task OnPdfExport(Microsoft.AspNetCore.Components.Web.MouseEventArgs args)
{
System.IO.MemoryStream memoryStream = new System.IO.MemoryStream();
//Excel document as a memory stream by setting the first parameter as "true" in the "ExportToExcelAsync" method.
memoryStream = await this.pivot.ExportToExcelAsync(true);
// You can then process the memory stream based on your needs and save it as mentioned in the last statement.
......
......
......
await JSRuntime.InvokeVoidAsync("saveAsFile", new object[] { "default.xlsx", Convert.ToBase64String(memoryStream.ToArray()),true });
}
}
```

## Events

### ExcelQueryCellInfo
Expand Down Expand Up @@ -377,24 +458,24 @@ The event [ExcelQueryCellInfo](https://help.syncfusion.com/cr/blazor/Syncfusion.
private SfPivotView<ProductDetails> pivot;
public List<ProductDetails> Data { get; set; }

protected override void OnInitialized(Microsoft.AspNetCore.Components.Web.MouseEventArgs args)
protected override void OnInitialized()
{
this.data = ProductDetails.GetProductData().ToList();
this.Data = ProductDetails.GetProductData().ToList();
// Bind the data source collection here. Refer "Assigning sample data to the pivot table" section in getting started for more details.
}

public void OnExcelExport(Microsoft.AspNetCore.Components.Web.MouseEventArgs args)
{
this.pivot.ExportToExcelAsync();
this.pivot.ExportToExcelAsync(false);
}

// Triggers every time for row header and value cells during exporting.
public void ExcelQueryEvent(ExcelQueryCellInfoEventArgs<ProductDetails> args)
{
Matrix<Matrix<AxisSet>> pivotValues = Pivot?.PivotValues;
Matrix<Matrix<AxisSet>> pivotValues = pivot?.PivotValues;
AxisSet cellInfo = null;

if (Pivot?.EnableVirtualization == true)
if (pivot?.EnableVirtualization == true)
{
if (pivotValues != null)
{
Expand Down Expand Up @@ -468,24 +549,24 @@ The event [ExcelHeaderQueryCellInfo](https://help.syncfusion.com/cr/blazor/Syncf
private SfPivotView<ProductDetails> pivot;
public List<ProductDetails> Data { get; set; }

protected override void OnInitialized(Microsoft.AspNetCore.Components.Web.MouseEventArgs args)
protected override void OnInitialized()
{
this.data = ProductDetails.GetProductData().ToList();
this.Data = ProductDetails.GetProductData().ToList();
// Bind the data source collection here. Refer "Assigning sample data to the pivot table" section in getting started for more details.
}

public void OnExcelExport(Microsoft.AspNetCore.Components.Web.MouseEventArgs args)
{
this.pivot.ExportToExcelAsync();
this.pivot.ExportToExcelAsync(false);
}

// Triggers every time for column header cells during exporting
public void ExcelHeaderEvent(ExcelHeaderQueryCellInfoEventArgs args)
{
Matrix<Matrix<AxisSet>> pivotValues = Pivot?.PivotValues;
Matrix<Matrix<AxisSet>> pivotValues = pivot?.PivotValues;
AxisSet cellInfo = null;

if (Pivot?.EnableVirtualization == true)
if (pivot?.EnableVirtualization == true)
{
if (pivotValues != null)
{
Expand Down
47 changes: 47 additions & 0 deletions blazor/pivot-table/sorting.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -163,6 +163,53 @@ N> Value fields are set to the column axis by default. In such cases, the value

![Value Sorting in Blazor PivotTable](images/blazor-pivottable-value-sorting.png)

### Multiple Axis Sorting

Users can apply value sorting to both row and column axes simultaneously for more dynamic and precise data analysis. The following settings are used to configure sorting:

* [ColumnHeaderText](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.PivotViewValueSortSettings.html#Syncfusion_Blazor_PivotView_PivotViewValueSortSettings_ColumnHeaderText): Specifies the column header hierarchy for value sorting. Header levels are defined from Level 1 to N using a delimiter for clarity.
* [HeaderDelimiter](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.PivotViewValueSortSettings.html#Syncfusion_Blazor_PivotView_PivotViewValueSortSettings_HeaderDelimiter): It allows to set the delimiters string to separate the header text between levels.
* [ColumnSortOrder](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.PivotViewValueSortSettings.html#Syncfusion_Blazor_PivotView_PivotViewValueSortSettings_ColumnSortOrder): Sets the delimiter string used to separate levels in the column header text.
* [RowHeaderText](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.PivotViewValueSortSettings.html#Syncfusion_Blazor_PivotView_PivotViewValueSortSettings_RowHeaderText): Defines the specific row header for which the value sorting should be applied.
* [RowSortOrder](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.PivotView.PivotViewValueSortSettings.html#Syncfusion_Blazor_PivotView_PivotViewValueSortSettings_RowSortOrder): Determines the sorting direction for the specified row header.

N> This feature is applicable only to relational data sources.

```cshtml
@using Syncfusion.Blazor.PivotView

<SfPivotView TValue="ProductDetails" EnableValueSorting="true">
 <PivotViewDataSourceSettings DataSource="@data">
        <PivotViewColumns>
            <PivotViewColumn Name="Year"></PivotViewColumn>
            <PivotViewColumn Name="Quarter"></PivotViewColumn>
        </PivotViewColumns>
        <PivotViewRows>
            <PivotViewRow Name="Country"></PivotViewRow>
            <PivotViewRow Name="Products"></PivotViewRow>
        </PivotViewRows>
        <PivotViewValues>
<PivotViewValue Name="Sold" Caption="Unit Sold"></PivotViewValue>
            <PivotViewValue Name="Amount" Caption="Sold Amount"></PivotViewValue>
        </PivotViewValues>
        <PivotViewFormatSettings>
            <PivotViewFormatSetting Name="Amount" Format="C"></PivotViewFormatSetting>
        </PivotViewFormatSettings>
<PivotViewValueSortSettings ColumnHeaderText="FY 2015##Unit Sold" HeaderDelimiter="##" ColumnSortOrder="Sorting.Descending" RowHeaderText="France" RowSortOrder="Sorting.Ascending"></PivotViewValueSortSettings>
    </PivotViewDataSourceSettings>
</SfPivotView>

@code{
public List<ProductDetails> data { get; set; }
protected override void OnInitialized()
{
this.data = ProductDetails.GetProductData().ToList();
//Bind the data source collection here. Refer "Assigning sample data to the pivot table" section in getting started for more details.
}
}

```

## Events
### OnActionBegin

Expand Down