jquery validator - форма по-прежнему отправляется даже в случае недействительности

Question

У меня есть несколько полей в форме с основными правилами, и плагин validator отлично подходит при заполнении самой формы. Однако при отправке этой проблемы возникает проблема, поскольку она по-прежнему отправляется даже в том случае, если действительный адрес электронной почты не был вставлен или до того, как что-либо было введено в других текстовых полях.

Вот мой тест функция:

$(function() { 

    $("#submit_form_contact").validate({ 
     errorLabelContainer: '#errors' 
    }); 

    $('#contact_submit').click(function(e){ 

     if ($("#submit_form_contact").valid()) { 
      alert ('valid!'); 
     } else { 
      alert ('invalid!'); 
     } 
    }); 
}); 

HTML:

<form class="pure-form pure-form-aligned" id="submit_form_contact" novalidate> 
    <fieldset> 
    <div class="pure-control-group"> 
     <label for="name">Your Name:</label> 
     <input id="name" type="text" placeholder="Name" required> 
    </div> 

    <div class="pure-control-group"> 
     <label for="email">Your Email:</label> 
     <input id="email" type="email" placeholder="Email Address" required> 
    </div> 

    <div class="pure-control-group"> 
     <label for="email_text">Inquiry Type: </label> 
     <select id="inquiry_dropdown" class="pure-input-1-2"> 
     <option>General</option> 
     <option>Sales & Marketing</option> 
     <option>Press & Editorial</option> 
     </select> 
    </div> 

    <div class="pure-control-group"> 
     <label for="message" style="vertical-align: top;">Message:</label> 
     <textarea id="message" type="text" placeholder="Enter message here..." required></textarea> 
    </div>      

    <div id="errors" style="text-align: center; color: red;"></div> 

    <button id="contact_submit" class="pure-button pure-button-primary" style="background-color: #003A70; float:right; margin-right: 35px;margin-top:15px;">Submit</button> 
</div> 
</fieldset> 
</form> 

... Он по-прежнему предупреждает действительный каждый раз. Все поля в форме отмечены как обязательные. Любая помощь приветствуется. JSFiddle: http://jsfiddle.net/RcNTj/

Answer 1

Изменить атрибут id для name и попробовать

<input name="name" type="text" placeholder="Name" required> 

Демо: Fiddle