Question

I am currently trying ot find a way to use jquery to validate if a a file is in picture format (jpeg,jpg,bmp,gif,etc). I have been able to figure out if the input is empty or not with simple .length comparison. How would I be able to check the file type and only accept valid picture formats.

Emtpy or not input:

if ($.trim($('#textInput').val()).length == 0) {
    alert("Should Not Be Empty!");
}

Answer 1

Given a file input:

var extension = $('#file_input').val().split('.').pop();
if (['bmp', 'gif', 'png', 'jpg', 'jpeg'].indexOf(extension) > -1) {
    console.log('validated');
} else {
    console.log('invalid extension');
}

For more extensive file-type filtering, you should ideally use server-side validation.