Question

Using Javascript I would like to show a working/loading image once a user hits submit on my form. The form is used to upload video’s so it can take a while for the file to upload. Once the file is done uploading the page reloads so the loading image would not need to be visible anymore.

Can anyone help me with this please?

<form method="POST" enctype="multipart/form-data" action=""> 
<input type="hidden" name="MAX_FILE_SIZE" value="5120000" /> 
<input type="hidden" name="upload" value="yes"> 

First Name: <input type="text" name="firstname"><br> 

Email: <input type="text" name="email"><br> 

Email Confirmation: <input type="text" name="email2"><br> 

Video Title: <input type="text" name="title"><br> 

Video Description: <input type="text" name="description"><br> 

Video to upload: <input type="file" name="uploadedfile"><br> 

Terms: <input type="checkbox" name="terms"> Must be checked to accept our terms of service.<br><br> 

<input type="submit" value="Upload Video"> 

</form> 

Answer 1

Using jquery: you can use as follow within document.ready

$("form").submit(function() { //you can assign id to your form and used that id instead of form
$("#iamgeid").show();
return true;
});