Disabling file input field cancels upload

An interesting little “feature” I stumbled across: when the file input field of an HTML form is disabled right before a submission, that field will be empty. Some pseudo code which illustrates the setup:

...
<script>
function submitForm(){
  var form = document.getElementById("form");
  var file = document.getElementById("file");
  file.disabled = true;
  form.submit();
}
</script>
<body>
<form id="form">
<input id="file" type="file" onchange="submitForm()">
</form>
...

One might want to disable the file selection button during an ongoing submission in order to stop the user from accidentally selecting a different file before the upload has finished. In that case, the file selection input field must be disabled after the form submission has been triggered.

Leave a comment

This site uses Akismet to reduce spam. Learn how your comment data is processed.