Confusing Http bug

[psb]

Hi,

I have a confusing Http bug that I am struggling to debug or work-around and I’m hoping someone can help me out.

I have a form that is submitted to the server via a Http.request. The form is complex and can have a video and multiple images as part of the form, so it’s a multipart post request; however, the simplest valid form is just with one field filled out (the ‘name’ field). So, the confusing parts:

The form with just the name field filled in does not work. The Http request gets cancelled by Elm. This is what Chrome tells me. In Firefox, the post request is not even registered in the terminal. With Chrome the data gets through to the server before the cancellation, but with Firefox it doesn’t. When the request gets cancelled, the browser (Elm?) reloads the page (a get request for the form page is registered by the server).

If I fill out any other field in the form (text, video or images) then the post request succeeds and is not cancelled. This only works if actually enter something on the form.

If I hard code a model field (a text field/input) in the Elm code to what it would be if I set it via the actual form, like above, then the request gets cancelled. The same is true if I hard code another json value alongside the name field.

I cannot Debug.log the Http request. I have also tried changing the request body from multipart to json if there are no videos or images, but it still fails.

Http.post requests seem to be getting through to the server, but I need to use Http.request to add headers, so it seems to be specific to Http.request.

Any help or insight would be greatly appreciated.

Thank you,

Paul.

[Atlewee]

I might be wrong, (have not used elm/html since elm-ui came abut a year ago).
Are you using Html.form element ?
And using Http.request on submit?
Might the problem be that the default submit action is triggered together with your manual Http.request?
If that is the case, I would drop using any form html element and see if that works better… (using onClick to trigger a Http.request that you have full control over)
Or… I would ofcourse use elm-ui where the form element does not even exist

What headers do you need to set? Maybe they are not allowed… have you tried Http.riskyRequest ?

[psb]

Thank you, @Atlewee! You were exactly right. I now remember that I developed about 95% of the form under a div and then changed it to a form later. Changing it back to a div has solved the problem.

And there’s me trying to be all semantic

[berend]

Not using a form means the default Enter key won’t work, i.e. submit the form. But that might not be an issue for your form.

[psb]

Thanks for the tip about the Enter key, @berend. It’s not really an issue for me at the moment; however, I might come back to it in the future.