title: Don't Validate untouched fields in Formik and Yup on submitting if field is not empty
body: <p>I have this validation schema for a form made using <code>withFormik()</code> used in my React application, Here <code>validateJql()</code> is my custom validation function for <code>yup</code></p>
  
  <pre><code>validationSchema: Yup.object().shape({
              rework: Yup.string().required("Rework query is required").validateJql(), 
              originalEstimate: Yup.string().required("Original Estimate query is required").validateJql()
          })
  </code></pre>
  
  <p>and my form Component is like this:</p>
  
  <pre><code>const addSomeForm = (props) =&gt; {
      const {
          values,
          touched,
          errors,
          isSubmitting,
          handleChange,
          handleSubmit,
      } = props;
  
  return (
          &lt;form onSubmit={handleSubmit}&gt;
               &lt;div className="form-group"&gt;
                    &lt;div&gt;
                        &lt;label htmlFor="name" className="col-form-label"&gt;&lt;b&gt;Rework Query:&lt;/b&gt;&lt;/label&gt;
                        &lt;textarea id="query.rework" rows="5" type="text" className="form-control" placeholder="Enter JQL with aggregate Function" value={values.query.rework} onChange={handleChange} required /&gt;
                         {errors.query &amp;&amp; errors.query.rework &amp;&amp; touched.query &amp;&amp; &lt;span className="alert label"&gt; &lt;strong&gt;{errors.query.rework}&lt;/strong&gt;&lt;/span&gt;}
                     &lt;/div&gt;
               &lt;/div&gt;
               &lt;div className="form-group"&gt;
                   &lt;div&gt;
                        &lt;label htmlFor="name" className="col-form-label"&gt;&lt;b&gt;Original Estimate:&lt;/b&gt;&lt;/label&gt;
                         &lt;textarea id="query.originalEstimate" rows="5" type="text" className="form-control" placeholder="Enter JQL with aggregate Function" value={values.query.originalEstimate} onChange={handleChange} required /&gt;
                         {errors.query &amp;&amp; errors.query.originalEstimate &amp;&amp; touched.query &amp;&amp; &lt;span className="alert label"&gt; &lt;strong&gt;{errors.query.originalEstimate}&lt;/strong&gt;&lt;/span&gt;}
                   &lt;/div&gt;
               &lt;/div&gt;
         &lt;/form&gt;
      )
  </code></pre>
  
  <p>Now, what I want to do is not to run validation on form submit if the field <code>rework</code> and <code>originalEstimate</code> is not touched and also not empty. How can I achieve this with <code>withFormik</code> HOC or <code>Yup</code>? I have partially been through <code>Yup</code> docs and <code>Formik</code> docs but could not find something to fit with my problem. </p>
  
  <p>This is the case after submitting the form once and editing after that for minor tweaks in some of those multiple fields. if there are multiple fields and only some are edited, I don't want to run validation for all the fields existed. </p>
  
  <p>Thank you in advance.</p>