Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Material UI TextField event for field leave

Is there an event for leaving the field or loosing focus in the Material UI TextField?

I need two events, one for entering and one for leaving the field. Entering the field can be handled by using onFocus, but is there also one for leaving, i.e. onFocusLost or onUnfocus? The following code segment show the current use, missing the event for loosing focus.

<TextField
    value={this.state.fieldFirstName}
    onChange={(e: any) => this.onChangeFieldFirstName(e.target.value)}
    onFocus={() => this.onFocusFieldFirstName()}
/>

Versions in use:

  • Node v13.8.0
  • npm 6.13.6
  • "@material-ui/core": "4.6.1"
  • "react": "16.11.0"
  • "react-dom": "16.11.0"
  • "@types/react": "16.9.11"
  • "@types/react-dom": "16.9.4"
like image 486
Socrates Avatar asked Jan 01 '23 07:01

Socrates


1 Answers

<TextField
value={this.state.fieldFirstName}
onChange={(e: any) => this.onChangeFieldFirstName(e.target.value)}
onFocus={() => this.onFocusFieldFirstName()}
onBlur={() => this.onBlurField()}/>

Use onBlur event this will solve your problem

like image 103
Umut Yalçın Avatar answered Jan 07 '23 11:01

Umut Yalçın