title: how to get field value on change for FormItem in antd
body: <p>I am having a hard time with antd's form.
  I have this select field in this form and I want to get the value from it onChange but somehow not getting it to work properly.</p>
  
  <p>say this is the item for which I want the values</p>
  
  <pre><code>&lt;FormItem
    {...formItemLayout}
    label={fieldLabels.qcategoryid}
    validateStatus={categoryError ? "error" : ""}
    help={categoryError || ""}
  &gt;
    {getFieldDecorator("qcategoryid", {
      rules: [{ required: true, message: "Please select Category!" }],
      onChange: this.handleCategoryChange
    })(&lt;Select&gt;{categoryOptions}&lt;/Select&gt;)}
  &lt;/FormItem&gt;
  </code></pre>
  
  <p>this is the categoryOptions</p>
  
  <pre><code>if (this.props.categories) {
    categoryOptions = this.props.categories.map(item =&gt; (
      &lt;Select.Option
        key={item.categoryid}
        value={item.categoryid}
        name={item.categoryname}
      &gt;
        {item.categoryname}
      &lt;/Select.Option&gt;
    ));
  }
  </code></pre>
  
  <p>I want both the name of the category and the id
  so I created a handleCategoryChange which gets called onChange
  and I am able to get the fields I want.</p>
  
  <p>But, it seems that now, I have to click twice on the field to properly select it.
  If I click it just once then it does show up in the console. but the field on the form still remains empty. when I click it again, then the field shows up in the form too.</p>
  
  <p>So, what am I doing wrong here.
  Ah,yes! Here's the handleCategoryChange function</p>
  
  <pre><code>handleCategoryChange = (value, e) =&gt; {
    console.log("value is : ", value);
    console.log("e : ", e);
    this.props.form.setFieldsValue({ qcategoryid: value });
    this.setState({
      categorySelected: value,
      categoryname: e.props.name
    });
  };
  </code></pre>
  
  <p>Just to make myself clear.
  I need those values before I click submit.
  not on submit.</p>