Excel export sheet name and second sheet

1 Answer 69 Views
DataSource wrappers (package)
Top achievements
Rank 1
Malte asked on 20 Sep 2021, 01:27 PM | edited on 20 Sep 2021, 01:27 PM
I use the `kendo-vue-excel-export` in VUE to generate an Excel export.
Now I have two questions:

1. How to change the sheet name?
2. How to create a second sheet with different data?

My method that I use currently looks like this:

    exportExcel () {
        data: this.items,
        fileName: "Geräte",
        columns: [
          { field: 'hostname', title: 'Hostname' },
          { field: 'guid', title: 'Guid' },
          { field: 'ipaddress', title: 'IP' },
          { field: 'domain', title: 'Domain' },
          { field: 'osversion', title: 'OS Version' },
          { field: 'ostype', title: 'OS Type' },
          { field: 'videoid', title: 'Grafikkarte' },
          { field: 'diskid', title: 'Festplatte' },
          { field: 'memory', title: 'Arbeitsspeicher' },
          { field: 'cpuid', title: 'CPU' },
          { field: 'username', title: 'Benutzer' },
          { field: 'location', title: 'Lokation' },
          { field: 'office', title: 'Büro' }

1 Answer, 1 is accepted

Sort by
Telerik team
answered on 21 Sep 2021, 01:48 PM

Hi Malte,

Here is a StackBlitz example demonstrating how the targeted functionality can be achieved. 

To set the fileName of the exported file, you can pass the name to the fileName prop in the below method:

exportExcel() {
    data: products,
    fileName: 'myCustomFile',
    columns: this.columns,

To add a second sheet you should at first define it. In the linked example the data property sheet2Data holds the new sheet definition. To add the new definition to the exported file, you have to push it in the options of the exported file. Below is how the desired functionality is implemented in the linked above example:

customSaveExcel: function (exportOptions) {
  const saveFn = (dataURL) => {
    saveAs(dataURL, exportOptions.fileName);

  const options = workbookOptions(exportOptions);
  const rows = options.sheets[0].rows;

  let altIdx = 0;
  rows.forEach((row) => {
    if (row.type === 'data') {
      if (altIdx % 2 !== 0) {
        row.cells.forEach((cell) => {
          cell.background = '#aabbcc';

I hope the provided solution will help you implement what you need in your application.

Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

DataSource wrappers (package)
Asked by
Top achievements
Rank 1
Answers by
Telerik team
Share this question