Error text for Components other than TextField and SelectField

Question

i am implementing a simple form with fields to collect data. i need to implement validation on a few fields like textfield, checkbox and radio buttons.

As per documentation the prop to use is 'errorText'

As per the spec at the site(http://www.material-ui.com/v0.11.1/#/components/switches) there's no property supporting it.

But we do have this for textboxes.(http://www.material-ui.com/v0.11.1/#/components/text-fields)

<TextField hintText="Hint Text"  errorText={this.state.errorText}  onChange={this._handleErrorInputChange} />

So anyone with prior experience in this can help out as to how they have implemented this or am i just missing something basic?

Answer 1

Well, you're gonna have to implement your own error message.. I suggest you to create a component what wraps the Checkbox or any other material-ui component that don't have the errorText property and implement it there..

Something like:

const MyCheckbox = (props) => {
    return (
        <div>
            <Checkbox
              {...props}
            />
            <div className='error-text'>{props.errorMessage}</div>
        </div>
    )
}