Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

jQuery Form Plugin, really doesn't work in IE #302

Closed
ericwang14 opened this issue Mar 21, 2013 · 10 comments
Closed

jQuery Form Plugin, really doesn't work in IE #302

ericwang14 opened this issue Mar 21, 2013 · 10 comments

Comments

@ericwang14
Copy link

I really don't know how can let this Plugin works in IE, If the server response 202, and the response content-type: application/json, the IE tries to download the response.

If server response 505, the response body are gone, I can get nothing in the error handle function.

I really don't know how to use it!! IT IS IE PROBLEM OR PLUGIN DEFECT?
@malsup
Copy link
Collaborator

malsup commented Mar 22, 2013

Is this a form with a file upload?

@ericwang14
Copy link
Author

yes, a form with file upload

@malsup
Copy link
Collaborator

malsup commented Mar 22, 2013

Then it helps to understand exactly what the plugin is doing. Since IE < 10 does not support ajax file uploads, the plugin simulates the user experience by submitting the original form with the response targeted to a dynamically created iframe. When the iframe loads the server response, the plugin extracts the response and invokes callback handlers.

In the case where the server responds with a header content-type set to "application/json" that trigger's IE's default download behavior. To avoid this, do not set the content-type header to "application/json". Leave it as text/html or text/plain.

In the case where the server has an actual error it will return an error response page with appropriate status codes set in the response header. This presents two problems for the plugin:

  1. it cannot access the response headers
  2. it cannot determine from the response body whether or not the request was successful

A potential solution, if you have control over the error response page, is to add attributes on the body element that the plugin will look for. The plugin will attempt to access "status" and "statusText" attributes on the response's body element. So if your error page includes something like <body status="500"> then your error handler will be triggered.

Hope this helps.

@malsup malsup closed this as completed Mar 22, 2013
@ericwang14
Copy link
Author

Thanks for you explain malsup.
Actually I did like your suggestion.

  1. use text/html or text/plain instead of 'application/json'.
  2. fully control for the error response, I add error message in the successful response body, and then extract and handle it.

Its just need do little hack for the IE, just not happy with this.

@scottord
Copy link

Thank you, malsup, for the detailed explanation - I was able to change the response header of the web service that was not working in IE<=9 and everything's working now!

@ishanjain123
Copy link

Hello Malsup,

Actually I have a problem in upload the file in IE -7,8,9. Can you please let me know how to fix it ? It works fine in other browsers.

Thanks

@ericwang14
Copy link
Author

Hi ishanjain123,

Which kind of problem you're facing now? Can you give us some more details?

@janwidmer
Copy link

Hey Malsup,
I am also trying to work around the IE9 Limitation with an ajax file upload and as soon as I set the content-type to text/html or text/plain, I get a 406 Not Acceptable Error back when I try to upload a file. Any suggestion?

Could you explain what adding a textarea to the response should help?
(Mentioned here: http://malsup.com/jquery/form/#file-upload)

Thanks for any inputs
Jan

@rekhabadri
Copy link

Hi,

Can anyone help to understand, why IE is unable to process the Request Header parameters?

From Mentioned url: http://malsup.com/jquery/form/#file-upload, when I tried to set Request Header parameter as below

(function() {
$('form').ajaxForm({
beforeSend: function(e) {
e.setRequestHeader('token', 'euejrhzkehrkherkhekr');
},
dataType : 'json',
success: function() {
alert("file uploaded successfully");
}
});
})();

IE unable to get the request header token. whereas other browsers like chrome and firefox are able accept the headers.

Thanks.

This was referenced Feb 21, 2017
Closed
Closed
Closed
Closed
@vibs2003
Copy link

vibs2003 commented Nov 14, 2017 •
edited
Loading

Hello @malsup,

i am not able to post files using jquery form plugin in IE 9. could you please help me?

Actually it is hitting the action method with files but not able to return response from server. it gives an error "Server cannot append header after HTTP headers have been sent."

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
7 participants
@malsup @janwidmer @ericwang14 @scottord @ishanjain123 @rekhabadri @vibs2003