#angularjs #kendo-grid #export-to-excel
#angularjs #kendo-grid #экспорт в Excel
Вопрос:
Я пытаюсь экспортировать в Excel в Kendo Grid с помощью AngularJS, он отлично работает на локальном, но не на этапе. Я потратил на это целый день, но не нашел никакого решения. Заранее спасибо. Ошибка:
TypeError: Cannot read property 'length' of undefined
at Function.map (http://lm.stage.cargoclix.net/js/lib-0fb5682e33.js:1:12661)
at init.toDataURL (http://lm.stage.cargoclix.net/js/lib-0fb5682e33.js:24:1105)
at init.<anonymous> (http://lm.stage.cargoclix.net/js/lib-0fb5682e33.js:24:9157)
at Object.r (http://lm.stage.cargoclix.net/js/lib-0fb5682e33.js:1:12947)
at Object.<anonymous> (http://lm.stage.cargoclix.net/js/lib-0fb5682e33.js:2:4784)
at u (http://lm.stage.cargoclix.net/js/lib-0fb5682e33.js:2:3416)
at Object.fireWith [as resolveWith] (http://lm.stage.cargoclix.net/js/lib-0fb5682e33.js:2:4228)
at Object.r.(anonymous function) [as resolve] (http://lm.stage.cargoclix.net/js/lib-0fb5682e33.js:2:5208)
at init.<anonymous> (http://lm.stage.cargoclix.net/js/lib-0fb5682e33.js:24:3882)
at Object.r (http://lm.stage.cargoclix.net/js/lib-0fb5682e33.js:1:12947)
Мой Html-код
<div kendo-grid="vm.grid" id="grid" k-data-source="vm.gridOptions.datasource" k-options="vm.gridOptions" class="lm-panel-body">
JS-код
vm.getGridOptions = function () {
vm.gridOptions = {
datasource: new kendo.data.DataSource({
type: "odata",
transport: {
read: function (options) {
if (!!$scope.figure.figureId) {
if (!!options.data.filter) {
$scope.filterChanged(vm.gridOptions.datasource, vm.getFigureData.dataSource.name);
for (var i = 0; i < options.data.filter.filters.length; i ) {
if (options.data.filter.filters[i].value.indexOf("00:00:00") > -1) {
var date = new Date(options.data.filter.filters[i].value);
var month = ("0" (date.getMonth() 1)).slice(-2);
var day = ("0" date.getDate()).slice(-2);
var fullDate = date.getFullYear() "/" month "/" day;
options.data.filter.filters[i].value = fullDate;
}
}
}
else if (!options.data.filter)
{
$scope.filterChanged(undefined, vm.getFigureData.dataSource.name);
}
gridService.get(options, $scope.figure.figureId).then(function (data) {
});
}
}
},
schema: {
data: function (data) {
if (data.data) {
return data.data;
}
},
total: function (data) {
if (data.total) {
return data.total;
}
}
},
group: vm.JsonGroupingCloumns,
aggregate: vm.aggregatesList,
pageSize: vm.gridConfigurationJson.PageSize ? vm.gridConfigurationJson.PageSize : 10,
serverPaging: true,
serverSorting: true,
serverFiltering: true
}),
dataBound: function (e) {
if (vm.childGridId > 0 amp;amp; vm.detailGridFigureParams == undefined) {
this.expandRow(this.tbody.find("tr.k-master-row").first());
this.collapseRow(this.tbody.find("tr.k-master-row").first());
}
if (e.sender.pager.dataSource._pageSize != 10) {
if (vm.gridConfigurationJson.PageSize != e.sender.pager.dataSource._pageSize) {
saveGridConfigration(e, $scope.figure.figureId);
}
}
},
sortable: {
mode: "single",
allowUnsort: false
},
pageable: {
refresh: true,
pageSizes: [10, 25, 50, 100, 200, "All"],
buttonCount: 5,
},
filterable:true,
scrollable: true,
resizable: true,
reorderable: true,
columnMenu: true,
columns: vm.columnsList,
excel: {
allPages: true,
filterable: true
},
excelExport: function (e) {
var filename = "";
if ($scope.figure.captionView != undefined) {
filename = $scope.figure.captionView;
}
else if ($scope.figure.caption != undefined) {
filename = $scope.figure.caption;
}
debugger;
if (vm.childGridId > 0)
{
e.preventDefault();
var workbook = e.workbook;
detailExportPromises = [];
var masterData = e.data;
for (var rowIndex = 0; rowIndex < masterData.length; rowIndex ) {
var masterRowData = {};
masterRowData.data = masterData[rowIndex];
exportChildData(rowIndex, masterRowData);
}
$.when.apply(null, detailExportPromises)
.then(function () {
// get the export results
var detailExports = $.makeArray(arguments);
// sort by masterRowIndex
detailExports.sort(function (a, b) {
return a.masterRowIndex - b.masterRowIndex;
});
//// add an empty column
workbook.sheets[0].columns.unshift({
width: 30
});
// prepend an empty cell to each row
for (var i = 0; i < workbook.sheets[0].rows.length; i ) {
workbook.sheets[0].rows[i].cells.unshift({});
}
// merge the detail export sheet rows with the master sheet rows
// loop backwards so the masterRowIndex doesn't need to be updated
for (var i = detailExports.length - 1; i >= 0; i--) {
var masterRowIndex = detailExports[i].masterRowIndex 1; // compensate for the header row
var sheet = detailExports[i].sheet;
// prepend an empty cell to each row
for (var ci = 0; ci < sheet.rows.length; ci ) {
if (sheet.rows[ci].cells[1].value) {
sheet.rows[ci].cells.unshift({});
}
}
// insert the detail sheet rows after the master row
[].splice.apply(workbook.sheets[0].rows, [masterRowIndex 1, 0].concat(sheet.rows));
}
// save the workbook
kendo.saveAs({
dataURI: new kendo.ooxml.Workbook(workbook).toDataURL(),
fileName: filename ".xlsx"
});
});
}else
{
e.workbook.fileName = filename ".xlsx";
}
},
//pdf: {
// allPages: true,
// fileName: $scope.vm.getFigureData.caption ".pdf"
//},
columnReorder: function (e) {
saveGridConfigration(e,$scope.figure.figureId);
},
columnResize: function (e) {
saveGridConfigration(e,$scope.figure.figureId);
}
};
if (vm.childSourceChecked == 1) {
if (vm.childGridId > 0) {
vm.gridOptions.detailInit = detailInit;
}
vm.childSourceChecked = 2;
}
var clearFilterTemplate = $("#clearFilterButtonTemplate").html();
if(clearFilterTemplate)
{
vm.gridOptions.toolbar = [
"excel",
{ text: "Clear filter", template: kendo.template($("#clearFilterButtonTemplate").html()) }
]
}
};
Ответ №1:
У меня была аналогичная проблема.
У вас может быть другая версия jquery в dev или production.
Пожалуйста, обновите свой jquery до версии 2.2.4 или выше.
Это решит вашу проблему.