Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Generating a report with Ajax #20

Open
danielalejandromatheus opened this issue Aug 3, 2018 · 6 comments
Open

Generating a report with Ajax #20

danielalejandromatheus opened this issue Aug 3, 2018 · 6 comments

Comments

@danielalejandromatheus
Copy link

Can I generate a report with an Ajax request?
I'm using JQuery's ajax method to pass the data to my controller, it gets to the server but the response is odd, is there a way to generate the report in a pop-up window o a blank window?

@Jimmy-JS
Copy link
Owner

Jimmy-JS commented Aug 7, 2018

@hitostacha Can you provide a source code to this issue?

@ArtyomBist
Copy link

On frontend side set responseType: 'arraybuffer' , and add to url param
I'm using Axios:

        let config = { responseType: 'arraybuffer' };
        axios.post('frontend/generateCountReport', your_data, config)
        this.downloadFilePDF(response.data, 'report');

        downloadFilePDF(response, filename) {
            // It is necessary to create a new blob object with mime-type explicitly set
            // otherwise only Chrome works like it should
            let newBlob = new Blob([response], {type: 'application/pdf'});

            // IE doesn't allow using a blob object directly as link href
            // instead it is necessary to use msSaveOrOpenBlob
            if (window.navigator && window.navigator.msSaveOrOpenBlob) {
                window.navigator.msSaveOrOpenBlob(newBlob);
                return
            }
            // For other browsers:
            // Create a link pointing to the ObjectURL containing the blob.
            const data = window.URL.createObjectURL(newBlob);


            let link = document.createElement('a');
            link.href = data;
            link.download = filename + '.pdf';
            link.click();
            setTimeout(function () {
                // For Firefox it is necessary to delay revoking the ObjectURL
                window.URL.revokeObjectURL(data)
            }, 100)
        }

@danielalejandromatheus
Copy link
Author

@skortabeast are you retrieving the Stream of the PDF as a normal string or a encoded base64 string?

@danielalejandromatheus
Copy link
Author

Also, are you displaying the PDF document or downloading it?
I managed to get it working opening a new blank window, and appending the stream to an iFrame, but I doubt this is the best way to get this working
@Jimmy-JS
This is my JS code

$.ajax({
                        url: '/generatepdfurl',
                        method: 'POST',
                        data: data,
                        contentType: false,
                        processData: false,
                        success: function(data){
                            let pdfWindow = window.open("");
                            pdfWindow.document.write("<iframe style='border: none;' width='100%' height='100%' src='data:application/pdf;base64, " + encodeURI(data)+"'></iframe> <style> body{margin:0;}</style>")
                        }
                }

@ArtyomBist
Copy link

@hitostacha downloading it, and appending the stream to an iFrame, but I doubt this is the best way to get this working - it's working for you?

@NirvashType0
Copy link

NirvashType0 commented Feb 7, 2019

I have the same issue, im getting ajax response stream() but it show a bunch of symbols and letters so I think im not handling correctly the ajax response to display de pdf stream, Im using this code inside my done function

var pdfWin= window.open("data:application/pdf;base64, " + data, '', 'height=650,width=840');

It opens a new windows but just print this code:

error

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants