HI Team,
We are using igx version 14.2.17 . We have requirement like we need to export hidden columns also in the grid. Could you please help me to solve this issue.
Thanks
Vijay
Hello,
I have been looking into your question and to enable the export of hidden columns, what you need to do is to handle the exportStarted event of the igx-grid-toolbar-exporter component, and in the given function you will set the ignoreColumnsVisibility option to true when exporting to export the hidden as well.
<igx-grid-toolbar-exporter [exportCSV]="false" [exportExcel]="true" (exportStarted)="exportStarted($event)" > </igx-grid-toolbar-exporter>
public exportStarted(args: IgxExporterEvent) { args.options.ignoreColumnsVisibility = true; }
The described scenario could be observed here:
In addition, I have prepared small sample illustrating this behavior which could be found here. Please test it on your side and let me know how it behaves.
If you require any further assistance on the matter, please let me know.
Regards,
Georgi Anastasov
Entry Level Software Developer
Infragistics
Thanks for the response . It is working fine . I need to use our customized icon for the export instead of export dropdown . Could you please let me know how we can override the styles and I need provide different excel filenames instead of "Exported Data" . Loking forward for the response.
Vijay.
I have been looking into your question and in order to achieve your expectations, what I could suggest you as an approach is instead of using the igx-grid-toolbar-exporter component in the toolbar, you will add your own button with an icon or just an icon according to your custom logic. After that, you will be able to style the added element as you wish and add a click event to it.
<igx-icon (click)="export()" [style.color]="'#e41c77'" style="cursor: pointer;">export</igx-icon>
In the constructor in the ts file of the component, you will add IgxExcelExporterService with which, when you click on the added element in the grid toolbar and execute the given function, you will be able to easily export the grid to Excel with export method by setting your preferred options for the multi-column headers or for the hidden columns and your preferred filename according to your custom logic.
constructor(private excelExportService: IgxExcelExporterService){}
public export(){ const exporterOptions = new IgxExcelExporterOptions('ExportedDataFile'); exporterOptions.ignoreMultiColumnHeaders = false; exporterOptions.ignoreColumnsVisibility = false; this.excelExportService.export(this.grid, exporterOptions); }
Thank you for your cooperation.