Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

davb's avatar
Level 1

Laravel 5.5 & jquery displaying dynamically pdfs within modal

Hello everybody. I'm trying to display my pdfs from my laravel via jquery and ajax but somehow I'm not able visualise them and I just end up with the binary but no way to display the pdf. I already tried everything on the web and stack(like enconding base64)and all the given solutions(please don't mark it as duplicate, since no other question/answer has helped me out). php/laravel

public function show_pdf(){
    //$document = Document::findOrFail("simecarta_inviGOBD930903HQTNRV07.pdf");
    /*$project = request('project');
    $id = request('id');
    $kind = request('kind');*/
    //$filePath = $id->file_path;
    $name ="simepostulaGOBD930903HQTNRV07.pdf";
    $fileName = "sime/simepostulaGOBD930903HQTNRV07.pdf";
    //$fileName = $project."/".$project.$kind.$id.".pdf";
    // file not found
    if( ! Storage::exists($fileName) ) {
      abort(404);
    }

    $pdfContent = Storage::get($fileName);
    //$pdfContent = base64_encode($pdfContent);

    // for pdf, it will be 'application/pdf'
    $type = Storage::mimeType($fileName);

    //$fileName   = Storage::name($fileName);


    return Response::make($pdfContent, 200, [
      'Content-Type'        => $type,
      'Content-Disposition' => 'inline; filename="'.$name.'"'
    ]);
}//show pdf 

and my jquery

$('#modal_pdf').modal({
        closable  : false,
        onShow : function() {
            $.post({
                url: 'show_pdf',
                data: {_token: $("input[name=_token]").val(),project: 1, id: 2, kind: 3},
                dataType: 'json',
                success: function (data) {
                    //$('#id_pdf').attr('src','data:application/pdf;base64,'+data);
                    alert(1);
                  console.log(data);
                }, 
                complete: function (data){
                    console.log(data);
                    //pdfText = $.trim(data);
                    //pdfText = atob(data);
                    //var myResponse = eval(data);
                     /*var blob = new Blob([data], { type: 'application/pdf' });

  // create an object URL from the Blob
  var URL = window.URL || window.webkitURL;
  var d = URL.createObjectURL(blob);*/
var htmlText = '<embed width=100% height=100%'+ ' type="application/pdf"'+ ' src="data:application/pdf,'+ escape(data)+ '"></embed>'; 
$("#prueba").html(htmlText);
                },
            });

        },
    }).modal('show').modal('refresh');​

Nothing seems to work out, please help me out!

0 likes
2 replies
jlrdw's avatar

Why not drop the ajax and just display normal, ajax is not the answer to every web thing. May be better off in an iframe.

1 like
davb's avatar
Level 1

thank you for your answer @jlrdw yeah trying

 src="{{ action('DocumentController@show_pdf', ['id'=> 1]) }}"

works fine but as the user is adding dynamically the files and visualizing them; I need to send 3 variables to the function, so how could I do that dynamically or via jquery?

Please or to participate in this conversation.