Input file validation using Jasny v3.1.3 and jQuery Validator v1.13.1

Question

I've been trying to valid an input file field that uses Jasny v3.1.3 but the validation is only done when the form submit button is clicked, that I explicitly call $('#exercicio-form').valid() method from jQuery Validator v1.13.1.

Please take a look at the fiddle I'm working on: http://jsfiddle.net/Luf0ks9b/3/

Note that when I insert some invalid name in the first field and click in somewhere else in the page, the validation is done and the error message is prompted. However, when I upload an invalid file format in the file input field, the validation is NOT done promptly. It is done, though, when I click in submit button.

I already took a look at this question: jQuery Validate Plugin, Bootstrap, Jasny Bootstrap File Input RegEx - Validation Working in Firefox Not in Chrome/IE In the fiddle example of it, something similar to what I want to have is done. When some wrong format file is uploaded, the error is prompt displayed. But, in this answer, they used Jasny v2.3.0. A different version from what I'm using.

Any suggestion or comments are always welcome!

EDIT

Adding HTML and jQuery code:

<div class="row clearfix">
    <div class="col-md-2 column"></div>
    <div class="col-md-8 column">
        <div class="panel panel-default">
            <div class="panel-heading">
                 <h3 class="panel-title">Some title..</h3>

            </div>
            <div class="panel-body">
                <form class="form-horizontal" role="form" method="POST" enctype="multipart/form-data" id="exercicio-form">
                    <div class="form-group">
                        <div class="col-sm-10">
                            <input type="text" class="form-control" id="nome" name="nome" placeholder="Enter with some name..">
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-sm-10">
                            <div class="fileinput fileinput-new input-group" data-provides="fileinput">
                                <div class="form-control" data-trigger="fileinput"> <i class="glyphicon glyphicon-file fileinput-exists"></i>
 <span class="fileinput-filename"></span>

                                </div> <span class="input-group-addon btn btn-default btn-file">
                        <span class="fileinput-new">Search..</span>
 <span class="fileinput-exists">Change</span>

                                <input type="file" name="file" id="file">
                                </span> <a href="#" class="input-group-addon btn btn-default fileinput-exists" data-dismiss="fileinput">Remove</a>

                            </div>
                        </div>
                    </div>
                </form>
                <button value="Submit" class="btn btn-default" id="submitExercicio" data-loading-text="Submitting.." style="float:right">Submit</button>
            </div>
            <div class="col-md-2 column"></div>
        </div>
    </div>

jQuery:

$('#exercicio-form').validate({
    rules: {
        nome: {
            minlength: 5,
            required: true
        },
        file: {
            required: true,
            //accept: "image/jpeg, image/pjpeg"
            accept: "video/mp4"
        }
    },
    highlight: function (element, errorClass, validClass) {
        console.log("highlight");
        $(element).closest('.form-group').removeClass('has-success').addClass('has-error');
    },
    success: function (element) {
        console.log("success");
        $(element).closest('.form-group').removeClass('has-error').addClass('has-success');
    },
    errorElement: 'span',
    errorClass: 'help-block',
    errorPlacement: function (error, element) {
        console.log("errorPlacement");

        // if element is file type, we put the error message in its grand parent
        if (element.prop("type") === "file") {
            error.insertAfter(element.parent().parent());
        } else {
            error.insertAfter(element);
        }
    }
});

$("#submitExercicio").click(function (e) {
    e.preventDefault();

    if ($('#exercicio-form').valid()) {
        $('#submitExercicio').button('loading');
    } else {
        alert("Invalid fields still!");
    }
});