title: How can I validate the file type selected from an input element of type file
body: <p>I am trying to allow users to upload an image by using the html below</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;input class="file-upload" id="imagepath" name="imagepath" type="file" accept="image/x-png,image/jpeg"  /&gt;
  </code></pre>
  
  <p>Is there any way to show a validation message if a user selects a file that is not of the correct type using JS/JQuery?</p>
  
  <p>I understand that the 'accept' attribute restricts what a user will see when they are viewing the file explorer however this can be changed using the drop down, to 'All files'.</p>