Receiving AJAX submitted Javascript's FormData object

Phoenix Forum Questions / Help
,
1

When I try to AJAX-submit a form using JS FormData, like specified e. g. here:

I receive:

(Plug.Parsers.ParseError) malformed request, a Jason.DecodeError exception [...]

Do I have to serialise the whole form manually before submitting? Or is there a way to make Phoenix accept FormData stuff?

2

If you send down form data, you should use the content-type multipart/form-data not application/json. If Jason.DecodeError is being thrown Phoenix probably thinks it’s json, which means the content type header is likely the culprit.

2 Likes
3

Thank you for pointing me out in the right direction so quickly. Actually I thought the “Content-Type” header was not set, in accordance with what is explicitly mentioned:

Warning: When using FormData to submit POST requests using XMLHttpRequest or the Fetch_API with the multipart/form-data Content-Type (e.g. when uploading Files and Blobs to the server), do not explicitly set the Content-Type header on the request. Doing so will prevent the browser from being able to set the Content-Type header with the boundary expression it will use to delimit form fields in the request body.

but thanks to your response I quickly found that in fact it was, and moreover it was set to "application/json" indeed.

2 Likes