使用Kendo Grid自动导出到Excel

我有一个asp.net MVC5项目,我正在使用Kendo Grid来显示表格数据,并为用户提供导出到Excel的function。 这些数据集的列数相对较小。 例如大多数3-6列。 然而,我有一些怀疑的用户希望能够看到提供一些Kendo图表的数据,这些数据集的数据集比在视图/浏览器中的网格中要大。

我的问题是,有没有人想出了一种方法来使用“导出到Excel”function,这是网格的一部分,而不显示网格。 我喜欢“导出”将数据推送到Excel中的所有附加function,所以我想知道这是否可行,而将自己的输出滚动到可以通过Excel打开的csv文件。

想知道是否有方法直接从控制器中直接导入到Excel函数,以便将数据传回到Excel中的用户?

以下是Telerik的一个例子。

查看网格小部件

<script src="//cdnjs.cloudflare.com/ajax/libs/jszip/2.4.0/jszip.min.js"></script> @(Html.Kendo().Grid<Kendo.Mvc.Examples.Models.ProductViewModel>() .Name("grid") .HtmlAttributes( new { style = "width: 900px" } ) .Columns(columns => { columns.Bound(p => p.ProductName).Width(300).Locked() .ClientFooterTemplate("Total Count: #=count#") .ClientGroupFooterTemplate("Count: #=count#"); columns.Bound(p => p.UnitPrice).Width(300); columns.Bound(p => p.UnitsOnOrder).Width(300) .ClientFooterTemplate("Average: #=average#") .ClientGroupFooterTemplate("Average: #=average#"); columns.Bound(p => p.UnitsInStock).Width(300) .ClientFooterTemplate("Min: #= min # Max: #= max #") .ClientGroupHeaderTemplate("Units In Stock: #= value # (Count: #= count#)"); }) .ToolBar(tools => tools.Excel()) .Pageable() .Sortable() .Scrollable() .Groupable() .Excel(excel => excel .FileName("Kendo UI Grid Export.xlsx") .Filterable(true) .ProxyURL(Url.Action("Excel_Export_Save", "Grid")) ) .Reorderable(r => r.Columns(true)) .Resizable(r => r.Columns(true)) .ColumnMenu() .DataSource(dataSource => dataSource .Ajax() .PageSize(7) .Group(g => g.Add(p => p.UnitsInStock)) .Aggregates(aggregates => { aggregates.Add(p => p.UnitsInStock).Min().Max().Count(); aggregates.Add(p => p.UnitsOnOrder).Average(); aggregates.Add(p => p.ProductName).Count(); aggregates.Add(p => p.UnitPrice).Sum(); }) .Read(read => read.Action("Excel_Export_Read", "Grid")) ) ) 

CONTROLLER

 using System.Collections.Generic; using System.Web.Mvc; using Kendo.Mvc.Examples.Models; using Kendo.Mvc.Extensions; using Kendo.Mvc.UI; using System.Linq; using System; namespace Kendo.Mvc.Examples.Controllers { public partial class GridController : Controller { public ActionResult Excel_Export() { return View(); } public ActionResult Excel_Export_Read([DataSourceRequest]DataSourceRequest request) { return Json(productService.Read().ToDataSourceResult(request)); } [HttpPost] public ActionResult Excel_Export_Save(string contentType, string base64, string fileName) { var fileContents = Convert.FromBase64String(base64); return File(fileContents, contentType, fileName); } } } 

服务

 using System; using System.Collections.Generic; using System.Data; using System.Linq; using System.Web; namespace Kendo.Mvc.Examples.Models { public class ProductService : IDisposable { private SampleEntities entities; public ProductService(SampleEntities entities) { this.entities = entities; } public IEnumerable<ProductViewModel> Read() { return entities.Products.Select(product => new ProductViewModel { ProductID = product.ProductID, ProductName = product.ProductName, UnitPrice = product.UnitPrice.HasValue ? product.UnitPrice.Value : default(decimal), UnitsInStock = product.UnitsInStock.HasValue ? product.UnitsInStock.Value : default(short), QuantityPerUnit = product.QuantityPerUnit, Discontinued = product.Discontinued, UnitsOnOrder = product.UnitsOnOrder.HasValue ? (int)product.UnitsOnOrder.Value : default(int), CategoryID = product.CategoryID, Category = new CategoryViewModel() { CategoryID = product.Category.CategoryID, CategoryName = product.Category.CategoryName }, LastSupply = DateTime.Today }); } public void Create(ProductViewModel product) { var entity = new Product(); entity.ProductName = product.ProductName; entity.UnitPrice = product.UnitPrice; entity.UnitsInStock = (short)product.UnitsInStock; entity.Discontinued = product.Discontinued; entity.CategoryID = product.CategoryID; if (entity.CategoryID == null) { entity.CategoryID = 1; } if (product.Category != null) { entity.CategoryID = product.Category.CategoryID; } entities.Products.Add(entity); entities.SaveChanges(); product.ProductID = entity.ProductID; } public void Update(ProductViewModel product) { var entity = new Product(); entity.ProductID = product.ProductID; entity.ProductName = product.ProductName; entity.UnitPrice = product.UnitPrice; entity.UnitsInStock = (short)product.UnitsInStock; entity.Discontinued = product.Discontinued; entity.CategoryID = product.CategoryID; if (product.Category != null) { entity.CategoryID = product.Category.CategoryID; } entities.Products.Attach(entity); entities.Entry(entity).State = EntityState.Modified; entities.SaveChanges(); } public void Destroy(ProductViewModel product) { var entity = new Product(); entity.ProductID = product.ProductID; entities.Products.Attach(entity); entities.Products.Remove(entity); var orderDetails = entities.Order_Details.Where(pd => pd.ProductID == entity.ProductID); foreach (var orderDetail in orderDetails) { entities.Order_Details.Remove(orderDetail); } entities.SaveChanges(); } public void Dispose() { entities.Dispose(); } } } 

链接: http : //demos.telerik.com/aspnet-mvc/grid/excel-export

顺便说一句,这个“分类”是什么types的build筑? 我喜欢它,并希望阅读它。

如何隐藏网格并添加您自己的button(或类似)来触发导出?

例如(使用引用的代码):

  1. 添加一个button(或添加一些类似的钩子到你的图表)

      <button id="myexport">Export to Excel</button> 
  2. 隐藏网格和附加处理程序:

     $(document).ready(function () { $("#grid").hide(); $("#myexport").click(function () { var grid = $("#grid").data("kendoGrid"); grid.saveAsExcel(); }); });