Skip to content

Added formState.setFields method to be able to update multiple fields at once #91

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 1 commit into
base: master
Choose a base branch
from

Conversation

frontendr
Copy link

First of all, thank you very much for this great package! It's an absolute breeze to work with!

One thing I've been missing is the ability to set the values of multiple fields at once. One example for this is when the data is loaded from the server. Currently one must set each field individually in a loop and then all those fields are also marked as touched which is not the case then.

So there was a need to be able to set the values of fields in the state but also manage their touched and validity state and while we're at it we could also set errors.

Just setting values is simple:

const values = { name: "john" };
formState.setFields(values);

But to be able to change the touched or validity state or set errors a second options argument can be provided:

const values = { name: "" };
formState.setFields(values, {
  // mark all fields as not touched:
  touched: false
  // mark specific fields as invalid:
  validity: {
    name: false
  },
  // set errors:
  errors: {
    name: "this field is required"
  }
});

Actually setting the validity of a field to false when also providing an error for it is redundant so I took the liberty of marking fields for which errors are provided as invalid if and only if no validity option is passed.

The same goes for setting the validity of a field to true. If a field is valid then you probably don't want to show an error so those are cleared if and only if no errors option is passed.

I did my best to make this PR as complete as possible:

  • Added multiple tests
  • Updated the index.d.ts file. (Please check it because I'm no TypeScript expert!)
  • Updated the README.md.

Hope you appreciate it!

Kind regards,
Johan

…ield values, their errors and their touched and validity state.
@frontendr
Copy link
Author

Hi @wsmd,

Is there anything I can do for this issue? Just double checking just to make sure I'm not forgetting to do something :-)

@markerikson
Copy link

Yep, would love to see this merged!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants