close

How get data from material-ui TextField, DropDownMenu components?

Hello Guys, How are you all? Hope You all Are Fine. Today we are going to learn How get data from material-ui TextField, DropDownMenu components? in javascript. So Here I am Explain to you all the possible methods here.

Without wasting your time, Let’s start This Article.

How get data from material-ui TextField, DropDownMenu components ?

  1. How get data from material-ui TextField, DropDownMenu components?

    get data from material-ui TextField, DropDownMenu components Faced to this issue after a long time since question asked here. when checking material-ui code I found it's now accessible through inputRef property.

  2. get data from material-ui TextField, DropDownMenu components

    get data from material-ui TextField, DropDownMenu components Faced to this issue after a long time since question asked here. when checking material-ui code I found it's now accessible through inputRef property.

Method 1

add a ref attribute to your <TextField /> component and call getValue() on it, like this:

Component:

<TextField ref="myField" />

Using getValue:

this.refs.myField.getValue()

Method 2

Faced to this issue after a long time since question asked here. when checking material-ui code I found it’s now accessible through inputRef property.

Then Access value like this.

...
<CssTextField
  inputRef={(c) => {this.myRefs.username = c}}
  label="Username"
  placeholder="xxxxxxx"
  margin="normal"
  className={classes.textField}
  variant="outlined"
  fullWidth
/>
...
  onSaveUser = () => {
    console.log('Saving user');
    console.log(this.myRefs.username.value);
  }

Summery

It’s all About this article. Hope all method helped you a lot. Comment below Your thoughts and your queries. Also, Comment below which method worked for you? Thank You.

Leave a Comment