Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
20
Export to Excel : "Column1" is getting exported with empty header
posted

HI Team,

 

After exporting multi header grid if we have header as empty then label "Column1" is being exported. Please find the screenshots and stacblitz sample below.

UI

Exported Data

StackBlitz sample

https://stackblitz.com/edit/angular-ouju1g-nv359d?file=src%2Fapp%2Fdata%2FinvoiceData.ts,src%2Fapp%2Fgrid%2Fgrid-groupby-sample%2Fgrid-groupby-sample.component.ts,src%2Fapp%2Fgrid%2Fgrid-groupby-sample%2Fgrid-groupby-sample.component.html,src%2Fapp%2Fgrid%2Fgrid-groupby-sample%2Fgrid-groupby-sample.component.scss

Please help me to resolve this issue.

Thanks

Vijay.

Parents
No Data
Reply
  • 2680
    Offline posted

    Hi Vijay,

    Thank you for posting to Infragistics Community!

    I have been looking into your question and can confirm the observed behavior. After further investigation, though, I can say that this is rather by design, as the Excel Exporter Service internally assigns the fallback value for the header, when it is null or whitespace.

    In case this is not desirable for your scenario, it can easily be overwritten by customizing the exported content. More information about this approach can be found in our documentation here.

    Here you can find a StackBlitz sample demonstrating this suggestion. Since each subsequent “empty-headered” column will be assigned a “Column” + index value, which will be passed to the IColumnExportingEventArgs arguments in the IgxExcelExporterService’s columnExporting event, a regex match could be performed for the currently exported column header. In case a match is found, the header could be reassigned back to empty string:

      private headerRegex = /Column\d*/g;
    
     

     constructor(private excelExportService: IgxExcelExporterService) {}
      ngOnInit(): void {
        this.excelExportService.columnExporting.subscribe(
          (args: IColumnExportingEventArgs) => {
            if (args.header.match(this.headerRegex) !== null) {
              args.header = '';
            }
          }
        );
      }
     

    Obviously, this solution implies that the other columns have meaningful names different from “Column” + number, otherwise they will be affected as well. Feel free to further adapt this approach to the specific application needs.

    In conclusion, please, test the sample on your side and let me know if you require any further assistance on the matter.

    Best regards,
    Bozhidara Pachilova
    Associate Software Developer

Children
No Data