View pdf report from ajax request

Question

I have a problem generating a pdf with the TCPDF library, and tried to follow some examples that are here, but I have not managed to solve my problem, which is this: when I click on a button I am making an AJAX request Which sends a parameter and the url points to a controller in php with CODEIGNITER, the parameter is used to execute my query and generate the report based on it. I have already debugged the report with static parameters to see if it worked and without using AJAX, and everything went well. The problem is that I need to send the data this way and I do not know how to load the pdf file created in the response of my request, any ideas?

$("#BtnDownload").click(function (){
    var jsonString = 2; //Example parameters;
        $.ajax({
          type: 'POST',
          url: baseurl+"reports/selectReport",
          data: {'data': jsonString},
          success: function(response){
           //What my driver should return
          }
        });
 });

This is the function in my controller that I point my ajax request, I do not put all the code of the layout of my report because it is working, and the code is very long, the important thing is to know how to return my generated report And can view it from the browser.

public function selectReport(){
      $this->load->library('Pdf');
        $pdf = new Pdf('L', 'mm', 'A4', true, 'UTF-8', false);
        $pdf->SetCreator(PDF_CREATOR);
        $pdf->SetTitle('report');
        $pdf->SetSubject('Report PDF');
        $pdf->SetKeywords('TCPDF, PDF, example, test, guide');
        $pdf->SetDefaultMonospacedFont(PDF_FONT_MONOSPACED);
        $pdf->SetMargins(PDF_MARGIN_LEFT, PDF_MARGIN_TOP, PDF_MARGIN_RIGHT);
        $pdf->setPrintHeader(false);
        $pdf->setFooterData($tc = array(0, 64, 0), $lc = array(0, 64, 128));
        $pdf->setFooterFont(Array(PDF_FONT_NAME_DATA, '', PDF_FONT_SIZE_DATA));
        $pdf->SetFooterMargin(PDF_MARGIN_FOOTER);
        $pdf->SetAutoPageBreak(TRUE, PDF_MARGIN_BOTTOM);
        $pdf->setImageScale(PDF_IMAGE_SCALE_RATIO);
        $pdf->SetFont('dejavusans', '', 12, '', true);
        
        $base_url = base_url();
        $data = $this->input->post("data");

        // report body

      
        $name_pdf = utf8_decode("report.pdf");
        $pdf->Output($name_pdf, 'I');
    }

Dont send back the PDF. Send back a URL to the PDF. Then redirect to the URL, or whatever floats your boat. — Brian Gottier, Aug 23 '17 at 20:41
I showed an example of what I meant. I hope you find it useful. — Brian Gottier, Aug 23 '17 at 21:28

Brian Gottier · Accepted Answer · 2017-08-24T05:19:45.770

1

In TCPDF ( according to TCPDF Save file to folder? ) the PDF can be saved:

$dir = 'pdfs/';
$filename = 'report' . microtime(TRUE) . '.pdf';

if( ! is_dir( FCPATH . $dir ) )
    mkdir( FCPATH . $dir, 0777, TRUE );

$pdf->Output( FCPATH . $dir . $filename, 'F'); // F saves to filesystem

Since you know the PDFs are in the pdf directory:

$this->load->helper('url');
echo json_encode(array(
    'path' => FCPATH . $dir . $filename,
    'url'  => base_url( $dir . $filename )
));

Then in your ajax success function data.url is the URL to the file:

success: function(response){
    if( response.url ){
        window.location = response.url;
    }
}

Make sure your $.ajax has the configuration for dataType: 'json'.

$.ajax({
    // ...
    dataType: 'json'
    // ...
});

edited Aug 24 '17 at 05:19

answered Aug 23 '17 at 21:11

Brian Gottier

4,522
3
21
37

1

I do not understand the operation of FCPATH, when coupled with my base_url – max Aug 23 '17 at 23:10
Yep, you're right. Sorry, that doesn't belong. I fixed my answer. FCPATH only applies to the file location where it is saved. The URL shouldn't have it in there. – Brian Gottier Aug 23 '17 at 23:13
1

Now nothing happens ... I made a console.log in the success of my ajax and neither does anything, – max Aug 24 '17 at 03:46
FYI, if the pdfs directory does not exist, there will be an error. Create the pdfs directory and try again. – Brian Gottier Aug 24 '17 at 03:49
1

If the folder exists .. and check all that, since I removed FCPATH, nothing happens, when I was still redirecting to a wrongly wrong url .. but now it does nothing – max Aug 24 '17 at 04:00
You'd normally get at least some kind of raw response. Check your browsers developer tools, and go to the Net tab. Find the request after you do it, and look at the response there. You'll probably see some kind of PHP error or something. – Brian Gottier Aug 24 '17 at 04:03
Doing only one console.log a response, I get the following: TCPDF ERROR: Unable to create output file: http://localhost/imagen-app/assets/report.pdf, When I do a response.url returns me "undefined" on the console, I think there is the problem – max Aug 24 '17 at 04:25
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/152692/discussion-between-brian-gottier-and-max). – Brian Gottier Aug 24 '17 at 04:26
Does the /imagen-app/assets/ directory exist? – Brian Gottier Aug 24 '17 at 04:27
If there is, When I do a response.url returns me "undefined" on the console, I think there is the problem – max Aug 24 '17 at 04:28
It's probably undefined because the response is corrupted with a PHP error. – Brian Gottier Aug 24 '17 at 04:30

View pdf report from ajax request

1 Answers1