[Solved]-I use React js and Material-UI. How can i validate "correct" green color validation on button submit click?-Reactjs

const { RaisedButton, MuiThemeProvider, getMuiTheme, TextField } = MaterialUI;

 class Test extends React.Component {

  state = {
    value: 'good',
    error: false,
    successValidation: false
  }

  handleInputChange = (e, newValue) => {
    // reset errors and validation as well
    this.setState({
        value: newValue, 
      error: false,
      successValidation: false
     });
  }

  isValid = () => {
    const {value} = this.state;
    return value != 'bad';
  }

  onSubmit = () => {
    if(this.isValid()) {
        this.setState({successValidation: true, error: false});
    } else {
        this.setState({error: true});
    }

  }

  render = () => {
    const {value, error, successValidation} = this.state;
    const underlineStyle = successValidation ? { borderColor: 'green' } : null;
    return (
      <div style={{width: '50%', margin: '0 auto'}}>
        <h3>The input "bad" will cause error</h3>
        <h3>All other input will cause green underline on submit</h3>
        <TextField 
          errorText={error ? 'Validation error!' : ''}
          name="test" 
          value={value} 
          onChange={ this.handleInputChange }
          underlineStyle={underlineStyle}
         />
        <RaisedButton onClick={ this.onSubmit }>Submit</RaisedButton>
      </div>
    );
  }

}

const App = () => (
  <MuiThemeProvider muiTheme={getMuiTheme()}>
    <Test />
  </MuiThemeProvider>
);

ReactDOM.render(
  <App />,
  document.getElementById('container')
);