Submit Formwith AJAX Using ENCTYPE="multipart/form-data"

[vunet.us]

Hi all,
I am converting my app to AJAX-based. I have a form that submits some
data including images. When I use AJAX XmlHttpRequest I am unable to
submit the form with ENCTYPE="multipart/form-data" (error 500).
Without ENCTYPE="multipart/form-data", everything goes well. I think
there is a header I must use in addition, but I cannot seem to find a
good solution. Can you suggest? Thank you.

Here is a part of xmlhttp request where I set header:
....
this.req.setRequestHeader("Content-Type", "application/x-www-form-
urlencoded; charset=UTF-8");
this.req.send(arguments[3]);

[Tom Cole]

On Mar 19, 11:07 pm, [e-mail] wrote:

Hi all,
I am converting my app to AJAX-based. I have a form that submits some
data including images. When I use AJAX XmlHttpRequest I am unable to
submit the form with ENCTYPE="multipart/form-data" (error 500).
Without ENCTYPE="multipart/form-data", everything goes well. I think
there is a header I must use in addition, but I cannot seem to find a
good solution. Can you suggest? Thank you.

Here is a part of xmlhttp request where I set header:
...
this.req.setRequestHeader("Content-Type", "application/x-www-form-
urlencoded; charset=UTF-8");
this.req.send(arguments[3]);

Well there are more issues than that...You can set your multipart/form-
data header all day long, but your javascript code is still not going
to have access to the file data, only the file name. There are other
methods for this (like hidden iframes) that you should investigate if
your goal is not to refresh the view of the current page.

[vunet.us]

On Mar 20, 9:33 am, "Tom Cole" <[e-mail]:

On Mar 19, 11:07 pm, [e-mail] wrote:

Hi all,
I am converting my app to AJAX-based. I have a form that submits some
data including images. When I use AJAX XmlHttpRequest I am unable to
submit the form with ENCTYPE="multipart/form-data" (error 500).
Without ENCTYPE="multipart/form-data", everything goes well. I think
there is a header I must use in addition, but I cannot seem to find a
good solution. Can you suggest? Thank you.

Here is a part of xmlhttp request where I set header:
...
this.req.setRequestHeader("Content-Type", "application/x-www-form-
urlencoded; charset=UTF-8");
this.req.send(arguments[3]);

Well there are more issues than that...You can set your multipart/form-
data header all day long, but your javascript code is still not going
to have access to the file data, only the file name. There are other
methods for this (like hidden iframes) that you should investigate if
your goal is not to refresh the view of the current page.

If I submit my form the normal html way, with ENCTYPE="multipart/form-
data", everything works well. But I need the equivalent in AJAX. I do
not understand how iframes may be related to my problem. I want to do
a simple AJAX form submission using ENCTYPE="multipart/form-data"...
Thanks.

[Tom Cole]

On Mar 20, 8:42 am, [e-mail] wrote:

On Mar 20, 9:33 am, "Tom Cole" <[e-mail]:

On Mar 19, 11:07 pm, [e-mail] wrote:

Hi all,
I am converting my app to AJAX-based. I have a form that submits some
data including images. When I use AJAX XmlHttpRequest I am unable to
submit the form with ENCTYPE="multipart/form-data" (error 500).
Without ENCTYPE="multipart/form-data", everything goes well. I think
there is a header I must use in addition, but I cannot seem to find a
good solution. Can you suggest? Thank you.

Here is a part of xmlhttp request where I set header:
...
this.req.setRequestHeader("Content-Type", "application/x-www-form-
urlencoded; charset=UTF-8");
this.req.send(arguments[3]);

Well there are more issues than that...You can set your multipart/form-
data header all day long, but your javascript code is still not going
to have access to the file data, only the file name. There are other
methods for this (like hidden iframes) that you should investigate if
your goal is not to refresh the view of the current page.

If I submit my form the normal html way, with ENCTYPE="multipart/form-
data", everything works well. But I need the equivalent in AJAX. I do
not understand how iframes may be related to my problem. I want to do
a simple AJAX form submission using ENCTYPE="multipart/form-data"...
Thanks.

Okay, you can't.

[vunet.us]

On Mar 20, 10:00 am, "Tom Cole" <[e-mail]:

On Mar 20, 8:42 am, [e-mail] wrote:

On Mar 20, 9:33 am, "Tom Cole" <[e-mail]:

On Mar 19, 11:07 pm, [e-mail] wrote:

Hi all,
I am converting my app to AJAX-based. I have a form that submits some
data including images. When I use AJAX XmlHttpRequest I am unable to
submit the form with ENCTYPE="multipart/form-data" (error 500).
Without ENCTYPE="multipart/form-data", everything goes well. I think
there is a header I must use in addition, but I cannot seem to find a
good solution. Can you suggest? Thank you.

Here is a part of xmlhttp request where I set header:
...
this.req.setRequestHeader("Content-Type", "application/x-www-form-
urlencoded; charset=UTF-8");
this.req.send(arguments[3]);

Well there are more issues than that...You can set your multipart/form-
data header all day long, but your javascript code is still not going
to have access to the file data, only the file name. There are other
methods for this (like hidden iframes) that you should investigate if
your goal is not to refresh the view of the current page.

If I submit my form the normal html way, with ENCTYPE="multipart/form-
data", everything works well. But I need the equivalent in AJAX. I do
not understand how iframes may be related to my problem. I want to do
a simple AJAX form submission using ENCTYPE="multipart/form-data"...
Thanks.

Okay, you can't.

Really? Oh, so you gave me a hint that if I use a hidden iframe to
submit data the normal html way, then it is a solution for me... isn't
it?