title: What is FormControl used for? Why is it used? How Should it be used?
body: <p>Can someone explain to me in layman's terms what function FormControl serves, and why/how one would want to use it?</p>
  
  <p>I'm using Material-UI in React, and many of the form examples I see make use of FormControl, but I'm having a hard time understanding what it does, and if it's necessary or not for my project.</p>
  
  <p>Right now I simply have a Component named Form.js and I'm containing all my form elements in a div like this:</p>
  
  <pre><code>return (
  &lt;div&gt;
    &lt;FormControl className={classes.formControl}&gt;
      &lt;InputLabel htmlFor="select-multiple-accounts"&gt;Account&lt;/InputLabel&gt;
      &lt;Select
        multiple
        value={accountName}
        onChange={handleAccountChange}
        input={&lt;Input id="select-multiple-accounts" /&gt;}
        renderValue={
          selected =&gt; (
          &lt;div className={classes.chips}&gt;
            {
              selected.map(value =&gt; (
              &lt;Chip key={value} label={value} className={classes.chip} /&gt;
            ))}
          &lt;/div&gt;
        )}
        MenuProps={MenuProps}
      &gt;
        {accountNames.map(name =&gt; (
          &lt;MenuItem key={name.label} value={name.label} style={getStyles(name.label, accountName, theme)}&gt;
            {name.label}
          &lt;/MenuItem&gt;
        ))}
      &lt;/Select&gt;
    &lt;/FormControl&gt;
    &lt;br /&gt;&lt;br /&gt;
    &lt;TextField
      id="job-number"
      label="Job #"
      className={classes.textField}
      value={props.jobNumber}
      onChange={handleJobNumberChange}
      fullWidth
    /&gt;
    &lt;br /&gt;&lt;br /&gt;&lt;br /&gt;
    &lt;TextField
      id="project-description"
      label="Project Description"
      placeholder="Provide a detailed description of the project:"
      className={classes.textField}
      multiline
      variant="outlined"
      value={props.projectDescription}
      onChange={handleProjectDescriptionChange}
      fullWidth
    /&gt;
  &lt;/div&gt;
    );
  }
  </code></pre>
  
  <p>Is this ok? or am I supposed to be wrapping everything in a FormControl? If so.. can you please explain why? I'm not sure what the best practices are when coding a form into a React web application. I'm new to React Forms.</p>
  
  <p>Thanks.</p>