Kendo UI for jQuery數(shù)據(jù)管理使用教程：Excel導(dǎo)出（二）

---

Kendo UI for jQuery R2 2020 SP1試用版下載

Kendo UI目前最新提供Kendo UI for jQuery、Kendo UI for Angular、Kendo UI Support for React和Kendo UI Support for Vue四個控件。Kendo UI for jQuery是創(chuàng)建現(xiàn)代Web應(yīng)用程序的最完整UI庫。

 從Kendo UI Q3 2014（2014.3.1119）版本開始，Grid小部件提供內(nèi)置的Excel導(dǎo)出功能。

導(dǎo)出從左到右的內(nèi)容

 excelExport事件允許您反轉(zhuǎn)單元格并設(shè)置文本對齊方式，支持從右到左（RTL）語言。 要在Excel中從右到左的流程中呈現(xiàn)文檔，請啟用工作簿的rtl選項。

每行都有一個類型字段，可用于在網(wǎng)格中區(qū)分各種行類型。 支持的值為：

• "header"
• "footer"
• "group-header"
• "group-footer"
• "data"

  <script src="http://cdnjs.cloudflare.com/ajax/libs/jszip/2.4.0/jszip.min.js"></script>
  
  <div class="k-rtl">
  <div id="grid" ></div>
  </div>
  <script>
  $("#grid").kendoGrid({
  toolbar: ["excel"],
  excel: {
  allPages: true
  },
  dataSource: {
  type: "odata",
  transport: {
  read: "http://demos.telerik.com/kendo-ui/service/Northwind.svc/Products"
  },
  pageSize: 7
  },
  excelExport: function(e) {
  var workbook = e.workbook;
  var sheet = workbook.sheets[0];
  
  workbook.rtl = true;
  for (var i = 0; i < sheet.rows.length; i++) {
  for (var ci = 0; ci < sheet.rows[i].cells.length; ci++) {
  sheet.rows[i].cells[ci].hAlign = "right";
  }
  }
  },
  pageable: true,
  columns: [
  { width: 300, field: "ProductName", title: "Product Name" },
  { field: "UnitsOnOrder", title: "Units On Order" },
  { field: "UnitsInStock", title: "Units In Stock" }
  ]
  });
  </script>

導(dǎo)出多個網(wǎng)格

默認(rèn)情況下，每個網(wǎng)格將其內(nèi)容導(dǎo)出到單獨的Excel工作表中。

在服務(wù)器上保存文件

要將生成的文件發(fā)送到遠程服務(wù)，請防止保存默認(rèn)文件并發(fā)布base64編碼的內(nèi)容。

<script src="http://cdnjs.cloudflare.com/ajax/libs/jszip/2.4.0/jszip.min.js"></script>

<div id="grid"></div>
<script>
$("#grid").kendoGrid({
toolbar: ["excel"],
dataSource: {
type: "odata",
transport: {
read: "http://demos.telerik.com/kendo-ui/service/Northwind.svc/Products"
},
pageSize: 7
},
pageable: true,
columns: [
{ width: 300, field: "ProductName", title: "Product Name" },
{ field: "UnitsOnOrder", title: "Units On Order" },
{ field: "UnitsInStock", title: "Units In Stock" }
],
excelExport: function(e) {
// Prevent the default behavior which will prompt the user to save the generated file.
e.preventDefault();
// Get the Excel file as a data URL.
var dataURL = new kendo.ooxml.Workbook(e.workbook).toDataURL();
// Strip the data URL prologue.
var base64 = dataURL.split(";base64,")[1];
// Post the base64 encoded content to the server which can save it.
$.post("/server/save", {
base64: base64,
fileName: "ExcelExport.xlsx"
});
}
});
</script>

服務(wù)器端處理

 要將龐大的數(shù)據(jù)集導(dǎo)出到Excel，請使用新的RadSpreadStreamProcessing庫，該庫是Telerik Document Processing (TDP) by Progress的一部分。

已知局限性

• 在客戶端導(dǎo)出期間，網(wǎng)格及其數(shù)據(jù)源僅包含當(dāng)前頁面中的數(shù)據(jù)項。 結(jié)果，要么批量導(dǎo)出，要么禁用分頁功能。
• 導(dǎo)出文件的最大大小具有系統(tǒng)特定的限制。 對于大型數(shù)據(jù)集，請使用RadSpreadStreamProcessing作為文檔處理庫的一部分提供的服務(wù)器端解決方案。
• 在較舊的瀏覽器（例如Internet Explorer 9和Safari）中，將網(wǎng)格導(dǎo)出到Excel需要實現(xiàn)服務(wù)器代理。
• 在Excel導(dǎo)出期間，網(wǎng)格不使用列模板，而是僅導(dǎo)出數(shù)據(jù)。 出現(xiàn)這種情況的原因是，列模板可能包含無法轉(zhuǎn)換為Excel列值的任意HTML。
• 網(wǎng)格出于與未導(dǎo)出列模板相同的原因而不會導(dǎo)出其詳細(xì)信息模板。
• 在Excel導(dǎo)出期間，網(wǎng)格不使用列格式，因為某些Kendo UI格式與Excel不兼容。 要格式化單元格值，請設(shè)置單元格的格式選項。

---