jQuery Plugin for client side easy form validations.
JavaScript HTML
Latest commit 118f21c Nov 9, 2016 Rogerio Taques Added support for CPF and CNPJ filters

README.md

Valida (jQuery)

Latest Version

Valida is a jQuery plugin which provides an easy, fast and lightweight way to make form validations on client-side. Moreover, it's source-code (minified) has about 12Kb.

Live Demo

Details

Validating a form on client-side, using Javascript, can be (at least for me is) a very boring and slower task!

So, looking for a way to make it easier and faster, I wrote this small, light, but very flexible plugin to do the hard and boring job, providing a very smart way to validate web forms!

Since your are using Valida, you can expect:

  • Each TEXTAREA, on your form, which has a max length property set, will receive a description label (right below it) that displays the max length and how many chars were already typed!

  • Each INPUT text field, on your form, which has a filter property set, will be analyzed when the user is typing to inform him/her that the value is valid or invalid!

  • During the validation process, each field on your form which has the "required" property set and has no value or has the "filter" property set and the value doesn't match the given filter, will receive a label (right below it) with a error/invalid message.

  • You also can run some stuff before/after the validation via callback methods and customize the messages and the layout of messages displayed!

  • There are 19 filters available to be used.

How to use it ?

Import the "valida.js" on the HEAD of your page:

<script type="text/javascript" src="valida.js" ></script>

Set what kind of fields are required and has filters:

<input type="text" ... required="true" /> <!-- required or -->
<input type="text" ... filter="email" /> <!-- filter */ or -->
<input type="text" ... required="true" filter="email" /> <!-- both -->

Then, you just need call it:

<script type="text/javascript" src="valida.js" ></script>
<script type="text/javascript" >
    jQuery(document).ready(function(){
       $('your-form').valida();
    });
</script>

Done!

What'll happen ?

When you submit your form (as you usually may do), Valida'll get in action and make the analysis of your form, putting messages (error/warnings) when it's necessary and stopping the form submit for mistakes corrections, moreover, some other nice stuff.


Well, that's it! Easy, don't you?

If you have any suggestion, critics or just wanna say hello, feel free to mail me or leave a comments here.

Happy coding! =)