New to Kendo UI for jQuery? Download free 30-day trial

Set Grid Auto Width When Exporting to Excel

Environment

Product Progress® Kendo UI® Grid for jQuery

Description

When I try to export the Grid to Excel, the data is not wrapped.

How can I auto-fit the Grid data in the exported Excel?

Solution

Set the column width of the Kendo UI Workbook to autoWidth by adding a handler to the excelexport event of the Grid. Loop over the columns and set autoWidth to true.

excelExport: function(e) {
  var columns = e.workbook.sheets[0].columns;
  columns.forEach(function(column){
    // also delete the width if it is set
    delete column.width;
    column.autoWidth = true;
  });
}
    <div id="grid"></div>
    <script>
    $("#grid").kendoGrid({
      toolbar: ["excel"],
      columns: [
        { field: "name", width:20 }
      ],
      dataSource: [
        { name: "doloremque velit iure dolore"},
        { name: "Lorem ipsum dolor sit amet"}
      ],
      excelExport: function(e) {
        var columns = e.workbook.sheets[0].columns;
        columns.forEach(function(column){
          delete column.width;
          column.autoWidth = true;
        });
      }
    });
    var grid = $("#grid").data("kendoGrid");
    grid.saveAsExcel();
    </script>
In this article