How to add a customised templates for print and pdf from export

Hello, Ramcy!
 
Thank you for contacting us.
 
Could you please provide us with more details about the desired export and print customization? With this information, we'll be able to provide you with a more suitable solution.
 
Looking forward to hearing from you.
 
Kind regards,
Solomiia

Hello, Ramcy!
 
Thank you for the provided details.
 
Kindly note that it is possible to override the default functionality of the Export button and add a custom header and footer to PDF export.
The algorithm is the following:
1. Add the customize Toolbar function on beforetoolbarcreated event:

 new Flexmonster({
  container: "pivot-container",
  componentFolder: "https://cdn.flexmonster.com/",
  toolbar: true,
  beforetoolbarcreated: customizeToolbar,
  report: //report object here
}

 
2. In the customizeToolbar() function, find the necessary tab("fm-tab-export-pdf" in our case), and add the custom export handler:

function customizeToolbar(toolbar) {
  let tabs = toolbar.getTabs();
  toolbar.getTabs = function() {
    const exportTab = tabs.find(tab => tab.id == "fm-tab-export");
    exportTab.menu.find(tab => tab.id == "fm-tab-export-pdf").handler = exportToPDFHandler;
    return tabs;
  }
}

You can look through our customizing the Toolbar guide for more details on this part: https://www.flexmonster.com/doc/customizing-toolbar/.
 
3. Add the handler function with your custom exporting parameters. While exporting to PDF, you can add the HTML tags to the header and footer. Then, use the exportTo() API call to start the export:

function exportToPDFHandler() {
  const params = {
    filename: 'flexmonster',
    header: "<div><img src='" + path_to_your_image+ "'></div><p>Header Title</p>",
    footer: "<p> Table Footer</p>",
  };
  flexmonster.exportTo('pdf', params);
}

We have prepared a JSFiddle example for illustration: https://jsfiddle.net/flexmonster/cp0me7b2/. Please click Export=>To PDF button to see the customized PDF file exported.
 
Hope you will find our answer helpful. Please let us know if the suggested approach works well for you.
 
Kind regards,
Solomiia

Hello, Ramcy!

Hope you are having a great week.

Our team is wondering if you had some time to check out our exporting example. Could you please let us know if it works well for your case?

Looking forward to hearing from you.

Kind regards,
Solomiia

Hello, Ramcy!
 
Thank you for getting back to us.
 
It is possible to customize all available export types. Please note that the different customizations can be applied to different exporting formats depending on the file type. For example, as CSV is a text file, you can't add an image to it.
Please look through all available customizations for export types in our docs: https://www.flexmonster.com/doc/export-report/.
 
You can apply all customizations mentioned in the provided docs using the approach from our previous message.
More details about customizing the Toolbar can be found by the link: https://www.flexmonster.com/doc/customizing-toolbar/.
 
Hope you will find our answer helpful.
 
Kind regards,
Solomiia

Hello, Ramcy!
 
Thank you for getting back to us.
 
Could you please let us know if the described behavior appears in our example?
Please note that the approach of embedding images into the PDF export in the provided JSFiddle is a sample, so you are welcome to use any other approach to add <img> tag to your PDF export header.
 
Looking forward to hearing from you.
 
Kind regards,
Solomiia

Hello, Ramcy!

Thank you for getting back to us.

Could you please provide us with the messages from the browser console, if any?

Looking forward to hearing from you.

Kind regards,
Solomiia

Hello, Ramcy!

Hope you are doing well.

Just checking in to ask if you could provide us with the messages from the dev console so our team can investigate the case further.

Looking forward to hearing from you.

Kind regards,
Solomiia