I have one TextField and PrimaryButton in my form.
On button click i want to validate textfield.If there is no value then fire requiredfield validation on button click and display message same as display on onGetErrorMessage event.
I know validation is fire onBlur event but i want to fire validation on button click.
How can i do it?
First you have to use refs
to your TextField
<TextField ref={(input) => { this.textInput = input; }} label='test' />
Now you can set onGetErrorMessage
on click using refs
onClick(e){
if(this.refs.input.value == undefined || this.refs.input.value == null || this.refs.input.value == '')
this.refs.input.onGetErrorMessage = "you error message"
}
Update 1: Check out this code snippet
class FormExample extends React.Component {
constructor() {
super();
this.state={
inputError:''
}
this.ValidateText = this.ValidateText.bind(this)
}
ValidateText(e){
this.setState({
inputError:this.input.value?'':'testing'
})
}
render() {
return (
<div>
<div>
<TextField
ref={(input) => { this.input = input; }}
label="Name"
errorMessage={this.state.inputError}
/>
<input type='button' value='Submit'
onClick={this.ValidateText} />
</div>
</div>
);
}
}