Проверка HTML 5 Проверка с помощью JQuery

Question

У меня есть форма, которая имеет HTML 5 Validations, и я хочу показать загрузчик тогда и только тогда, когда нет сообщений об ошибке из проверки HTML 5. Итак, как я могу это сделать? Я много пробовал, по событию onclick кнопки отправки, а также пробовал через форму отправить событие, но ничего не работает.

Это форма

<form action="<?php echo base_url();?>index.php/contact/index" method="post" id="contact_form"> 
    <div class="form-group"> 
    <label style="color: #333;">Name</label> 
    <input type="text" class="form-control" id="input_name" name="input_name" placeholder="Enter Your Name" required="required"> 
    </div> 
    <div class="form-group"> 
    <label style="color: #333;">Email</label> 
    <input type="email" class="form-control" id="input_email" name="input_email" placeholder="Enter your Email" required="required"> 
    </div> 
    <div class="form-group"> 
    <label style="color: #333;">Subject</label> 
    <select class="form-control" id="input_subject" name="input_subject"> 
     <option value="FAQ"> FAQ's</option> 
     <option value="Feedback & Suggestion"> Feedbacks And Suggestions</option> 
    </select> 

    </div> 
    <div class="form-group"> 
    <label style="color: #333;">Message</label> 
    <textarea class="form-control" id="input_message" name="input_message" placeholder="Enter your Message" required="required"></textarea> 
    </div> 

    <center> 
    <button type="submit" class="btn btn-primary btn-lg btn-block" id="contact_submit">Submit</button><img src="<?php echo base_url();?>assets/img/load.gif" height="50" width="50" style="display: none;" id="loader"/> 
    </center><br /> 
</form> 

Это мой Java-код загрузчика только

<script type="text/javascript"> 
    jQuery(document).ready(function() { 

    $(document).on('click', '#contact_submit', function(){ 
    $('#loader').show(); 
    }); 
</script> 

Answer 1

Это код, который я использовал для чего-то подобного, в основном проверяю отправку формы вместо кнопки отправки щелкните, и это даст доступ к проверке формы.

$('form').submit(function (e) { 
    e.target.checkValidity(); 
    $('#loader').show(); 
}); 

Answer 2

Это срабатывает, если форма является действительным, и действительно представлен

$("#contact_form").on('submit', function(){ 
    $('#loader').show(); 
});