Geek Answers Handbook

Attempting to upload a nonexistent file in Internet Explorer, the form is not submitted

I have a form with input type=file . Internet Explorer allows the user to enter whatever they want into this input (while Firefox invokes a file selection). If the user enters an explicitly invalid name, for example:

 a

and trying to submit the form, Internet Explorer doesn't even try to submit the form.

Is there a way to find out what happened and tell the user that this is happening with a warning?

+4
internet-explorer upload submit
source share
3 answers

I found a better way to do this: http://www.priddypictures.co.uk/reference/fileInputProblem.htm

So, if these guys / tacks are right, and the form fines, if there is no name attribute on the input, then:

  • write a jQuery plugin that will (if Internet Explorer) remove the name attribute from all input files
  • insert another hidden input into the form with the correct name
  • copy value from file input to hidden input

I can write this plugin at some point.

+1
source share

You must add the onclick () event to the submit button, which calls a JavaScript function that checks your status and uses a JavaScript warning to let the user know that they need to enter something worth sending.

Learn regular expressions for your tests.

If you want the user to make a decision, use confirm() .

If you just want to warn them and not check their meaning, you can use something like:

 <input type="submit" value="clickme" onClick="if (confirm('Really submit?')) { this.form.submit(); }">

Here is an example of code that will give you the value from a JavaScript function call in onclick() :

 <html> <head> <title>hello world</title> <SCRIPT LANGUAGE="javascript" type="text/javascript"> function show_me(form_elem) { alert(form_elem.value); } </script> </head> <body> <form method="GET" name="upload_form" action="index.html" target="_top"> <input type="file" name="file_name" size="14" maxlength="256" value=""> <br> <input type="submit" value="mybutton" onclick="show_me(this.form.file_name)" /> </form> </body> </html>
+1
source share

You could simulate Firefox behavior as follows:

 <input type="file" name="test" onkeypress="this.click();return false;">

When the user tries to enter a file input, he displays a selection file.

Obviously, this will not work if the client has JavaScript disabled, but depending on your requirements, it may be "good enough."

There is an opportunity to work in IE 6, 7 and 8.

It works fine in Firefox 3 (since it doesn't allow typing on <input type=file> ).

It works fine on Safari for Windows 3 and 4 (since it doesn't allow printing to <input type=file> ).

In Opera 9 (which allows you to enter text <input type=file> ), it does nothing (does not pop up the selection or swallow keystrokes). The onkeypress event does not seem to fire at all, possibly for security.

In Firefox 2, it does not work (which allows printing to <input type=file> ), because this.click() does not expose the this.click() , and return false swallows keystrokes.

0
source share

More articles:


All Articles