CODEWITHSUNDEEP
reactjsmaterial-ui
user16716191
user16716191

Reputation:

How to see if a user has clicked off a TextField in MUI

Using material-ui's TextField, how do I check if a user has clicked off the TextField/has finished editing it? I don't want to use onChange as I don't want it to be activated every time something has happened as I only want to send a POST request once a user has confirmed they have finished editing by going off the TextField. If this isn't possible would it be a bad practice to send a POST request every time onChange is called?

Upvotes: 0

Views: 2397

Answers (1)

Shri Hari L
Shri Hari L

Reputation: 4894

You can listen to onBlur event.

const handleOnBlur = (e) => {
    alert("Left text box with the value: " + e.target.value);
};

<TextField
        onBlur={handleOnBlur}
        id="outlined-basic"
        label="Outlined"
        variant="outlined"
/>

Note: If you want to fire POST request whenever the text changes, you can read about debounce

Refer: Perform debounce in React.js

Upvotes: 1

Related Questions