title: React edit form creating
body: <p>I just started working with React, stuck on editing form. I need to prefill the inputs, but also to be able to edit it. If I put defaultValue, I can't put value on input element. At this moment I can type in inputs but I have to edit both fields(form has two fields) in order to save both values. How I am supposed to do it ?</p>
  
  <p>Example:
  I have recipe name and ingredients, I open modal with edit form, it's prefilled, I add some ingredients but leave the name untouched. It saves:</p>
  
  <pre><code>{name: "", ingredients: ing1,ing2,newIngredient}
  </code></pre>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>&lt;form role="form"&gt;
               &lt;div className="form-group"&gt;
                    &lt;label htmlFor={props.recipeName}&gt;Recipe&lt;/label&gt;
                   &lt;input 
                      type="text" 
                      className="form-control"
                      defaultValue={props.recipeName || ''}
                      name="recipeName"
                      placeholder="Recipe name"
                      onChange={props.handleChange.bind(this)}/&gt;
              &lt;/div&gt;
            &lt;div className="form-group"&gt;
                    &lt;label htmlFor={props.recipeIngredients}&gt;Ingredients&lt;/label&gt;
                    &lt;textarea 
                      type="text" 
                      className="form-control"
                      defaultValue={props.recipeIngredients || ''}
                      placeholder="Enter ingredients separated by commas..."
                      onChange={props.handleChange.bind(this)}
                      name="recipeIngredients"&gt;&lt;/textarea&gt;
             &lt;/div&gt;
    &lt;/form&gt;</code></pre>
  </div>
  </div>
  </p>