Modernizr Html5 Validation

Question

I made a form with the required atribute for html5 validation and everything worked fine if I submit with my <button type="submit">Submit</button>. So because not all browser are compatibles with html I tried Modernizr. So I made a script with Jquery to validate the fields if the inputs don't have the required attribute. I changed the button

type="submit"

for

type="button"

and made my script:

$("#submit_form").click(function(){
    var val = 0;
    if(!Modernizr.input.required){
        $("#contact_form input,#contact_form select").each(function(){
            if($.trim($(this).val()) === ""){
                $(this).parent("div").addClass("has-error");
                val++;
            }
        });
        if(val > 0){
            return false;
        }
    }
    $("#contact_form").submit();
});

The script works fine and validate the fields and add the "has-error" class to my form elements. The problem is when the browser accept the required attribute and submit the form, html5 doesn't validate anymore the form. It only work if the button type is "submit".

So what can I do to validate with my script if the browser doesn't accept the required attribute, and if it does, validate with Html5.

Thank you