By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
435,595 Members | 3,721 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 435,595 IT Pros & Developers. It's quick & easy.

Upload button and Submit at one time

P: n/a
I have a simple form that does nothing more than let the visitor
choose an image from their hard drive, and then upload it to the
server. It doesn't have any other fields than the <input
type="file"...field and, currently, a submit button. It's really
part of a larger form, but it's called in as an iframe so it's
technically a stand-alone form.

My question is, is it possible to submit the form as soon as the image
is selected, so that they won't have to click the Submit button? I
started playing with it and can probably make it work with onBlur, but
that's not exactly right because it still requires that second click
of the mouse.

TIA,

Jason
Jan 5 '08 #1
Share this Question
Share on Google+
2 Replies


P: n/a
VK
On Jan 5, 2:50 pm, Jason Carlton <jwcarl...@gmail.comwrote:
My question is, is it possible to submit the form as soon as the image
is selected, so that they won't have to click the Submit button?
From the usability point of view it is a questionable approach: people
are making wrong selection and it is nicer to leave for the them a
chance for the last moment correction. Nevertheless you are the boss.
You may use onchange event handler:

<form method="POST" action="upload.cgi" enctype="multipart/form-data">
<input type="file" name="file01" onchange="this.form.submit()">
<noscript><input type="submit" value="Submit"></noscript>
</form>
Jan 5 '08 #2

P: n/a
On Jan 5, 10:50*am, VK <schools_r...@yahoo.comwrote:
On Jan 5, 2:50 pm, Jason Carlton <jwcarl...@gmail.comwrote:
My question is, is it possible to submit the form as soon as the image
is selected, so that they won't have to click the Submit button?

From the usability point of view it is a questionable approach: people
are making wrong selection and it is nicer to leave for the them a
chance for the last moment correction. Nevertheless you are the boss.
You may use onchange event handler:

<form method="POST" action="upload.cgi" enctype="multipart/form-data">
* <input type="file" name="file01" onchange="this.form.submit()">
* <noscript><input type="submit" value="Submit"></noscript>
</form>
Excellent, thank you!

FWIW (and just in case anyone reads this later with the same plan),
the visitor only has one image that they can upload, and it's being
saved on the server as their username; thus, each time they upload a
pic it will rename the existing one to username-backup.jpg, and then
the new one is named username.jpg. This way, I can add a button to
revert back to the original one if they don't like the new one (which
would just delete username.jpg and rename username-backup.jpg to
username.jpg).

Thanks again,

Jason
Jan 6 '08 #3

This discussion thread is closed

Replies have been disabled for this discussion.