Question

I’m using this javascript to limit the extension of the file type when uploading:

function TestFileType( fileName, fileTypes ) {
if (!fileName) return;

dots = fileName.split(".")
//get the part AFTER the LAST period.
fileType = "." + dots[dots.length-1];

return (fileTypes.join(".").indexOf(fileType) != -1) ?
alert('Correct File Type Function Here') :
alert('Wrong File Type Function Here');
}

with

<input name="replay_file" id="replay_file" type="file"/> 
<input type="submit" id="upload_file" value="Upload" name="uploadReplay" onClick="TestFileType(this.form.replay_file.value, ['w3g','.w3g']);" />

I want it to alert (the wrong file type) and then reload the page (so that it cancels the upload instead of wasting time) but so far i only can get the alrert box to work but not the page reload function after that, the page reload won’t work i even tried goto url and windows location but it won’t work and will just continue uploading the file after the alert box:

return (fileTypes.join(".").indexOf(fileType) != -1) ?
null() :
alert('Warcraft III replay file (.w3g) allowed only!');window.location.reload();
}

Am i missing something or will it just won’t work this way when it comes to file uploading?

Answer 1

Use onsubmit event to cancel the form in case the extension is not correct, like this:

function TestFileType( fileName, fileTypes ) {
if (!fileName) return;

dots = fileName.split(".")
//get the part AFTER the LAST period.
fileType = "." + dots[dots.length-1];

if (fileTypes.join(".").indexOf(fileType) != -1) {
   //alert('Correct File Type Function Here');
   return true;
} else {
   alert('Wrong File Type Function Here');
   return false;
}
}

with the onsubmit event connected on your form element:

<form onsubmit="return TestFileType(this.form.replay_file.value, ['w3g','.w3g']);" ...