Action doesn't execute after ajax post - php

Question

I'm trying to generate a pdf file with an image and a highcharts image in it.
This is what I do when I click on a button:
('#button').click(function() {
var quizid = <?php echo json_encode($quizid); ?>;
var chart = Highcharts.charts[0];
canvg(document.getElementById('canvas'), chart.getSVG())
var canvas = document.getElementById("canvas");
var img = canvas.toDataURL("image/png");
//document.write('<img src="'+img+'"/>');
// AJAX CALL TO ACTION
$.ajax({
url: '/results/savepdf',
type:"POST",
data: {quizid: quizid, image: img},
success: function(data) {
console.log("ajax call succces");
},
error: function (xhr, ajaxOptions, thrownError) {
alert(xhr.status);
alert(thrownError);
}
});
});
In my action I have:
public function savepdfAction(){
$this->_helper->layout->disableLayout();
$this->_helper->viewRenderer->setNoRender();
if(isset($_POST['quizid']))
$quizid = $_POST['quizid'];
if(isset($_POST['image']))
$image = $_POST['image'];
// SAVE THE PDF OR WORD
// INCLUDE TCPDF LIBRARY
require_once 'tcpdf/tcpdf.php';
try {
// create new PDF document
$pdf = new TCPDF(PDF_PAGE_ORIENTATION, PDF_UNIT, PDF_PAGE_FORMAT, true, 'UTF-8', false);
$pdf->SetCreator(PDF_CREATOR);
$pdf->SetAuthor('Nicola Asuni');
$pdf->SetTitle('TCPDF Example 009');
$pdf->SetSubject('TCPDF Tutorial');
$pdf->SetKeywords('TCPDF, PDF, example, test, guide');
$pdf->SetHeaderData(PDF_HEADER_LOGO, PDF_HEADER_LOGO_WIDTH, PDF_HEADER_TITLE.' 009', PDF_HEADER_STRING);
$pdf->setHeaderFont(Array(PDF_FONT_NAME_MAIN, '', PDF_FONT_SIZE_MAIN));
$pdf->setFooterFont(Array(PDF_FONT_NAME_DATA, '', PDF_FONT_SIZE_DATA));
$pdf->SetDefaultMonospacedFont(PDF_FONT_MONOSPACED);
$pdf->SetMargins(PDF_MARGIN_LEFT, PDF_MARGIN_TOP, PDF_MARGIN_RIGHT);
$pdf->SetHeaderMargin(PDF_MARGIN_HEADER);
$pdf->SetFooterMargin(PDF_MARGIN_FOOTER);
$pdf->SetAutoPageBreak(TRUE, PDF_MARGIN_BOTTOM);
$pdf->setImageScale(PDF_IMAGE_SCALE_RATIO);
$pdf->AddPage();
$pdf->setJPEGQuality(75);
$imgdata = base64_decode('iVBORw0KGgoAAAANSUhEUgAAABwAAAASCAMAAAB/2U7WAAAABlBMVEUAAAD///+l2Z/dAAAASUlEQVR4XqWQUQoAIAxC2/0vXZDrEX4IJTRkb7lobNUStXsB0jIXIAMSsQnWlsV+wULF4Avk9fLq2r8a5HSE35Q3eO2XP1A1wQkZSgETvDtKdQAAAABJRU5ErkJggg==');
$pdf->Image('#'.$imgdata);
$pdf->Image('/images/logo.png', 25, 40, 154, 25, 'PNG', 'http://www.surveyanyplace.com', '', true, 150, '', false, false, 1, false, false, false);
$horizontal_alignments = array('L', 'C', 'R');
$vertical_alignments = array('T', 'M', 'B');
$pdf->Output('example_009.pdf', 'I');
}
catch (Exception $e) {
die ('Application error: ' . $e->getMessage());
}
}
As you can see I just want to show a pdf file without the parameters that were sent (Just to test).
This doesn't work ....
When I try this without the ajax call it works fine ...
I got this response:
TCPDF ERROR: Some data has already been output, can't send PDF file
I searched for the error and read that you have can fix this by putting ob_end_clean(); before your $pdf->Output('example_009.pdf', 'I');. And when I did that I got another reponse that you can watch here.

Answer 1

Since a .pdf file is binary data, you shouldn't use an Ajax request. After a quick search I found this jQuery plugin:
jQuery Plugin for Requesting Ajax-like File Downloads
It's a very small function and it generates a temporary form with hidden fields that it submits. Maybe not the most beautiful solution, but it should work. Haven't tested it though...