validate-my-form

1.0.4 • Public • Published

Validate my form

npm version

A form validator to validate input[required] fields;

Using Validate my form you can:

  • Validate a form;
  • Using default validation rules;
  • Create your own validation rules;

Installation

Using like a library
$ git clone https://github.com/rlazarini/validate-my-form.git
<body>
...
...
<script src="path/to/validate-my-form/index.js"></script>
</body>
Using like a module
$ npm install validate-my-form --save

Usage

Using like a module
var validateMyForm = require('validate-my-form');
validateMyForm._validateMyForm(form);

Examples

Basic Usage
<body>
    <form action="" id="form" novalidate>
        <input type="text">
        <!-- Validate only required fields -->
        <input type="text" required="required">
        <input type="email" required="required">
        <input type="number" required="required">
        <input type="password" required="required">
        <input type="submit" value="send">
    </form>
    <script>
        var form = document.getElementById('form');
 
        form.onsubmit = function(e) {
            e.preventDefault();
            validateMyForm._validateMyForm(form);
        }
    </script>
</body>
Create and validating a new type
<body>
    <form action="" id="form" novalidate>
        <input type="textwiththreespaces" required="required">
        <input type="submit" value="send">
    </form>
    <script>
        var form = document.getElementById('form')
        , obj  = {
            'textwiththreespaces': /\w+\s{3}\w+/g
        };
        
        form.onsubmit = function(e) {
            e.preventDefault();
            validateMyForm._validateMyForm(form,obj);
        }
    </script>
</body>
Send a validate using attribute data-type

In this method, the input don't lose your properties. data-type="name" validate input[text] with rule text{space}text. You can create your own data-type and pass a object to validate then.

<body>
    <form action="" id="form" novalidate>
        <input type="text" data-type="name" required="required">
        <input type="text" data-type="myowndatatype" required="required">
        <input type="submit" value="send">
    </form>
    <script>
        var form = document.getElementById('form')
        , obj  = {
            'myowndatatype': /^\d{2}[.]\d{3}[-]\d{3}[\/]\d{3}[-]\d{2}$/g
            // validate something like: 00.000-000/000-00
        }
        form.onsubmit = function(e) {
            e.preventDefault();
            validateMyForm._validateMyForm(form,obj);
        }
    </script>
</body>

Default Options to data-type

number   ## Validate a field with only numbers 
cpf ## Validate a Brazil document 
phone ## Validate a Brazilian phone number 
zipcode ## Validate a Brazilian zipcode address 
currency ## Validate a monetary value. By default, using R$, but you can pass a monetary symbol with attribute data-monetary (see more above) 
name ## Validate a name, basically, they need two block of words: Like John Doe 
creditcard ## Validate a Credit Card number with 16 digits with or without spaces 
cvv ## Validate a Credit Card CVV number with 3 digits 

The input[date] (or data-type[date], if you wish), has 2 another attributes you can use:

data-format   ## Pass the format of your date, by default use international date format (YYYYMMDD). Other options: DDMMYYYY; MMDDYYYY 
data-gtCurrentDate ## Pass a boolean if you want the validated date to be greater than or equal to the current date 

The data-type[currency], has 1 attribute you can use:

data-monetary ## You can pass a monetary symbol to your validation, by default: R$ 

Readme

Keywords

none

Package Sidebar

Install

npm i validate-my-form

Weekly Downloads

8

Version

1.0.4

License

ISC

Last publish

Collaborators

  • rlazarini