title: Console not printing contents of input field
body: <p>I am trying to have my console print the contents of an <code>input</code> field with a <code>type</code> of <code>file</code>.  However, it's not doing this.  It's actually behaving as though a form is being submitted, although there is no action attached to the form at this time.  Can anyone explain why I'm unable to get the value of the desired field?</p>
  
  <p><strong>js</strong></p>
  
  <pre><code>$("#submit").on("click", function(){
      var image = $("#dept_image").val();
      console.log(image);
  })
  </code></pre>
  
  <p><strong>html</strong></p>
  
  <pre><code>&lt;form enctype="multipart/form-data" method="post" id="departments" class="view"&gt;
      &lt;fieldset&gt;
          &lt;label for="dept_name"&gt;Department Name:&lt;/label&gt;
          &lt;input type="text" name="dept_name" id="dept_name" /&gt;
      &lt;/fieldset&gt;
      &lt;fieldset&gt;
          &lt;label for="dept_image"&gt;Image:&lt;/label&gt;
          &lt;input type="file" name="dept_image" id="dept_image" /&gt;
      &lt;/fieldset&gt;
      &lt;button name="submit" id="submit"&gt;Submit&lt;/button&gt;
  &lt;/form&gt;
  </code></pre>