Up- and download in a single page application

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;
  }
});