title: Returning textfield value with material ui and reactjs
body: <p>Just started learning React and I'm not sure how to get the value back from my textfield when I hit the submit button.  I'm following the examples here: <a href="https://material-ui-next.com/demos/dialogs/" rel="nofollow noreferrer">https://material-ui-next.com/demos/dialogs/</a> but they never cover how to get the value of the textfield.  I've tried a bunch of ways, but keep getting undefined for the value.  Here is my current code:</p>
  
  <pre><code>import React from 'react';
  import ReactDOM from 'react-dom';
  import Button from 'material-ui/Button';
  import TextField from 'material-ui/TextField';
  import { withStyles } from 'material-ui/styles';
  import PropTypes from 'prop-types';
  import Dialog, {
    DialogActions,
    DialogContent,
    DialogContentText,
    DialogTitle,
  } from 'material-ui/Dialog';
  import InsertLinkIcon from 'material-ui-icons/Link';
  import ReactTooltip from 'react-tooltip'
  import Icon from 'material-ui/Icon';
  import IconButton from 'material-ui/IconButton';
  
  
  const button = {
    fontSize: '60px',
    paddingRight: '20px',
    paddingLeft: '20px',
  }
  
  const inlineStyle = {
    display: 'inline-block',
  }
  
  export default class addTorrentPopup extends React.Component {
  
    state = {
      open: false,
    };
  
    handleClickOpen = () =&gt; {
      this.setState({ open: true });
    };
  
    handleRequestClose = () =&gt; {
      this.setState({ open: false });
    };
  
    handleSubmit = () =&gt; {
        this.setState({ open: false });
        let magnetLinkSubmit = this.state.textValue;
        console.log("Sending magnet link: ", magnetLinkSubmit);
        ws.send(magnetLinkSubmit);
    }
  
    render() {
      const { classes, onRequestClose, handleRequestClose, handleSubmit } = this.props;
      return (
        &lt;div style={inlineStyle}&gt;
          &lt;IconButton onClick={this.handleClickOpen} color="primary" data-tip="Add Magnet Link" style={button}  centerRipple aria-label="Add Magnet Link" &gt;
          &lt;ReactTooltip place="top" type="light" effect="float" /&gt;
          &lt;InsertLinkIcon /&gt;
        &lt;/IconButton&gt;
          &lt;Dialog open={this.state.open} onRequestClose={this.handleRequestClose}&gt;
            &lt;DialogTitle&gt;Add Magnet Link&lt;/DialogTitle&gt;
            &lt;DialogContent&gt;
              &lt;DialogContentText&gt;
                Add a Magnet Link here and hit submit to add torrent...
              &lt;/DialogContentText&gt;
              &lt;TextField
                autoFocus
                margin="dense"
                id="name"
                label="Magnet Link"
                type="text"
                placeholder="Enter Magnet Link Here"
                fullWidth
              /&gt;
            &lt;/DialogContent&gt;
            &lt;DialogActions&gt;
              &lt;Button onClick={this.handleRequestClose} color="primary"&gt;
                Cancel
              &lt;/Button&gt;
              &lt;Button onClick={this.handleSubmit} color="primary"&gt;
                Submit
              &lt;/Button&gt;
            &lt;/DialogActions&gt;
          &lt;/Dialog&gt;
        &lt;/div&gt;
      );
    }
  
  };
  </code></pre>