Validating dynamic sub components

[crazyUI]

HI,

How can we use this mixin to validate dynamic sub components ? Is there a way to pass the sub component validation status to the parent component ?

Appreciate your help

Thank you

[jurassix]

Can you provide a small code sample? I assume you mean something like:

The Parent component is wrapped with the Validation library but the Children are not?

<Parent>
  <Child/>
  <Child/>
</Parent>

[crazyUI]

Parent component is wrapped with the validation library. Do the child components need to be wrapped with separate validation library.. Or we can call the parent validation library methods from the child component as well ?

For example,

Parent - Has one text input field which cannot be empty Child - Has three number fields which has some other validation requirements

Can I include all validations in the parent or need to have separate validationTypes and methods in the child component as well..

Thank you!

[jurassix]

@crazyUI I think the best implementation will be to pass as props from the Parent the following props:

<Parent>
  <Child onChange={this.onChange.bind("child")}
              value={this.state.child}
              hasError={this.props.isValid("child")}
              />
</Parent>

In this way the only the Parent is wrapped with the validation library, but the children are given control to display the error to change the value and the parent can hook into the onChange handler to update state and validation.

I do this in projects where the Child may be Input component from react-bootstrap etc...

[luyanchun]

<Child onChange={this.onChange.bind("child")}

          value={this.state.child}

          hasError={this.props.isValid("child")}

          />

in this way, how to show the error message? if there are three input in the Child，there will be three of theme all with error message? or i have to cotrol the error msg

and also，when the parent form will be submit，how to call the validation method of the child?

[jurassix]

If you are validating N fields in the child just pass down the isValid and getValidationMessages functions to the Child. Be sure to expose the data to the parent.

Currently talking through options in another thread: #66