New to Telerik UI for ASP.NET MVC? Download free 30-day trial

Server Export

The Telerik UI Grid for ASP.NET MVC exposes the functionality to export its data to XLSX (Excel) and CSV on the Server. This approach is recommended when the data is large and resource demanding. It escapes the need to serialize the whole dataset and to create the file on the Client. When Server-side export it used, the file is created on the Server and is pushed to the Client as a File object.

For a runnable example, refer to the demo on Server export by the Grid.

Getting Started

To enable the Server export option of the grid:

  1. Include a reference to the Kendo.Mvc.Export.dll and Telerik.Documents.SpreadsheetStreaming.dll dlls available in the product's installation folder - ~installationFolder\export\binaries\net<version>.
  2. Include a form HTML element that would post to an ActionMethod on the server-side.

    
        <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="submit" class="k-button download" data-format="xlsx" data-title="Title1" value="Export to XLSX" />
            <input type="submit" class="k-button download" data-format="csv" data-title="Title2" value="Export to CSV" />
        </form>
    
    
  3. Attach the click event handler to the buttons in the form and include the data and the settings of the columns:

    
        <script>
            $(document).on("kendoReady", 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)));
                });
            });
        </script>
    
    
  4. Create the File on the server-side and push it to the client:

    
        public FileStreamResult ExportServer(string model, string data)
        {
            var columnsData = JsonConvert.DeserializeObject<IList<ExportColumnSettings>>(HttpUtility.UrlDecode(model));
            dynamic options = JsonConvert.DeserializeObject(HttpUtility.UrlDecode(data));
            SpreadDocumentFormat exportFormat = options.format.ToString() == "csv" ? exportFormat = SpreadDocumentFormat.Csv : exportFormat = SpreadDocumentFormat.Xlsx;
            Action<ExportCellStyle> cellStyle = new Action<ExportCellStyle>(ChangeCellStyle);
            Action<ExportRowStyle> rowStyle = new Action<ExportRowStyle>(ChangeRowStyle);
            Action<ExportColumnStyle> columnStyle = new Action<ExportColumnStyle>(ChangeColumnStyle);
    
            string fileName = string.Format("{0}.{1}", options.title, options.format);
            string mimeType = Helpers.GetMimeType(exportFormat);
    
            Stream exportStream = exportFormat == SpreadDocumentFormat.Xlsx ?
                productService.Read().ToXlsxStream(columnsData, (string)options.title.ToString(), cellStyleAction: cellStyle, rowStyleAction: rowStyle, columnStyleAction: columnStyle) :
                productService.Read().ToCsvStream(columnsData);
    
            var fileStreamResult = new FileStreamResult(exportStream, mimeType);
            fileStreamResult.FileDownloadName = fileName;
            fileStreamResult.FileStream.Seek(0, SeekOrigin.Begin);
    
            return fileStreamResult;
        }
    
        private void ChangeCellStyle(ExportCellStyle e)
        {
            bool isHeader = e.Row == 0;
            SpreadCellFormat format = new SpreadCellFormat
            {
                ForeColor = isHeader ? SpreadThemableColor.FromRgb(50, 54, 58) : SpreadThemableColor.FromRgb(214, 214, 217),
                IsItalic = true,
                VerticalAlignment = SpreadVerticalAlignment.Center,
                WrapText = true,
                Fill = SpreadPatternFill.CreateSolidFill(isHeader ? new SpreadColor(93, 227, 0) : new SpreadColor(50, 54, 58))
            };
            e.Cell.SetFormat(format);
        }
    
        private void ChangeRowStyle(ExportRowStyle e)
        {
            e.Row.SetHeightInPixels(e.Index == 0 ? 80 : 30);
        }
    
        private void ChangeColumnStyle(ExportColumnStyle e)
        {
            double width = e.Name == "Product name" || e.Name == "Category Name" ? 250 : 100;
            e.Column.SetWidthInPixels(width);
        }
    
    
  5. Add the following references in the Controller file:

        using Kendo.Mvc.Export;
        using Telerik.Documents.SpreadsheetStreaming;
    

See Also

In this article