Kendo UI Grid - Preserve Grouping/Filtering With Server Export

1 Answer 114 Views
Grid
Peter
Top achievements
Rank 1
Peter asked on 27 Aug 2024, 09:00 PM | edited on 29 Aug 2024, 02:47 PM

I have a Kendo UI Grid that is being used to filter, group, and display aggregates. This data is then exported to Excel via the toolbar. It works very well and we like the way that the default Export looks.

However the number of rows can be quite large, in some cases climbing above 150,000. This causes the page to become unresponsive, but only with grouping (sometimes two groups can be nested) and aggregates involved. If the columns are not grouped then the performance is acceptable.

Is there a way to improve the performance of the Excel export when it is using group headers and aggregates? 

We would like to avoid using the server-side export as an alternative because the export's appearance can vary based on the user's interaction with the grid and will be unpredictable unless the grid options can somehow be parsed at the controller and be used to build the Excel sheet the way it does on the client side.

 


1 Answer, 1 is accepted

Sort by
0
Mihaela
Telerik team
answered on 30 Aug 2024, 04:05 PM

Hello Peter,

I took notice of the fact that currently there is no license associated with your account. This inevitably limits our support service. Thus, my personal advice here would be to take a look at the following Support Plans. In case you want to see what each of the tiers brings to the table:

I would personally like to address your inquiry, regardless.

To improve the performance of the Excel export, I would recommend trying any of the following options:

  • If the AllPages() option as enabled, the Grid requests all data from the server, which may lead to unresponsive browser page. Disabling the AllPages() option will definitely improve the overall performance.
  • Optimize the Read Action of the Grid. For example, pass the data as an IQueryable to the ToDataSourceResult() method.
  • Configure the Grid to for virtual scrolling. This way, the Grid will export only the data that is currently visible.
  • Switch to server-side Export - you can pass the Grid's options to the server, as demonstrated in the online demo:
<form action="@Url.Action("ExportServer", "Grid")" method="POST">
    <input type="hidden" id="export-data" name="data" />
    <input type="hidden" id="export-model" name="model" />
    <input type="hidden" id="export-settings" name="settings" />
    <input type="submit" class="k-button k-button-solid-primary k-button-solid k-button-md k-rounded-md download" data-format="xlsx" data-title="Title1" value="Export to XLSX" />
    <input type="submit" class="k-button k-button-solid-primary k-button-solid k-button-md k-rounded-md download" data-format="csv" data-title="Title2" value="Export to CSV" />
</form>

<script>
    $(document).ready( function () {
        $(".download").click(function () {
            var grid = $("#Grid").data("kendoGrid");
            var options = {
                format: $(this).data("format"),
                title: "DemoSheet"
            }
            $("#export-data").val(encodeURIComponent(JSON.stringify(options)));
            $("#export-model").val(encodeURIComponent(JSON.stringify(grid.columns)));
            $("#export-settings").val(encodeURIComponent(JSON.stringify(grid.options)));
        });
    });
</script>

I hope any of these suggestions will help you to improve the performance of the Excel export.

 

Regards,
Mihaela
Progress Telerik

Do you have a stake in the designеr-developer collaboration process? If so, take our survey to share your perspective and become part of this global research. You’ll be among the first to know once the results are out.
-> Start The State of Designer-Developer Collaboration Survey 2024

Tags
Grid
Asked by
Peter
Top achievements
Rank 1
Answers by
Mihaela
Telerik team
Share this question
or