Show hidden columns in Kendo grid excel export

前端 未结 3 521
清歌不尽
清歌不尽 2021-01-19 19:19

I have a kendo grid and I can export its data into excel file without any problem. In my grid, some columns may be hidden because they do not have any value. However, I want

相关标签:
3条回答
  • 2021-01-19 19:46

    I was looking to achieve a similar thing and used the answer provided by @Ankur with slight modification as I needed to hide the columns again after the export.

    Code as follows:

    excelExport(e) {
                    Spa.startLoading(); // loading overlay to hide the columns showing then hiding again
                    var columns = e.sender.columns;
                    var hiddenColumnNumbers = [];
                    if (!exportFlag) {
                        for (let i = 0; i < columns.length; i++) {
                            if (columns[i].hidden) {
                                e.sender.showColumn(i);
                                hiddenColumnNumbers.push(i);
                            }
                        }
                        e.preventDefault();
                        exportFlag = true;
                        setTimeout(() => {
                            e.sender.saveAsExcel();
                            for (let j = 0; j < columns.length; j++) {
                                if (hiddenColumnNumbers.indexOf(j) > -1) {
                                    e.sender.hideColumn(j);
                                }
                            }
                            Spa.stopLoading(); // hide loading overlay
                        });
                    } else {
                        for (let k = 0; k < columns.length; k++) {
                            if (columns[k].hidden)
                                e.sender.hideColumn(k);
                        }
                        exportFlag = false;
                        Spa.stopLoading(); // hide loading overlay
                    }
                },
    
    0 讨论(0)
  • 2021-01-19 20:04

    You can add some javascript to control this.

    var exportFlag = true;
    
    $("#gridName").data("kendoGrid").bind("excelExport", function (e) {
        if (exportFlag) {
            e.sender.showColumn("hiddenColumnName");
            e.preventDefault();
            exportFlag = false;
            e.sender.saveAsExcel();
        } else {
            e.sender.hideColumn("hiddenColumnName");
            exportFlag = true;
        }
    });
    

    Basically this catches the excelExport event when you click the Export button and shows the hidden column in your grid before it fires the saveAsExcel() function which saves your document. Then it hides the column again.

    Here is an Example you can test with.

    0 讨论(0)
  • 2021-01-19 20:07

    You can have columns in an array which defines hidden: true and then simply traverse through columns array and show/hide columns just before export as following:

            function excelExport(e) {
                  if (!exportFlag) {
                      for(var i=0; i < columns.length; i++) {
                          if(columns[i].hidden)
                              e.sender.showColumn(i);
                      }
                      e.preventDefault();
                      exportFlag = true;
                      setTimeout(function () {
                        e.sender.saveAsExcel();
                      });
                    } else {
                        for(var i=0; i < columns.length; i++) {
                              if(columns[i].hidden)
                                  e.sender.hideColumn(i);
                          }
                      exportFlag = false;
                    }
          }
    
    0 讨论(0)
提交回复
热议问题