I want to save the image generated on the server. For this I use iframe, but the File Save dialog does not appear after the click. What am I doing wrong?
index.php
<html>
<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script>
$(document).ready(function() {
$('#onv-save-button').click( function() {
$.ajax ({
url: "/ajax.php",
type: "POST",
success: function(data) {
$('#downloadFrame').attr('src' , data);
}
});
});
});
</script>
</head>
<body>
<iframe src="" id="downloadFrame" ></iframe>
<button id="onv-save-button">Go!</button>
</body>
</html>
ajax.php
<?
// Some actions to generate image
echo "1.png" ;
?>
I did. Here is the answer to the question.
index.php
<html>
<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script>
$(document).ready(function() {
$('#onv-save-button').click( function() {
$.ajax ({
url: "/ajax.php",
type: "POST",
success: function(data) {
alert(data);
$('#downloadFrame').attr('src' , "download.php?file=" + data);
}
});
});
});
</script>
</head>
<body>
<iframe src="" id="downloadFrame" ></iframe>
<button id="onv-save-button">Go!</button>
</body>
</html>
ajax.php
<?
echo $_SERVER["DOCUMENT_ROOT"]."/1.png";
?>
download.php
<?php
$content = file_get_contents($_REQUEST['file']);
header('Content-Description: File Transfer');
header("Cache-Control: ");
header("Pragma: ");
header("Content-Disposition: attachment; filename=\"".basename($_REQUEST['file'])."\"");
ob_end_clean();
ob_start();
echo $content;
ob_end_flush();
exit();
?>