asked on February 23, 2021
Hello Team,
Export to PDF option is not working in FM 2.8.25.
We are using Custom Datasource api.
On exporting the file, it does get saved into pdf format.
However, when opening the file it throws an error 'There was an error opening this document. The file is damaged and could not be repaired.'
Attached screenshot for reference.
Thanks,
Tanushree
⋅ February 24, 2021
Hi Tanushree,
Thank you for posting your question.
So far, we haven't managed to reproduce the described behavior either with version 2.8.25 or with the latest v. 2.8.27.
Do you think you could provide us with a sample where such behavior is reproducible?
Looking forward to your response.
Regards,
Mykhailo
⋅ February 25, 2021
Hi Mykhailo,
Attaching fiddle to display the custom code we are doing to display different filename for the pdf file: https://jsfiddle.net/025smgj9/4/
However, I couldn't reproduce the exact scenario in the fiddle when the pdf gets corrupted while saving.
But even after adding a page with text "Hello World", it doesn't show either.
Just so you know we are embedding Flex Monster inside Jx Browser as it is a desktop application.
Whereas for the fiddle, we are downloading the pdf in Chrome browser.
Do you think this could be the reason?
Any pointers would be appreciated.
Thanks,
Tanushree
⋅ February 25, 2021
Tanushree,
We've done some tests with JxBrowser on our side and still haven't managed to reproduce the described behavior – the Flexmonster instance accessed through JxBrowser returns a valid PDF document.
That being said, we'd like to address the way you're modifying the Flexmonster Toolbar functionality: instead of modifying the object prototype (which is not recommended), please use the `beforetoolbarcreated` event handler, as suggested in our Toolbar customization guide.
We hope this helps.
Best regards,
Mykhailo
⋅ February 25, 2021
Hi Mykhailo,
I'm using beforetoolbarcreated event handler in my case as well (as shown in the fiddle: https://jsfiddle.net/025smgj9/4/)
If I don't use the object prototype then what are other ways in which I can grab 'type' of export and attach custom filename (containing timestamp) and orientationType inside beforetoolbarcreated handler?
If you can edit the fiddle with your suggested approach then that would be great.
Also, I am aware that you are using jsPDF 1.5.3 to create and save PDF files.
In my sample I tried attaching a new page with dummy text to the PDF but it doesn't get added:
flexmonster.exportTo("pdf", {destinationType: 'plain', filename: timestamp + "." + type}, function(res) {
let pdf = res.data;
pdf.addPage();
pdf.text(20, 20, 'Hello world!');
pdf.save(timestamp + "." + type);
});
I checked that "res.data" returns the correct data as shown in the report. It is only when the pdf is saved it gets corrupted.
Is there any issues with this version of jspdf.min.js library?
Thanks,
Tanushree
⋅ February 25, 2021
Hi Mykhailo,
I have another update.
I can see that jspdf.min.js which is embedded inside Flex Monster libraries is causing the PDF to be corrupted.
The following steps helped in generating pdf normally:
1. Replaced jspdf.min with another variant under flexmonster/lib (attached js file for reference), Source: https://unpkg.com/browse/jspdf@1.5.3/dist/
2. Added custom handler for export pdf inside beforetoolbarcreated event handler:
exp.menu[5].handler = function(type){
consoleLog('export type: ' + type);
let fund = '2005';
let params = {destinationType: 'plain', filename: fund + '_' + timeStamp + '.' + type, pageOrientation: 'landscape'};
toolbar.pivot.exportTo("pdf", params, function(res) {
let pdf = res.data;
pdf.save(fund + '_' + timestamp + '.' + type);
})
};
3. I also had to add a script tag in our index.html:
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.5.3/jspdf.min.js"></script>
Appreciate if you could look into this and is it possible to release a specific version of FM containing the shared jspdf script?
Thanks,
Tanushree
⋅ February 26, 2021
Hi Team,
We would also like to share our actual data which needs to go into the pdf so that you can load this data from your server and test out the working of PDF export.
However, since it is our actual data I cannot share it on public forum.
It would be good if you could provide a dedicated email address to share the JSON data, probably LGIM account manager's email address.
The last email I received for Dev license was from Tetiana Lebiga.
Let me know if it's fine to send the file to her email address.
Thanks,
Tanushree
⋅ February 26, 2021
Hi Tanushree,
Answering your first question, you can find the necessary toolbar tab and its submenu item by searching the corresponding array for the necessary title or id.
See the following sample for reference: https://jsfiddle.net/flexmonster/9mbdq82h/.
Speaking of sending over your data, feel free to send it to Tetiana – she will pass it to us for testing.
Regards,
Mykhailo
⋅ February 26, 2021
Thanks Mykhailo,
I have shared the file with Tetiana but it seems she is OOO and returning office on March 10th.
In her absence who is the next available contact to share the file?
Thanks,
Tanushree
⋅ March 3, 2021
Hello, Tanushree,
Thank you for providing the additional data.
We would like to kindly explain that we have not managed to reproduce the issue on our end using the provided data.
Please see the following sample project that we have created in the process (please see "pivot-desktop.zip" in the attachments below).
Since you mentioned that you are using Flexmonster in a Desktop application, we used an Electron application.
Also, you mentioned that you are using the custom data source API. Hence, we used our custom data source API implementation for the data source - Flexmonster Data Server.
Please run the following commands to start the sample project:
npm i
npm run
The Flexmonster initialization logic is available in pivot-desktop/src/index.html.
We hope this helps to get everything working. Please let us know if the sample project works fine for you.
Kind regards,
Vera
⋅ March 4, 2021
Hi Vera,
Thanks for getting back to me.
I did try to follow the above steps by installing electron, npm i and npm start but I get an error in your sample app as it couldn't connect to your server.
Attached screenshot for reference.
I also got error when trying to export to pdf, attached screenshot for reference.
Thanks,
Tanushree
⋅ March 4, 2021
I will also send following endpoints response via email for your response:
members
fields
select
Thanks,
Tanushree
⋅ March 5, 2021
Hello, Tanushree,
Thank you for your reply.
We have double-checked the sample project, and everything works on our end: Flexmonster connects to the data source endpoint, and the PDF exports correctly.
With this in mind, our team kindly suggests the following course of action:
We would like to mention that our custom data source API endpoint is publicly available. Therefore, it is possible that your environment doesn't allow outside connections and blocks the endpoint. Could you please check if there are any errors in Electron's console and share the results with us? The console could be opened via the top menu "View" -> "Toggle Developer Tools". This could help to understand why the connection fails on your end.
Thank you for providing your custom data source API endpoint responses.
Our team will need some time to recreate a similar scenario using the provided responses.
We will notify you as soon as the results are ready.
Thank you, and looking forward to your response.
Kind regards,
Vera
⋅ March 5, 2021
Hi Veera,
Can you please provide an example how export to server works?
I didn't actually get this part:
url: 'your server-side script'
Although the attribute says url but the description refers to 'script'.
We have a Java backend.
Does this mean we have to implement a separate endpoint to send json object to Java backend and it will then generate pdf file?
Or does this refer to a javascript which will generate pdf and save?
Please elaborate on this and correct me if I'm wrong.
Thanks & Regards,
Tanushree
⋅ March 9, 2021
Hello, Tanushree,
Thank you for your question.
Regarding the url parameter in the exportTo() API call:
The url property accepts an URL-endpoint to your server-side script. This could be an endpoint on your Java backend.
When the url is specified and destinationType is set as “server”, the exportTo() API call will send the file data as a POST parameter to the endpoint specified in the url property.
Then on your server in the provided endpoint, you could implement any desired approach to export or save the received binary file data to your data storage.
We hope this helps.
We would also like to mention that our team has modified the Electron sample project provided earlier to use your endpoint responses. With your endpoint responses, export works fine on our end as well. Please consider that exportTo() works the same for all data sources.
We have sent the sample project via email. Could you please let us know if export works fine for you in the sample project?
If the exported file still fails to open, could you please let us know which pdf viewer you are using?
Thank you, and looking forward to your response.
Kind regards,
Vera
⋅ March 10, 2021
Thanks Vera for your inputs.
Your sample electron project is working fine now and it also exporting to pdf correctly.
However it still fails for us in our actual project.
We are using Adobe Reader XI.
Another thing I noticed is that if you try to rename the file during export then it doesn't recognize the file type after saving. This is happening for all export types and is reproducible in your electron project sample.
Can this be fixed?
Thanks,
Tanushree
⋅ March 11, 2021
Hello, Tanushree,
Thank you for the update.
We are happy to hear that the sample Electron project works on your end as well. Since the same pdf export customization logic is used in your project and the sample Electron project, it is not clear to us why the same doesn't work in your actual project.
Do you think you could provide us with your project where the issue is reproducible so that our team could test it on our end? This would help us to understand what could be causing the issue. Any sensitive information could be shared with us via email.
Regarding the issue with the file type not getting recognized:
We would like to kindly explain that we have not managed to reproduce the same behavior on our end.
In the Toolbar customization code snippet that you provided, if all the variables that are used for filename are defined, the file is exported and the file type is recognized correctly:
let param = {
filename: fundCode + "_" + timeStamp + (type === "excel" ? "" : "." + type)
};
if (type !== 'pdf') {
this.pivot.exportTo(type, param);
}
Could you please confirm if this is the case? Please let us know if there is anything that we have missed.
Thank you, and looking forward to your reply.
Kind regards,
Vera