使用ajax在浏览器中内联显示PDF

Question

I know that this question is already asked many times by different ways. But still i am not able to figure out the answer. I mean i did not find a proper descriptive answer.

I use mpdf library to generate PDF. I post some data of hidden fields to a PHP script by means of ajax.

Following are the code snippets.

//ajax_file

$("#button_id").click(function(e){

var table_clone=$("#table_id").clone();
var tableData=table_clone.prop('outerHTML');//html for pdf generation
dataString='page='+tableData;

$.ajax({
         type: 'POST',
         url: 'pdfgenerator.php',
         data: dataString,
         cache: false,
        success: function(response)
        {
          //what to do here in order to display pdf
         },
         error: function(............){
           .
           .
          }
        });
});

PHP Script

//pdfgenerator.php

<?php
      include('../mpdf/mpdf.php');
      if(/*checking post items are set*/)
       {
         //retriving post items

         $mpdf=new mPDF('c','A4-L');
         $mpdf->WriteHTML($tableData);
         $mpdf->output('xyz.pdf','I');
          exit;
        }
?> 

Following are my constraints

-> I don't want to save file permanently on server (which is possible by means of 'F' option in output()).

-> I have to display it in browser from where it can be downloaded.

PHP script works correctly if called without ajax. Hence it returns correct data but i am unable to display it in pdf inside the browser.

While searching for answers i found that it is not possible by means of ajax. so is there any way around by doing something in PHP or javascript. Please provide a descriptive answer.

Thanks,

Answer 1

You can use this code

$.ajax({
         type: 'POST',
         url: 'pdfgenerator.php',
         data: dataString,
         cache: false,
        success: function(response)
        {
          var tag ='<object width="400" height="500" type="application/pdf" data="'+xyz.pdf+'" id="show_obj1" class="obj"></object>';
          $(#pdfdiv).html(tag);
         },
         error: function(............){
           .
           .
          }
        });
});

Here #pdfdiv in $(#pdfdiv).html(tag); is the id of the div in which you want to show the pdf