I have two angular views with igGrids. I have one view with a statically defined igGrid that is able to export to Excel. My second view has a dynamically created igGrid. When trying to export, the dynamically created igGrid, I get an uncaught exception "The empty color cannot be used to create a WorkbookColorInfo instance"?
// HTML
<div id="gridPlaceholder"></div>
// dynamic construciton on view activation
$("#gridPlaceholder").igGrid($scope.gridOptions);
// export
$.ig.GridExcelExporter.export($("#gridPlaceholder"), { fileName: "OvertimeReport", gridFeatureOptions: { gridStyling: "applied" } });
Any ideas what could be going on?
Hello John,
Thank you for posting in the Infragistics community !
This is a known issue in 15.1 when the grid is initialiased on a <div> element. The upcoming release scheduled for 11 September according to http://www.infragistics.com/support/service-releases will have this issue fixed.
Until that time you can use the following workaround by handling the headerCellExporting callback:
$.ig.GridExcelExporter.export($("#gridPlaceholder"), { fileName: "OvertimeReport", gridFeatureOptions: { gridStyling: "applied" }, { headerCellExporting: function(sender, args) { sender._notAltRowColor = sender._gridWidget.find("table").css("background-color"); sender._AltRowColor = sender._gridWidget.find("table").css("color"); }, }});
Please let me know if you have further questions on the matter, I will be glad to help.
Sorry, this isn't working. It looks like you have an extra set of {} in your example. I tried the following below, but the headerCellExporting event is not firing.
$.ig.GridExcelExporter.export($("#gridPlaceholder"), { fileName: "OvertimeReport", gridFeatureOptions: { gridStyling: "applied" }, headerCellExporting: function(sender, args) { sender._notAltRowColor = sender._gridWidget.find("table").css("background-color"); sender._AltRowColor = sender._gridWidget.find("table").css("color"); }, });
Ok, I moved the headerCellExporting handler up into the gridFeaturesOptions. Now the event is firing. However, I get the following errors on export?
...ed document is incorrect."}};$$t.$jq._i=$$t.$d0.defaultEqualityComparerValue(thi...
...Worksheet:function(){this._xlRowIndex=0;this._workbook=new $.ig.excel.Workbook($...
Try the following:
$.ig.GridExcelExporter.export($('#grid'), { fileName: "OvertimeReport", gridFeatureOptions: { gridStyling: "applied" }, },
{ //when igGrid is instantiated on a DIV element use the following fix headerCellExporting: function(sender, args) { if(sender._notAltRowColor!=sender._gridWidget.find("table").css("background-color") ||sender._AltRowColor!=sender._gridWidget.find("table").css("color")) { sender._notAltRowColor = sender._gridWidget.find("table").css("background-color"); sender._AltRowColor = sender._gridWidget.find("table").css("color"); } },});
I have attached a working sample so that you can refer to it. Event should now fire and work. IF it does not please update with the exact error you receive and the exact version of IGniteUI that you are using.
Hi Hristo,
Sorry for bumping in.
I am using 15.2 and this issue doesn't seem to be resolved yet?
If I initialized igGrid using javascript on a div and then export it to excel, I am having the same error.
If I changed it to use span or other element, the error does not occur.
Do you happen to know any workaround for 15.2. This one does not seem to work anymore.
The exact version is 15.2.20152.2081.
Thanks,
Charles