mobx-react-form icon indicating copy to clipboard operation
mobx-react-form copied to clipboard

How to keep field defaults updated to current values?

Open all-iver opened this issue 7 years ago • 6 comments

Say I have a form that's mapped to a model's fields. After submitting the form I want the dirty fields to be updated so that the saved values are no longer considered dirty. As far as I can tell, I need to update the field defaults to the saved values. With nested fields it gets pretty cumbersome because I can't just do something like form.update_defaults(saved_values). How can I easily map my model's updated values back onto the field defaults after a save?

Say with a schema like this:

fields = [ name: {}, email: {}, address: { fields: [{ line1: {}, line2: {}, city: {}, ... }] ]

In onSuccess() I can do form.values() to get all the dirty values, and after saving successfully I can do something like _assign(myModel, values) to update my model to the new values. But I can't see an easy way to get the new values into each field's defaults without some weird iteration and name mangling. Am I misunderstanding something about this workflow?

all-iver avatar Nov 16 '17 03:11 all-iver

I think you need .set('default', { ... })

foxhound87 avatar Nov 16 '17 14:11 foxhound87

Aha, that does seem to work, thanks! I didn't understand what those functions did from the documentation. I just changed it to:

form.set('default', values)

all-iver avatar Nov 16 '17 17:11 all-iver

It seems that set('defaults', values) does not trigger a field's input converter to run. If I do field.default = value then my input converter runs, but if I do form.set('defaults', values) the default value ends up as a pre-converted object instead, which means the field thinks it's dirty again (since field.value does not equal field.default). Am I still doing something wrong?

all-iver avatar Nov 16 '17 23:11 all-iver

Note that you have to use default and not defaults.

I don't know if I don't understood your message, but I would do just:

form.set('default', form.values())

foxhound87 avatar Nov 19 '17 13:11 foxhound87

Oops, that was just a typo on my end. It is default and not defaults. The problem is that if the default is set using form.set(), it does not have the field's input function applied to it, but doing field.default = value does apply the input function. This might be related to #337?

all-iver avatar Nov 20 '17 02:11 all-iver

i have: const formHash = { fields: [ "id", "rank", "images", "images[].id", "images[].rank", "images[].imageUrl", "images[].image", "images[].isMain" ],

when i set values, if the values not have "images[].image" field in it, i can't display image field. it says: The selected field is not defined (image)

newStyleForm = new Form({ ...formHash, values })

kapilpipaliya avatar Jun 28 '18 20:06 kapilpipaliya