html5 required and jQuery submit()

Question

I'm trying to implement html5 into a form, but I came with a problem when I submit the form through jquery and try to use the html5 "required" attribute.

Here is my form, quite simple:

<form action="index.php" id="loginform">       <input name="username" required placeholder="username" type="text">           <a href="javascript:$('#loginform').submit();">Login</a> </form> 

The problem is that when the form is submited through jquery, It just by-passes the required attribute. I know that required should only work if the form is submitted by the user, not by a script, so when I change the anchor to a submit input it works perfect.

My point is if there is a way to force the jquery .submit() to use html5 required atribute.

Thanks in advance for the answers

Answer 1

I did the following

<form>     ...     <button type="submit" class="hide"></button> </form>  <script>     ...     $(...).find('[type="submit"]').trigger('click');     ... </script> 

¡it works!

Answer 2

You can

• trigger click event on a submit
• check validation manually with $("form")[0].checkValidity()
• find invalid elements manually using $("form :invalid")