Setting Form EncType Dynamically To Multipart/Form-Data In IE (Internet Explorer)

Posted June 27, 2008 at 10:07 AM

Tags: Javascript / DHTML

A while back, I posted an AJAX-Style file upload demo. While using that technique in a current project, I discovered a bit of a bug. In FireFox, you can dynamically set the EncType of a form element to be "multipart/form-data" for file uploads; however, this does not work in Internet Explorer (IE). Apparently in IE, you have to set the "encoding" of the form rather than the "enctype". The good news is, you can set both values without concern and this will take care of the problem:

 Launch code in new window » Download code as text file »

  • // Using jQuery, set both the enctype and the encoding
  • // attributes to be multipart/form-data.
  • $( "form#upload-form" )
  • .attr( "enctype", "multipart/form-data" )
  • .attr( "encoding", "multipart/form-data" )
  • ;

Minor note, but wanted to write this down to help me remember.

Download Code Snippet ZIP File

Post Comment  |  Ask Ben  |  Permalink  |  Other Searches  |  Print Page


You Might Also Be Interested In:




Reader Comments

Jun 27, 2008 at 12:43 PM // reply »
102 Comments

Does firefox also work with "encoding" rather than just "enctype"? Would save you an extra line :).


Jun 27, 2008 at 12:47 PM // reply »
6,516 Comments

@Gareth,

I actually didn't even check that.

The angel in me would prefer to stay with "enctype" as that is what the name of the attribute actually is and therefore what the real "intent" of the attr() function is meant to be.... but if all browsers worked with "encoding", the devil in my might not care ;)


Feb 11, 2009 at 8:59 AM // reply »
1 Comments

Thanks Ben for documenting this behavior of IE. I was breaking my head for quite sometime to find out why my AJAX file upload is not working in IE.

Regards
Sudar


Feb 11, 2009 at 10:08 AM // reply »
6,516 Comments

@Sudar,

Glad to help! Yeah, it was really frustrating coming up against this for the first time.


Mar 13, 2009 at 9:23 AM // reply »
1 Comments

in opera and firefox also work whit "encoding". Thanks for the tip!


Mar 13, 2009 at 9:28 AM // reply »
1 Comments

thanks for the tip. this has saved me hours of recoding!


Mar 19, 2009 at 1:30 AM // reply »
1 Comments

Thank you very much.


May 12, 2009 at 11:36 PM // reply »
5 Comments

Ahh, I really wish this was higher up in Google when search terms are something like "ie dynamically create upload form" or "ie upload form bug", woulda saved me a lot of time. Thanks for documenting this.


May 13, 2009 at 7:29 AM // reply »
6,516 Comments

@Anon,

Well, I'm glad you made it here eventually, even if a little delayed :)


May 15, 2009 at 4:44 PM // reply »
1 Comments

Thanks, helped one I had the inspiration to google it!


Aug 14, 2009 at 12:21 PM // reply »
1 Comments

Thanks, now working...


Aug 17, 2009 at 2:10 PM // reply »
6,516 Comments

@Mon, @yoyok,

Awesome fellas. Glad to help.


Aug 23, 2009 at 11:12 PM // reply »
1 Comments

Thanks for the useful post, save me lots of time.


Post Comment  |  Ask Ben

Recent Blog Comments
Nov 20, 2009 at 11:32 PM
Five Months Without Hungarian Notation And I'm Loving It
I've used headless camel case for years for not only ColdFusion variables, but also SQL tables and fields... pretty much everything involving code. I also subscribe to the "don't abbreviate and clea ... read »
Nov 20, 2009 at 11:00 PM
Five Months Without Hungarian Notation And I'm Loving It
@Marcel, Yeah, I always err on the side of longer but more readable variable names. As for the camel casing of CF methods and the headless camel casing of custom items, I get around this by always ... read »
Nov 20, 2009 at 10:56 PM
Five Months Without Hungarian Notation And I'm Loving It
I use the following and love it: my.namespace.MyComponents.functionMethodsOrUDF() CONSTANT_VALUES_OR_PROPERTIES One thing I always try is to CamelCaseBuiltInColdFusionFunctions() so others can tell ... read »
Nov 20, 2009 at 5:38 PM
Learning ColdFusion 8: CFImage Part I - Reading And Writing Images
Hi Ben, Great article. I've been looking around to see if ColdFusion image engine can programatically create the following "wrap around" effect: http://www.creativepro.com/article/photoshop-s-she ... read »
Nov 20, 2009 at 5:35 PM
Maintaining ColdFusion Sessions Across SMS Text Message Requests Without Cookies
@Dave: I talked to Gert he suggested: <cfhttp method="get" url="http://{some cf website}" result="stuff" addtoken="yes" /> Note the addition of cfhttp attribute addtoken. That should persist y ... read »
Nov 20, 2009 at 5:23 PM
Maintaining ColdFusion Sessions Across SMS Text Message Requests Without Cookies
@Todd, Ahh, gotcha, yeah that makes sense. ... read »
Nov 20, 2009 at 5:17 PM
Maintaining ColdFusion Sessions Across SMS Text Message Requests Without Cookies
Ben, sorry if I didn't make this clear. You can make it work like that if you want, just put <cfset session.foo = 1> (and <cfset application.foo = 1>) in your OnRequestStart() and it reve ... read »