Ag grid exportDataAsExcel run export to xml instead xlsx

Question

I add context menu and reassign export to csv and Excel - I need export use valueFormatter for some column.

Export working fine, but after I run export to xml, and then run export to Excel - I get xml file.

It's happen only here - because I use getContextMenuItems. Other tables uses standard context menu working fine.

menu:

getContextMenuItems = (() => {
const self = this;
return (param) => {
  const menu = [
    'copy',
    'copyWithHeaders',
    'paste',
    'separator',
    {
      name: 'Export',
      subMenu: [
        {
          name: 'csvExport',
          action: () => {
            self.gridApi.exportDataAsCsv({
              processCellCallback: (params) => {
                if (params.column.getColDef().valueFormatter) {
                  const valueFormatterParams: ValueFormatterParams = {
                    ...params,
                    data: params.node.data,
                    // tslint:disable-next-line:no-non-null-assertion
                    node: params.node!,
                    colDef: params.column.getColDef()
                  };
                  return params.column.getColDef().valueFormatter(valueFormatterParams);
                }
                return params.value;
              },
            });
          }
        },
        {
          name: 'excelExport',
          action: () => {
            self.gridApi.exportDataAsExcel({
              processCellCallback: (params) => {
                if (params.column.getColDef().valueFormatter) {
                  const valueFormatterParams: ValueFormatterParams = {
                    ...params,
                    data: params.node.data,
                    // tslint:disable-next-line:no-non-null-assertion
                    node: params.node!,
                    colDef: params.column.getColDef()
                  };
                  return params.column.getColDef().valueFormatter(valueFormatterParams);
                }
                return params.value;
              },
            });
          }
        },
        'excelXmlExport'
      ]
    }
  ];
  return menu;
};
})();

Plunker for example: https://plnkr.co/edit/ysaS5IJzOwvVacRb

1. run export to Excel (formated) - get xlsx
2. run export to xml - get xml
3. run export to Excel (formated) - get xml instead xlsx

Answer 1

In your customized Excel Export you got to define exportMode property. the reason for explicitly defining this property is that AG Grid uses the same method to export both types and exportMode plays a crucial part here. if no export mode is defined then AG Grid uses this.getExportMode() which gives last used exportMode (in your case XML).

this is how AG Grid has implemented Export functionality.

    case 'excelExport':
      return {
       name: localeTextFunc('excelExport', 'Excel Export (.xlsx)‎'),
                action: function () { return _this.gridApi.exportDataAsExcel({
                    exportMode: 'xlsx'
                }); }
            };
        case 'excelXmlExport':
            return {
                name: localeTextFunc('excelXmlExport', 'Excel Export (.xml)‎'),
                action: function () { return _this.gridApi.exportDataAsExcel({
                    exportMode: 'xml'
                }); }
            };

Change your code to this and it should work,

    self.gridApi.exportDataAsExcel({
          exportMode: 'xlsx',
          processCellCallback: (params) => {
            if (params.column.getColDef().valueFormatter) {
              const valueFormatterParams: ValueFormatterParams = {
                ...params,
                data: params.node.data,
                // tslint:disable-next-line:no-non-null-assertion
                node: params.node!,
                colDef: params.column.getColDef()
              };
              return params.column.getColDef().valueFormatter(valueFormatterParams);
            }
            return params.value;
          },
        });