Link to home
Start Free TrialLog in
Avatar of APS NZ
APS NZFlag for New Zealand

asked on

Problem with <input type=file

I have a form on our website which allows the user to upload a CV to us.  The form declaration has EncType="multipart/form-data", and the field on the form is <input type=file name="FileContents" Size=50>

We are getting a lot of emails from users saying that when they click the browse button the animated "working" icon shows but the system goes off into the wide blue.

We have tried to analyse what is common to the users and have discovered that there is no problem with those using Internet Explorer, but 90% of users using Firefox, Chrome, Safari, Mozilla etc have the problem.

Any ideas??
Avatar of Dave Baldwin
Dave Baldwin
Flag of United States of America image

You need to post your code from the "View Source" for us to help you.  "View Source" is what the browser sees.
Avatar of APS NZ

ASKER

Thanks for the reply Dave.

Its a very simple form (written in ColdFusion - although this part is just HTML).  The problem only occurs when the button on the end of the *FileContents* field is clicked.

See attachment for the code.
FileUpload.txt
Yeah, please post the actual html. I see no reason a browser would hang on a plain html <input>.  It's such a core tag and doesn't do anything fancy.
Oops... our posts crossed.  

Looking at the code it seems possible they're either getting a javascript error.

A) Are you able to reproduce it yourself?
B) Are any of them tech savy enough to check FF's error console?
Avatar of APS NZ

ASKER

Thanks _agx_ - I cannot get the error in IE.  The users do not report an error - just that the file selected never arrives in the field on the form.  This is of course before they would click the *Upload* button, so the JS does not come into play.  

I have encountered the problem myself before in IE when uploading files to Inland Revenue.

Knowing the type of people we are dealing with I don't think they would be savvy enough to check the error console.  I will try to contact one or two to see if they can.
Weird.  Honestly the only time I've ever had problems with file input boxes is on old/slow computers.  If it's happening with a basic <input> just by clicking browse, then it suggests the browser or computer/sw is at fault. Because it's pure html at that point. I can't see any reason it wouldn't work unless the feature was being blocked somehow ...  So stupid question, do those users report the same problem with uploads on other sites?

Also, is this regular http or https?
Avatar of APS NZ

ASKER

I'll have to ask that question.  It's interesting that it does not appear to affect those using IE
Yeah it does seem odd.  But I'd be curious if the problem's consistent or intermittent and if you can glean any other patterns.
"<CCFORM" is not HTML.  Something else must be in the "View Source" because no browser will recognize that.
Looks like he posted the CF source so we can run it and look at the generated html ourselves.
I don't have CF so I can't run it.  I would want to see what his server is generating for the page code anyway.  Browsers don't know anything about CF anyway.
Browsers don't know anything about CF anyway.

Lol, nobody said it did, being a server side language and all ;-)  The comment was just a pleasant hint that he probably assumed most people responding would be in the CF zone and running CF.  I'm sure he'd be happy to post the generated html for you if he gets a chance.
The question is also in the HTML zone.  When you see differences in the way the browsers act, it is most often found in the page code found in the "View Source" because that's what the browser sees.

I look at all the zones because questions are often not really about the specific technology.  In the .NET and PHP zones, people often post server side code also.  When they post the "View Source", you find out whether their server code is working properly.  Sometimes it's not working because some piece of code or data is missing.
Yeah I'm very familiar with the process and believe me we're on the same page. It was just a polite way of saying have patience, I'm sure he'll get to it ;-)  I'd have posted it myself, but I'm not near CF right now.

Anyway, just fyi cfform is just a wrapper of a plain html <form> tag with a little extra javascript validation thrown in.  I doubt you'll find anything unusual in the html as he's using a plain <input> tag anyway. But you're welcome to look at it when the OP gets a chance to post it.

Edit: @jdthedj - Though it doesn't seem like you need a <cfform> anyway, since you're using any <cfinput> fields. May as well just use a plain <form>.
Avatar of APS NZ

ASKER

Thanks for all the discussion.  I have attached the *View Source* code.

@_agx_ I have always used cfform as a matter of habit. I wrote my own cf editor and it puts it in automatically.
FileUpload-2.htm
If that is the "View Source" in your browser, it shouldn't be running in any browser.  Did you open that thru an editor before posting it?  If so, please try again and save it directly and do not open it with anything but a plain text editor before you post it again.
Avatar of APS NZ

ASKER

I'm a bit confused.  I right-clicked in the browser and chose "View Source", then saved the file to disk.  Is that not correct?
I am almost certain you did something more.  The way that file is formatted is to display HTML in the browser, not to run it.  All the tags are replaced with HTML entities and each line is contained inside a div.  I just looked at that in IE and I think you clicked on "Formatted HTML View" when what we need is "HTML Source... Ctl+S".  Yes, I just tried it on my home page and that's what happened.  Try again, just use the first option "HTML Source... Ctl+S".
Avatar of APS NZ

ASKER

Thanks Dave - I have attached the new file.
FileUpload-3.htm
SOLUTION
Avatar of Dave Baldwin
Dave Baldwin
Flag of United States of America image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
ASKER CERTIFIED SOLUTION
Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of APS NZ

ASKER

I was in the process of replying when _agx_ added his comment.  I was going to say that I would change to getElementByID, but as pointed out the Javascript does not come into play when the use clicks the "browse" button.
True, but form.elements is kind of old school syntax ;) Unless you have to support really old browsers like IE4, I think it's better to use getElementById.

Are you positive the user's problem is with browse? Are you able to reproduce the problem?
Avatar of APS NZ

ASKER

The users indicate that the problem is with browse - they say control never comes back and the file chosen never appears in the input (file) field.  I cannot reproduce the problem because iot doesn't happen with Internet Explorer.

I emailed 4 people who had the problem asking for more info but they have not replied.
I didn't have any problem with Browse in Firefox11.  

I did notice that some of your javascripts are before the <head> element and although they may work there, they should really be inside the <head> element.  Also, there were no end tags like </body> and </html> so I was wondering if there was still something missing.

It would be better if you could give a link to check that page because some of your javascript isn't available this way.  If there is a problem with javscripts interfering with each other, we can't check that this way.
Avatar of APS NZ

ASKER

http://www.advancedpersonnel.co.nz/a/reg_step3.cfm.  Normally the user has filled in other forms to get there.
I cannot reproduce the problem because iot doesn't happen with Internet Explorer.

Yeah, but you can test it yourself with a diff browser like FF/Chrome/... right? There's no point using IE if you know it doesn't exhibit the problem.

I tried it with FF11, Safari 4, Opera 10 and had no problems with the browse button.  Only the javascript error mentioned earlier.
Avatar of APS NZ

ASKER

Thanks _agx_  Unfortunately at work we're not allowed to download other browsers etc.  Did the JavaScript actually throw an error that would be obvious to the user or just like IE with a small triangle in the task bar?
I uploaded a PDF file and didn't get any error this time.  Unless you are really tracking that page, I would remove the Google Analytics code.
Did the JavaScript actually throw an error that would be obvious to the user or just like IE with a small triangle in the task bar?

Only in one browser:

- In Opera 10, it displayed a popup message when the page loaded. But that's because your site is missing the /CFIDE mapping. So if you're using cfform validation, ajax, etc... anywhere on the site it won't work.

       JavaScript - http://www.advancedpersonnel.co.nz/CFIDE/scripts/masks.js
       Linked script not loaded

- In FF 11 nothing was visible until I displayed the error console:
     ie Tools > Web Developer > Error Console

- Safari 4 didn't throw any errors at all


       Unfortunately at work we're not allowed to download other browsers etc.

Oh boy .. if it's a public site that's downright silly.  Developers need access to the same tools as the typical visitor or they can't do their job ie properly test the site.
Yes, _agx_ is right.  Having only one browser to test a public site is kind of crippled.
Avatar of APS NZ

ASKER

Thanks for the continued help.  I have now changed the code on the form to be a plain form rather than cfform, and also changed the Javascript to getElementByID.

I agree with the need to have more browsers to test in, but the boss won't budge!

I'm not sure how to fix the Opera problem - I will have to talk to our web host company.

@Dave  - The Google Analytics code is embedded on each page by a template included at the top.
I'm not sure how to fix the Opera problem - I will have to talk to our web host company.


They need to create a virtual mapping for your web root or copy /CFIDE beneath your web root.
http://livedocs.adobe.com/coldfusion/8/htmldocs/help.html?content=webservmgmt_6.html

I agree with the need to have more browsers to test in, but the boss won't budge!

I know it's like talking to a wall sometimes, but ..  aside from preventing you from doing your job, it also makes the site look bad.  Visitors have short attention spans.  When critical features don't work, many users just leave and never come back.  So it ultimately loses the company business - something most bosses care about  ;-) Edit: Not to mention all the extra time you'll end up spending trying to diagnose problems in the dark. It all adds up to wasted money.  I know you know all this .. but some bosses don't always see the connection.
Avatar of APS NZ

ASKER

Interestingly since I fixed the Javascript etc there have been no reported issues with uploading files.  I'm thinking the messages from users have not been quite correct in identifying the problem in the first place.

Thanks to both of you for your help with this.
Users tell you what they think they see which is really all they can do.  I've seen often that it may not have anything to do with the 'real' problem.  Glad to help.