export data unexpanded

Resolved
Sen asked on August 19, 2024

I have data and would like to know how to export 

all the data even if it is not expanded.

is there in-built handler for export available in toolbar.

For example, if i have selected excel from ExportTo Toolbar, how to know if excel is being clicked. is there any in-built handler. 

possible ways to do it.  

 

I tried this,

Approach 1:

     Attached the file

Approach 2:

beforetoolbarcreated: this.customToolBar,
 

 customToolBar = (toolbar: any) => {
    // Get all tabs
    let tabs = toolbar.getTabs();
    toolbar.getTabs = function () {
   
    const exportTab = tabs.find((tab: any) => tab.id == "fm-tab-export");      
    if (exportTab?.menu) {
      let exportToExcelTab = exportTab?.menu.find((tab: any) => tab.id == "fm-tab-export-excel");
      exportToExcelTab.handler = () => {
        flexmonster.expandAllData(true, "all");
        flexmonster.exportTo('excel', {excelExportAll: true});
      };
    }  
    return tabs;
    };
  }

// not working, means it enters the handler but not even dialog opens for excel to save
 
Kindly help

Attachments:
approach1_exportTo.txt

5 answers

Public
Solomiia Andrusiv Solomiia Andrusiv Flexmonster August 20, 2024

Hello, Sen!

Thank you for reaching out to us.

Kindly note that by default, Flexmonster exports the current visualization of the component. To export all expanded fields, we recommend expanding all data before exporting and restoring the original visualization afterward.

We have prepared a JSFIddle to illustrate the approach: https://jsfiddle.net/flexmonster/yfd6ur7s/.
It has some updates to the Approach 2 you have provided.

You can read about other customizations that can be made to Excel export in our docs: https://www.flexmonster.com/doc/export-report/#excel.

We also noticed in Approach 1 that you are using our component in ShadowDOM. Please make sure that Flexmonster component is defined within the ShadowDOM scope to use our API calls.

Here is a JSFiddle example of defining Flexmonster in ShadowDOM for reference: https://jsfiddle.net/flexmonster/Lbgkasmy/.

Hope you will find our answer helpful.
Feel free to ask if you have any further questions.

Kind regards,
Solomiia

Public
Sen August 20, 2024

Hi Solomiia, 

Thanks for possible solutions.

I have tried the approach 2 suggested by you,  (approach2: https://jsfiddle.net/flexmonster/yfd6ur7s/)

using customise toolbar.

In my case, pivot seems to be always undefined.  

Also, If I have separate handler function like exportToExcel, seems to get error. So, I have included the exportTo directly inside handler function. Please refer the attachment. 

 

Public
Solomiia Andrusiv Solomiia Andrusiv Flexmonster August 20, 2024

Hello, Sen!

Thank you for getting back to us.

According to the provided example, this.flexMonsterTable is the reference to the Flexmonster instance that should be used for the API calls. We believe this should help fix the issue with the reference being undefined.

Regarding the issue with the handler specified separately, it could be a this reference issue due to a different this context. A possible solution is to update the function definition to an arrow function, for example:

//change
toolbar.getTabs = function() {}
//to
toolbar.getTabs = () => {}

Hope it helps.

Kind regards,
Solomiia

Public
Sen August 21, 2024

Thanks for providing solutions. Issue got resolved. 

Public
Solomiia Andrusiv Solomiia Andrusiv Flexmonster August 27, 2024

Hello, Sen!

Thank you for your feedback.

We are glad to hear that everything works well now.

Feel free to reach out to us in case of any other questions.

Kind regards,
Solomiia

Please login or Register to Submit Answer