%META:TOPICINFO{author="ProjectContributor" comment="reprev" date="1265665776" format="1.1" reprev="1.3" version="1.3"}%
%META:TOPICPARENT{name="JQueryPlugin"}%
---+ %TOPIC%
%JQPLUGINS{"validate"
  format="
    Homepage: $homepage <br />
    Author(s): $author <br />
    Version: $version
  "
}%

%STARTSECTION{"summary"}%
Very powerful client-side form validation framework
([[http://bassistance.de/2007/07/04/about-client-side-form-validation-and-frameworks/][article]]).
%ENDSECTION{"summary"}%

---++ Examples

%JQREQUIRE{"validate"}%
%JQREQUIRE{"maskedinput"}%
%ADDTOZONE{"script" topic="%TOPIC%" section="init" requires="JQUERYPLUGIN::VALIDATE, JQUERYPLUGIN::MASKEDINPUT"}%

<verbatim class="tml">
%STARTSECTION{"init"}%
<script type="text/javascript">
(function($) {
  $(function() {
    $("#validateForm").validate();
  });
})(jQuery);
</script>
%ENDSECTION{"init"}%
</verbatim>


<form id="validateForm">
<div class="foswikiFormSteps">
  <div class="foswikiFormStep">
    <h3>First name:</h3>
    <input type="text" size="30" class="required foswikiInputField" name="firstname" value="%URLPARAM{"firstname"}%" />

    <h3>Last name:</h3>
    <input type="text" size="30" class="required foswikiInputField" name="lastname"  value="%URLPARAM{"lastname"}%" />

    <h3>Date of birth:</h3>
    <input type="text" size="10" class="required date foswikiInputField" mask="99/99/9999" name="dateofbirth" value="%URLPARAM{"dateofbirth"}%" />
  </div>
  <div class="foswikiFormStep foswikiFormButtons foswikiFormLast">
    %BUTTON{"%MAKETEXT{"Submit"}%" type="submit" icon="application"}%
    %CLEAR%
  </div>
</div>
</form>
%IF{"'%URLPARAM{"dateofbirth"}%'!=''" then="<div class='foswikiSuccessMessage'>Thanks.</div>"}%
