title: How to validate input file type onclick submit using jquery?
body: <p>In this code I simply want to validate <code>pancard_img</code>. What happens right now if pancard image not empty then it again shows me 'Pancard image should not be empty. If <code>pancard_img</code> have a value. How can I fix this one? </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>$(document).ready(function() {
    $("#submit").click(function(e) {
      e.preventDefault();
      if (("#pancard").val() == '') {
        $("#err_pan").html("Pancard should not be empty");
      } else if (("#pancard_img").val() == '') {
        $("#err_pan_img").html("Pancard image should not be empty");
      } else {
        alert("successful");
      }
    });
  });</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;form id="myform"&gt;
    &lt;input type="text" name="pancard" id="pancard" /&gt;
    &lt;div id="err_pan"&gt;&lt;/div&gt;
    &lt;input type="file" name="pancard_img" id="pancard_img" value="Pan1.png" /&gt;
    &lt;div id="err_pan_img"&gt;&lt;/div&gt;
    &lt;input type="submit" name="submit" class="btn btn-success" id="submit" value="submit" /&gt;
  &lt;/form&gt;</code></pre>
  </div>
  </div>
  </p>