Installation tutorial and examples
First link MooTools dependencies
<script type="text/javascript" src="/js/mootools/core.js"></script>
<script type="text/javascript" src="/js/mootools/more.js"></script>
Attach FormCheck to your HTML document
<script type="text/javascript" src="/js/formcheck/lang/en.js"> </script>
<script type="text/javascript" src="/js/formcheck/formcheck.js"> </script>
Link the desired theme
<link rel="stylesheet" href="/js/formcheck/theme/classic/formcheck.css" type="text/css" media="screen" />
Instantiate FormCheck class for the given form
<script type="text/javascript">
window.addEvent('domready', function(){
new FormCheck('myform');
});
</script>
required
Validation will failed if there is no value entered in the field.
<input class="validate['required']" />
Examples using predefined regEx
alpha
The value is restricted to alphabetic chars. This is a regex, you can change it with class options.
<input class="validate['required','alpha']" />
alphanum
The value is restricted to alphanumeric characters only. This is a regex, you can change it with class options.
<input class="validate['required','alphanum']" />
nodigit
The field doesn’t accept digit chars. This is a regex, you can change it with class options.
<input class="validate['required','nodigit']" />
digit
The value is restricted to digit (no floating point number) chars, you can pass two arguments (f.e. digit[21,65]) to limit the number between them. Use -1 as second argument to not set a maximum.
<input class="validate['required','digit']" />
number
The value is restricted to number, including floating point number. This is a regex, you can change it with class options.
<input class="validate['required','number']" />
email
The value is restricted to valid email. This is a regex, you can change it with class options.
<input class="validate['required','email']" />
phone
The value is restricted to phone chars. This is a regex, you can change it with class options.
<input class="validate['required','phone']" />
url
The value is restricted to url. This is a regex, you can change it with class options.
<input class="validate['required','url']" />
Examples using predefined functions
confirm
The value has to be the same as the one passed in argument.
f.e. confirm[password].
<input type="text" class="validate['required']" name="password" id="password" />
<input type="text" class="validate['confirm[password]']" name="confirm" />
Examples using custom functions
coming soon..
you can see the code source of this demo for now:
custom function demo