redux-form-validation-utils v1.0.5

Creating Forms

To create form, use Redux-Form package http://redux-form.com/

Form validation

Short Form - Field validation

For short forms, which will not overflow user's viewport, we can use Field's validate prop along with validateField function and add an array of validator functions as an argument.

Example:

<Field
  name="username"
  validate={validateField([isRequired, isEmail])}
  label="Email"
  component={Input}
/>

Long Form - Form validation

If the form is too long to fit into the user's viewport we will use validateForm.

In order to get global error message with number of errors and ability to do the "error hopping", we also need to add the scrollToError function on onSubmitFail.

reduxForm({
  form: 'components',
  validate: validateForm({
   email: [isEmail, isRequired],
   password: [isRequired],
  }),
  onSubmitFail: scrollToError
})