如何自定义Kendo Grid导出文件名

时间:2017-05-23 20:09:10

标签: c# asp.net-mvc excel kendo-ui kendo-grid

我想知道如何使用当前页面名称和“导出列表”自定义Kendo Grid的Excel导出文件名。

我的按钮:

$("#btnExcelExport").kendoButton({
    click: function () {
        var grid = $("#progContactsTable").data("kendoGrid");
        grid.saveAsExcel();             
    }
});

网格:

excel: {
    text: '',
    imageClass: 'icon-excel',
    allPages: true,
    fileName: "Export.xlsx",     // I would like this to be based on the page I am on,
                                 // such as "Test-1-Export List.xls"
    filterable: false
},

1 个答案:

答案 0 :(得分:1)

如何使用click结合kendo.ooxml.Workbook手动触发按钮kendo.saveAs上的Excel导出?

我编写了一个Kendo Dojo示例。如果这是你需要的,请告诉我。此外,如果您需要检索屏幕名称,还有一些如何执行此操作的示例here

修改

下面是按下“单击以导出”按钮时Dojo示例生成的导出示例。请注意,标题是自定义的。

Sample export with custom title

不确定为什么这对您不起作用,但请使用您的代码尝试以下示例,看看会发生什么。基本上,您可以连接自定义函数来处理导出按钮单击,如下所示:

$("#exportButton").kendoButton({
    click: function () {
       var grid = $("#yourGrid").getKendoGrid();

       // declare `rows` and supply your own column names
       var rows = [{
           cells: [
               { value: "ContactTitle" },
               { value: "CompanyName" },
               { value: "Country" }
           ]
       }];                        
       var trs = grid.dataSource;
       // will get any filters applied to grid dataSource
       var filteredDataSource = new kendo.data.DataSource({
           data: trs.data(),
           filter: trs.filter()
       });

       filteredDataSource.read();
       var data = filteredDataSource.view();

       for (var i = 0; i < data.length; i++) {
           var dataItem = data[i];
           rows.push({
               cells: [ // dataItem."Whatever Your Attributes Are"
                   { value: dataItem.ContactTitle },
                   { value: dataItem.CompanyName },
                   { value: dataItem.Country }
               ]
           });
       }                
       excelExport(rows);            
    }
});

这将设置要导出的行,excelExport函数执行导出:

function excelExport(rows) {
    var workbook = new kendo.ooxml.Workbook({
        sheets: [
            {
                columns: [
                  { autoWidth: true },
                  { autoWidth: true }
                ],
                title: "Name of Tab",
                rows: rows
            }
        ]
    });
    var nameOfPage = "Test-1"; // insert here however you are getting name of screen
    kendo.saveAs({ dataURI: workbook.toDataURL(), fileName: nameOfPage + " Export.xlsx" });

}

让我知道结果。