title: How to call validation of Textbox on value change of other component in React.js?
body: <p>Want to call validation of Textbox from value change of other custom component which sets value in state.</p>
  
  <p>Handlers:</p>
  
  <pre><code>handleValueChange = (val, elementName) =&gt; {
      this.setState({
        ...this.state,
        [elementName]: val
      });
  };
  
  handleSelectOptionTab = tab =&gt; {
      console.log("tab : ", tab)//tab :  {discountType: "Amount"}
      this.setState({ ...this.state, ...tab });
  };
  </code></pre>
  
  <p>Input components:</p>
  
  <pre><code>&lt;Textbox
    tabIndex="1"
    name="discount"
    id={"discount"}
    type="number"
    value={_.toString(this.state.discount)}
    placeholder="Enter discount"
    onChange={val =&gt; this.handleValueChange(val, "discount")}
    onBlur={() =&gt; {}}
    validate={this.state.validate}
    validationCallback={res =&gt; {
      this.setState({
        ...this.state,
        hasDiscountError: res
      });
    }}
    validationOption={
      this.state.discountType === "Percent"
        ? {
            name: "discount",
            required: true,
            reg: /regext-for-percent/,
            regMsg:"validation msg 1"
          }
        : {
            name: "discount",
            required: true,
            reg: /regex-for-amount/,
            regMsg: "Validation msg 2"
          }
    }
  /&gt;
  
  //Options: "Amount", "Percent"
  //This is selectable optional buttons where user can choose anyone among multiple options (discountType: "Amount" or discountType: "Percent")
  &lt;OptionalButton
    selection={this.state}
    identifier={"discountType"}
    tabIndex="2"
    onSelect={tab =&gt; this.handleSelectOptionTab(tab)}
    options={DISCOUNT_TYPES}
  /&gt;
  </code></pre>
  
  <p>Validation of <code>Textbox</code> is working fine on value change and focused out from <code>Textbox</code> but if value is already present and <code>this.state.discountType</code> is change from <code>OptionalButton</code> in that case validation is not working. </p>
  
  <p>Example: <code>Textbox</code> value is <code>10000</code> with Type selected as <code>"Amount"</code> which is valid but as Type is changed to <code>"Percent"</code> then <code>Textbox</code> should show validation error.</p>