This still not a trivial task given the patchwork of code pieces floating around. When writing a route finder app I came up with the following solution
# html
<form id="myform" enctype="multipart/form-data" action="upload.php" method="POST" target="_parent">
<input type="hidden" name="uuid" value="1"/>
<input id="myfile" type="file" name="file" style="display: none;"/>
<input type="submit" value="send" style="display: none;"/>
</form>
# query javascript that starts the upload
$("input[id='myfile']").click();
# upload.php
# note the redirect with javascript not with php allows to pass state parameters
$uuid=htmlspecialchars($_POST["uuid"]);
$uf = basename($_FILES['file']['name']);
$fn='data/'.$uuid.'.gpx';
if (move_uploaded_file($_FILES['file']['tmp_name'], $uf)) {
rename($_FILES['file']['name'],$fn );
file_put_contents ($fn , $txt, FILE_APPEND );
echo '<script type="text/javascript">window.parent.location = "index.php";</script>';
}
The upload needs a quick refresh of the webpage (which could be avoided by posting to an hidden iframe and controlling response by an ajax call). The download doesn’t need a refresh:
# note the combined get and post commands
# don't know why this is necessary
$.ajax({
data: "uuid="+fn,
type: "post",
url: "download.php",
success: function() {
window.location = 'download.php?uuid='+fn;
}
});