I am trying to use igGridExcelExporter component in angular2.0 sample, but it not working. I want to export it with excel feature.
Hi Sameer,
Basically you should not have experienced issues. It will be helpful if you provide more information on what exactly happens, is there any error that occurs, and what version of IgniteUI you are using.
I am looking forward to hearing from you.
I am trying to add below code to the angular 2 final version sample what you guys have provided in github.
$.ig.GridExcelExporter.exportGrid($("#xyz"), { fileName: "igGrid", worksheetName: "data", tableStyle: "tableStyleLight13" });
But it is saying GridExcelExporter is not defined. Also I tried this http://ko.infragistics.com/community/forums/t/106636.aspx also but it is giving me "core.umd.js:3427 EXCEPTION: Cannot read property 'igHierarchicalGrid' of undefined".
I want to export data to excel with features.
Hi,
The Angular 2 directives implemented for our IgniteUI toolset do not wrap the igGridExcelExporter component. However you can easily add this functionality by following the steps below. I applied them to our samples from https://github.com/IgniteUI/igniteui-angular2 and it worked fine:
1) Add an exportExcel method (or however you name it) to your AppComponent:
igniteui-angular2\samples\igGrid\app.ts
exportExcel() { $.ig.GridExcelExporter.exportGrid($("#grid1"), { }); }
2) Add the following button in your App template:
igniteui-angular2\samples\igGrid\IgGridTemplate.html
<input type="button" value="Export" (click)="exportExcel()" class="btn btn-default"/>
3) Add references to the js resources required for the exporting to work:
igniteui-angular2\samples\igGrid\IgGrid.html
<!-- External files for exporting -->
<script src="http://www.igniteui.com/js/external/FileSaver.js"></script>
<script src="http://www.igniteui.com/js/external/Blob.js"></script>
<script src="http://cdn-na.infragistics.com/igniteui/2016.1/latest/js/modules/infragistics.documents.core.js"></script> <script src="http://cdn-na.infragistics.com/igniteui/2016.1/latest/js/modules/infragistics.excel.js"></script>
<script src="http://cdn-na.infragistics.com/igniteui/2016.1/latest/js/modules/infragistics.gridexcelexporter.js"></script>
I intentionally cited the exact fiels where to apply the steps, as you said you were following our samples from github. Please let me know if you have further questions on the matter, I will be glad to help.
I've tried the steps but below line throws error $.ig.GridExcelExporter.exportGrid
Property 'exportGrid' does not exist on type 'typeof GridExcelExporter'.
Please make sure that your initializing a new GridExcelExporter object, and then call the exportGrid method:
exportExcel() { var exporter = new $.ig.GridExcelExporter({}) exporter.exportGrid(this.grid, {}, {}); }
Please let me know if this resolves the issue on your side.
Sorry this is not worked I have tried the above mentioned but error thrown as "$.ig.GridExcelExporter is not a constructor."
But when i go to its definition there is method defined in "igniteui.ts" file as below
declare module Infragistics {export class GridExcelExporter { constructor(callbacks: GridExcelExporterCallbacks); constructor(settings: GridExcelExporterSettings);
/** * Exports the provided igGrid to Excel document. * * @param grid Grid to be exported. * @param userSettings Settings for exporting the grid. * @param userCallbacks Callbacks for the events. */ exportGrid(grid: Object, userSettings: Object, userCallbacks: Object): void;}}
interface IgniteUIStatic {GridExcelExporter: typeof Infragistics.GridExcelExporter; exportGrid(grid: Object, userSettings: Object, userCallbacks: Object): void;}
Hi Hristo,
Please find the attached sample.
Warm regards,
G.Saravanan
Please provide a sample demonstrating the issue that I can investigate for you.
Any updates on this issue?
Thanks,
Saravanan
FYI, we are using version 2016.1 and we tried in machine with infragistics not installed as well, both not working.
var exporter = new $.ig.GridExcelExporter({}) exporter.exportGrid($("#grid1"), { fileName: "igGrid" }, { success: function () { alert("exporting has finished!"); } } );
we face below error on Excel Export now,
"Invalid Enum Argument: format value: 2"
Hello G.Saravanan,
This error means that the required resources for exporting are not loaded. Please make sure you have added those, as explained in step 3) from above:
<!-- External files for exporting --><script src="http://www.igniteui.com/js/external/FileSaver.js"></script><script src="http://www.igniteui.com/js/external/Blob.js"></script>
<!-- IgniteUI exporting resources --><script src="http://cdn-na.infragistics.com/igniteui/2016.2/latest/js/modules/infragistics.documents.core.js"></script><script src="http://cdn-na.infragistics.com/igniteui/2016.2/latest/js/modules/infragistics.excel.js"></script><script src="http://cdn-na.infragistics.com/igniteui/2016.2/latest/js/modules/infragistics.gridexcelexporter.js"></script>
I am also attaching a sample for your reference, you need to do npm install, npm start and navigate to the igGrid sample.
Please let me note if you are using version 2017.1 of IgniteUI, because the in 2017. those files are modularized, and references need to be updated.