CODEWITHSUNDEEP
redux-form
Misiur
Misiur

Reputation: 5297

Redux form successful async validation

Redux form async validation is quite nice, however I want to somehow indicate that the asynchronous validation has succeeded. Basically what I want:

  1. Field is empty, don't show async success
  2. Field is getting filled, normal sync validation is happening, don't show async success
  3. Field loses its focus, async validation starts, don't show async success
  4. a) Async validation returns error, show it
  5. b) Async validation succeeds, show async success

However all I have is asyncValidating prop, and I can't change local state in render method. I could dispatch redux action and keep every field async success state, but I use redux-form exactly to avoid managing form state myself.

I've hacked a little example here, by passing "true" as an error value and showing "success" message when the async validation passes.

Upvotes: 0

Views: 932

Answers (1)

Misiur
Misiur

Reputation: 5297

Ah, missed this one.

const usernameHasValidated =
  username.touched && // field has been visited and blurred
  username.valid &&   // field has no error
  !asyncValidating;   // not currently validating

Works just fine.

Upvotes: 2

Related Questions