Question

I have a form with a few text inputs and also with one file-type input, in which I attempt to verify, if the selected file is PDF. I am doing that this way:

$("#myform").bind("submit", function() {
    var ext = $('#file_input').val().split('.').pop().toLowerCase();
    if($.inArray(ext, ['pdf']) == -1) {
        alert('ERROR!');
    }
});

But in the part of code above is one lack – if all inputs except the file-input (lets sat the file is DOC) are valid (=> file-input is not valid) and I click on the SUBMIT button, then is displayed alert message ERROR!, but the form is sent.

How can I “stop” sending the form, if the file type is not valid?

Answer 1

Try this:

$("#myform").bind("submit", function(e) {
    var ext = $('#file_input').val().split('.').pop().toLowerCase();
    if($.inArray(ext, ['pdf']) == -1) {
      e.preventDefault(); //Prevents the default action which is form submit
      alert('ERROR!');
    }
});