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

时间:2014-01-14 18:15:02

标签: javascript kendo-ui kendo-grid

我遵循了有关导出Kendo网格数据的教程: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。这是一种在不刷新网格的情况下查询kendo数据源的方法吗?

由于

3 个答案:

答案 0 :(得分:5)

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

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] 还要添加方法&#34; GetGeneratedExcel&#34;到控制器:

[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实时示例项目,您可以将Employees导出到Excel。 (虽然这会返回已过滤的数据,但您可以修改代码以忽略kendo网格过滤器并始终返回所有数据。

答案 1 :(得分:1)

真的旧问题但是:

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

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

See Example

答案 2 :(得分:-2)

网格工具栏

..
.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");
        }

用于生成具有所有指定参数的网格远程导出网址的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

上的示例项目

你可以使用帮助函数

导出网格服务器端的当前配置(排序,过滤,分页)