JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.min.js"></script>
<form action="" id="shown">
    <label>A required field:</label>
    <input type="text" name="first" value="" />
</form>
<form action="" id="hidden">
    <label>A required field:</label>
    <input type="text" name="first" value="" />
</form>
<a href="#">Click me to submit both form</a>

CSS

a { display: block; padding: 10px 20px; }

form#hidden{display:none;}

JavaScript

$('a').live("click", function() {
    $("form#shown").submit();
    $("form#hidden").submit();   
});


$("form").validate({
    rules: {
        "first": "required"
    },
    invalidHandler: function() {
        alert("error");   
    },
    submitHandler: function( form ) {
        alert("no error");
    }
});