Search code examples
angulartypescriptexport-to-csvag-gridpojo

Download invisible fields in export to csv functionality in AG grid in Angular6


I have a pojo array which I am using it for rowData for my ag-grid

    export interface Items {
    firstName?: String;
    lastname?: String;
    Address?: String;
    phoneNumber?: number;
    city?: String;
    state?: String;
    zipcode?: number;
    accountId?: number;
    status?: String;
    approvalStatus?: String;
    txId?: number;
    rxId?: number;
    txBankname?: String;
    rxBankName?: String;
    txCcy?: String;
    rxCcy?: String;
    txCcyAmt?:number;
    rxCcyAmt?:number;
     txDate?:date;
     rxDate?:date;
 }

But I dont show all data in the grid. However I want to download additional data not shown in the grid but is available in the rowData or the POJO.

 <button mat-icon-button  (click)="agGrid.api.exportDataAsCsv()" matTooltip="CSV Download">
        <i class="fa fa-download" style="color:#455A64" aria-hidden="true"></i>
 </button>

This click will only download the data visible in the grid as given in the link here

But if we want to download additional properties of the POJO into the csv, how do we do it.


Solution

  • From the Official AG-Grid documentation

    You have two options, let the grid do the export if the browser is modern and it is allowed, or you get the grid to return you the CSV string and your application is responsible for the export

    If you choose to let the grid do the export than there is an additional option allColumns you can use. If allColumns=true than all columns both hidden and visible will be exported

    However, it sounds like you not only want to export hidden column data but also add data to the CSV that is NOT included in the grid. If that is the case you will need to elect to have the grid return the CSV string to you in your application and have a custom method that will add the data you want to the CSV before completing the export.