title: Conditional validation with react hook form
body: <p>Here is my form looks like and also <a href="https://codesandbox.io/s/react-hook-form-conditional-fields-forked-mj7sl?file=/src/index.css" rel="noreferrer">CodeSanbox</a>. currently I'm using react-hook-form <br/>
  as you can see form has 3 inputs. Submit button should be disabled until all the required fields are entered.
  Two use case:</p>
  <ol>
  <li>If &quot;Check&quot; is unchecked:
  <ul>
  <li>only &quot;id&quot; should be validated and submit button should get enabled. &quot;firt&quot; and &quot;last&quot; names should not be part of form data</li>
  </ul>
  </li>
  <li>If &quot;Check&quot; is checked
  <ul>
  <li>all the fields should be validated<br />
  first and last names are only required if &quot;Check&quot; is checked. so its not checked then form should only validate &quot;ID&quot; field. if &quot;Check&quot; is checked then all fields should get validated.</li>
  </ul>
  </li>
  </ol>
  <p>problem I'm having is if I enter id, form state is still &quot;invalid&quot;. Form is expecting to enter values for first and last name.<br>
  I would appreciate any help.</p>
  <p><a href="https://i.stack.imgur.com/sSvo9.png" rel="noreferrer"><img src="https://i.stack.imgur.com/sSvo9.png" alt="Form" /></a></p>