Enhanced forms

[zwergius]

I want to use enhanced forms and think it's all very neat apart from one little thing which I believe degrades the experience when you do have js enabled.

The inability to use bind:value when having an enhanced form is preventing me from using an enhanced form - I need to preview what is input in the form to see how things look before submitting the data.

I think this could be sorted by adding some kind of default value as the ActionData (what I have below is not working)
export let form: ActionData = { entries: [{ text: '', amount: '' }], recipientId: '' }

This initial ActionData object should probably be setup in the exported actions.

Hope to see this in a not too distant future 🙌

[eltigerchino]

The inability to use bind:value when having an enhanced form

This isn’t the case. How does it prevent you from using bind:value?

[zwergius]

Yes ok so I did not mention that I have a dynamic form where I can add/remove rows - which means that when I disable js then and add /remove a row then what I have previously entered in the form is lost.

The same would be the case if I validated a field on the server cause the value is now bound not to what I return from my action but to the id, which won't be there since js is disabled...

[eltigerchino]

Unless I’m missing something, this should still work with js disabled. SSR will populate the id variable with form if it exists and render the page with that value

[zwergius]

Unfortunately that isn't the case...

[eltigerchino]

If you provide a reproduction, it'll be easier to find the root cause of the issue you're facing.

[zwergius]

So creating this reproduce helped me narrow down the issue a bit - I was using a <select> to test this and it seems to be the select in Firefox that is affected by this somehow. Here is a reprod:

https://github.com/zwergius/enhanced-form-bind

Steps:

npm run dev
open localhost in firefox
disable js
then in url address field hit enter to reload

See that the text: "Form input value2" and select is showing 1, select should be showing 2

Very much an edgecase now that it's narrowed down, bad luck that this was the exact thing I was trying 🙄