从 Kendo Grid 数据源导出所有数据

Posted 2023-05-07

【中文标题】从 Kendo Grid 数据源导出所有数据

【英文标题】：Exporting all data from Kendo Grid datasource

【发布时间】：2014-02-02 22:44:04

【问题描述】：

我遵循了关于导出剑道网格数据的教程：http://www.kendoui.com/blogs/teamblog/posts/13-03-12/exporting_the_kendo_ui_grid_data_to_excel.aspx

现在我正在尝试导出所有数据（不仅是显示的页面）...我该怎么做？

我尝试在获取数据之前更改 pagezise：

grid.dataSource.pageSize(grid.dataSource.total());

但是，我的实际网格刷新为新的 pageSize。这是在不刷新网格的情况下查询剑道数据源的方法吗？

谢谢

【参考方案1】：

更好的解决方案是从真实数据而不是数据源生成 Excel 文件。

1] 在html页面中，添加

$('#export').click(function () 
    var title = "EmployeeData";
    var id = guid();
    var filter = $("#grid").data("kendoGrid").dataSource._filter;

    var data = 
        filter: filter,
        title: title,
        guid: id
    ;

    $.ajax(
        url: '/Employee/Export',
        type: "POST",
        dataType: 'json',
        data: JSON.stringify(data),
        contentType: "application/json; charset=utf-8",
        success: function (result) 
            window.location = kendo.format("0?title=1&guid=2", '/Employee/GetGeneratedExcel', title, id);
        
    );
);

2] 向控制器添加方法“导出”：

[HttpPost]
public JsonResult Export(KendoGridFilter filter, string guid)

    var gridRequest = new KendoGridRequest();
    if (filter != null)
    
        gridRequest.FilterObjectWrapper = filter.Filters != null ? filter.ToFilterObjectWrapper() : null;
        gridRequest.Logic = filter.Logic;
    

    var query = GetQueryable().AsNoTracking();
    var results = query.FilterBy<Employee, EmployeeVM>(gridRequest);

    using (var stream = new MemoryStream())
    
        using (var excel = new ExcelPackage(stream))
        
            excel.Workbook.Worksheets.Add("Employees");
            var ws = excel.Workbook.Worksheets[1];
            ws.Cells.LoadFromCollection(results);
            ws.Cells.AutoFitColumns();

            excel.Save();
            Session[guid] = stream.ToArray();
            return Json(new  success = true );
        
    

3] 还将方法“GetGeneratedExcel”添加到控制器：

[HttpGet]
public FileResult GetGeneratedExcel(string title, string guid)

    // Is there a spreadsheet stored in session?
    if (Session[guid] == null)
    
        throw new Exception(string.Format("0 not found", title));
    

    // Get the spreadsheet from session.
    var file = Session[guid] as byte[];
    string filename = string.Format("0.xlsx", title);

    // Remove the spreadsheet from session.
    Session.Remove(title);

    // Return the spreadsheet.
    Response.Buffer = true;
    Response.AddHeader("Content-Disposition", string.Format("attachment; filename=0", filename));
    return File(file, "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet", filename);

也可以在 github 上查看这个项目。

查看this 现场示例项目，您可以在其中将员工导出到 Excel。 （虽然这会返回过滤后的数据，但是您可以修改代码以忽略剑道网格过滤器并始终返回所有数据。

【讨论】：

感谢您的帮助...这样做，我必须在我的所有控制器 (100+) 中创建一个方法导出。今天我有一个控制器导出和一个局部视图来渲染我需要的按钮导出。

嗨@Stef，它在IE上运行良好，但在Chrome上它保存为“title.xlsx，附件”文件，你能修复它吗？

请在 github 中为这个项目创建一个问题：github.com/StefH/KendoGridBinderEx

【参考方案2】：

真的老问题但是：

要导出所有页面，请使用excel.allPages:

$("#grid").kendoGrid(
    toolbar: ["excel"],
    excel: 
        allPages: true
    ,
    // ....
);

See Example

【讨论】：

知道如何在模板样式的网格中设置allPages: true 吗？

【参考方案3】：

网格工具栏

..
.ToolBar(toolbar =>
    
        toolbar.Template(
            @<text>
                @Html.Kendo().Button().Name("grid-export").HtmlAttributes(new  type = "button", data_url = @Url.Action("Export") ).Content("Export").Events(ev => ev.Click("exportGrid"))
            </text>);
    )
..

端点导出功能

public FileResult Export([DataSourceRequest]DataSourceRequest request)
        
            DemoEntities db = new DemoEntities();
            byte[] bytes = WriteExcel(db.Table.ToDataSourceResult(request).Data, new string[]  "Id", "Name" );

            return File(bytes,
                "application/vnd.ms-excel",
                "GridExcelExport.xls");
        

使用所有指定参数生成网格远程导出 url 的 javascript 函数

function exportGrid() 
    var toolbar = $(this.element);
    var gridSelector = toolbar.closest(".k-grid");
    var grid = $(gridSelector).data("kendoGrid");
    var url = toolbar.data("url");

    var requestObject = (new kendo.data.transports["aspnetmvc-server"]( prefix: "" ))
        .options.parameterMap(
            page: grid.dataSource.page(),
            sort: grid.dataSource.sort(),
            filter: grid.dataSource.filter()
        );

    url = url + "?" + $.param(
        "page": requestObject.page || '~',
        "sort": requestObject.sort || '~',
        "pageSize": grid.dataSource.pageSize(),
        "filter": requestObject.filter || '~',
    );
    window.open(url, '_blank');

有关详细解决方案，请参阅我在 Github 上的示例项目

您可以使用帮助函数导出具有当前配置（排序、过滤、分页）的网格服务器端

【讨论】：

@AlvaroAV 在这里完成了包含基本部分的工作