Search results

Customizing loading indicator in Blazor Pivot Table component

22 Jul 2021 / 1 minute to read

You can customize the appearance of the loading indicator in the pivot table by using the SpinnerTemplate property. This property accepts an HTML string which can be used for appearance customization.

You can also disable the loading indicator by setting SpinnerTemplate to empty string.

Copied to clipboard
    @using Syncfusion.Blazor.PivotView

    <SfPivotView TValue="ProductDetails" SpinnerTemplate="<i class='fa fa-cog fa-spin fa-3x fa-fw'></i>">
        <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="Units Sold"></PivotViewValue>
                <PivotViewValue Name="Amount" Caption="Sold Amount"></PivotViewValue>
            </PivotViewValues>
            <PivotViewFormatSettings>
                <PivotViewFormatSetting Name="Sold" Format="N"></PivotViewFormatSetting>
                <PivotViewFormatSetting Name="Amount" Format="C"></PivotViewFormatSetting>
            </PivotViewFormatSettings>
        </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.
        }
    }

You can refer to our Blazor Pivot Table feature tour page for its groundbreaking feature representations. You can also explore our Blazor Pivot Table example to knows how to render and configure the pivot table.