Using Jquery Validation Plugin with Dropzone.js - I want to disable submit unless valid()
<p>Here is the relevant dropzone.js script:</p>

<pre><code>$(document).ready(function () {
  var dropzone3;
  Dropzone.autoDiscover = false;
  dropzone3 = new Dropzone('#dropform3', {
    maxFiles: 6,
  });
  $('#item-submit').click(function(e) {
    e.preventDefault();
    e.stopPropagation();
    if (dropzone3.getQueuedFiles().length &gt; 0) {
      return dropzone3.processQueue();
    } 
    else {
      return $('#dropform3').submit();
    }
  }); 
</code></pre>

<p>My form uses dropzone.js for images. I currently have the Jquery validation plug-in working correctly on the text inputs, but I want to prevent the form from being submitted if there are any errors in the inputs.</p>

<p>This is what the code for my submit button looks like: </p>

<pre><code>&lt;input type="submit" name="commit" value="Upload" id="item-submit" class="btn btn-default photoform"&gt;
</code></pre>

<p>Here is the validation script:</p>

<pre><code>$('form#dropform3').validate({
  errorElement: "div",
  rules: { 
    'photo[title]':             {required: false, maxlength: 30},
    'photo[tag_list]':          {required: false, taglength: 20}
  }
});
</code></pre>

<p>I unsuccessfully tried to create an <code>if statement</code> to disable the button using: </p>

<pre><code>var isValid = $('form#dropform3').valid();
var dropbtn = $('#item-submit')
if (!isValid) {
  dropbtn.prop("disabled", true);                  
}
</code></pre>

<p>and</p>

<pre><code>var isValid = $('form#dropform3').valid();
var dropbtn = $('#item-submit')
if (!isValid) {
  dropbtn.css("pointer-event", "none");                  
}
</code></pre>

<p>However, as per <a href="https://stackoverflow.com/a/38484491/5830835">this answer</a> --</p>

<blockquote>
  <p>when using a type="submit", your click handler is not needed because the click is automatically captured by the plugin. Also, in that case, you would use the <a href="https://jqueryvalidation.org/validate/" rel="nofollow noreferrer">submitHandler</a> option to contain any code to run when the form is valid.</p>
</blockquote>

<p>I briefly tried unsuccessfully to move <code>$('#item-submit').click(function(e)</code> into <code>submitHandler</code> but received an error that <code>dropzone3</code> was undefined. I do not know how to combine the scripts. </p>