I’m using a hidden iframe to do file uploads without a page reload. The problem is that posting to the iframe creates an entry in the browser’s history, meaning that any clicks on the Back button try to reload these requests, not the current page. This gets especially problematic because a certain kind of error that can be returned from the iframe results in the form being submitted again automatically, without the user clicking “Submit.” The script is complicated, but here’s an approximation:
HTML:
[code=html]<form method=”post” id=”theform” action=”upload_process.php” enctype=”multipart/form-data” target=”theiframe”>
<input type=”file” id=”thefile” name=”thefile” />
<!– (Submit is triggered elsewhere) –>
</form>
<iframe id=”theiframe” name=”theiframe” class=”hidden”></iframe>
JavaScript:
[CODE]//Some event handler
function doFormSubmit() {
var theform = document.getElementById(‘theform’);
theform.submit();
}
function handleReturn(code) {
switch (code) {
case ‘ok’:
//Do a bunch of stuff
break;
case ‘special’:
//Do special stuff and resubmit
theiframe.location.replace(‘/blank.html’); //The automatic resubmit doesn’t seem to trigger without this; thought it would also fix history; no go
doFormSubmit();
break;
}
}
And the iframe target upload_process.php:
[code=html]<!–Do all the processing–>
<html>
<head>
<script type=”text/javascript”>
window.parent.handleReturn(somecode);
</script>
</head>
</html>
So what can I do to handle the back button madness?