Access field errors from parent

Continued from: http://stackoverflow.com/questions/42145302/promote-a-field-error-to-a-form-error?noredirect=1#comment71566856_42145302

Sometimes, errors cannot be DOM children of input fields. A common example is when an error must be displayed above the entire form because there is no space to put the error in the DOM as a peer or child. To achieve this, knowing whether the field has been touched is also required by the parent. While this is achievable in a lengthly mapStateToProps, I propose we offer a helper pattern to make this simpler.

Alternatively, we could create a dummy node & create a portal to it from the child, but then the developer loses functionality of how to show the errors (since it would always be last rendered).

[mattkrick]

Yes, that addition sounds reasonable. The anytouched does work because, for example, imagine a credit card form with a number and expiry field. Both have an error because they’re null. After I enter a valid number, then the number is touched with no error but expiry has an error but is not touched. I want the form error to be blank in this case because everything that has been touched has no error.

On Feb 13, 2017 1:16 PM, “Erik Rasmussen” [e-mail] wrote:

Do you only want to display the error of the touched field(s)? Or would the anyTouched prop http://redux-form.com/6.5.0/docs/api/Props.md/#-anytouched-boolean- help?

If you want to limit it to only touched fields, then it sounds like you are requesting some sort of getTouchedFields(state) selector that returns an array of field names that you could combine with the existing getFormSyncErrors(state) selector http://redux-form.com/6.5.0/docs/api/Selectors.md/.

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/erikras/redux-form/issues/2585#issuecomment-279524918, or mute the thread https://github.com/notifications/unsubscribe-auth/AFQjvzqmrgDKTG2eVtdbfgrBWshtPpJVks5rcMg7gaJpZM4L_gBI .

[erikras]

Do you only want to display the error of the touched field(s)? Or would the anyTouched prop help?

If you want to limit it to only touched fields, then it sounds like you are requesting some sort of getTouchedFields(state) selector that returns an array of field names that you could combine with the existing getFormSyncErrors(state) selector.