@thinknpm/vanilla-validation

Vanilla JavaScript validation rules

Usage

Use in a plain project:

<!-- download the most recent version of the .umd.js library and include in your HTML -->
<script src="./path-to/vanilla-validation.umd.js"></script>
<!-- log vRules to see all validation rules available -->
<script>console.log(vRules);</script>

Use in a node enviroment

Install the package from npm:

npm install --save @thinknpm/vanilla-validation

Include the package

// get vanilla-validation from node_modules
const vRules = require('@thinknpm/vanilla-validation')
// log vRules to see all validation rules available
console.log(vRules);

Validate an input:

<input type="email" id="email" value="test@example.com">

// get email element
var emailElm = document.getElementById('email');
// validate the input by passing the element to the vRules method
vRules.vrule_email(emailElm)
// debugging
console.log(vRules.vrule_email(emailElm)) 
// will return boolean: true

// if the validation does not pass then an object is returning including an error message
// { message: 'Please enter a valid email' }

Rules available

// input is required
vrule_required(elm, customMessage)

// input required if
vrule_requiredIf(elm, validator, customMessage)

// ensure checkbox is ticked
vrule_checkboxTrue(fieldset, customMessage)

// validation at least one button selected
vrule_btn_required(fieldset, customMessage)

// text input (letters and limited special characters)
vrule_textInput(elm, customMessage)

// number input (numbers only)
vrule_numberInput(elm, customMessage)

// validation input length is at least X
vrule_minLength(elm, min, customMessage)

// validation input length is no more than X
vrule_maxLength(elm, max, customMessage)

// minimum value of input
vrule_minValue(elm, min, customMessage)

// maximum value of input
vrule_maxValue(elm, max, customMessage)

// valid date format (e.g. month cant be 15)
vrule_date(date, customMessage)

// validate date required
vrule_date_required(date, customMessage)

// validate that input date is not before X date
vrule_notBeforeX(elm, dateCheck, customMessage)

// age range (between X and Y)
vrule_ageRange(date, ageRange, customMessage)

// check age is atleast X
vrule_minAge(date, minAge, customMessage)

// valid mobile number
vrule_mobileNumber(elm, customMessage)

// valid home number
vrule_homeNumber(elm, customMessage)

// valid home or mobile number
vrule_anyPhone(elm, customMessage)

// valid email address
vrule_email(elm, customMessage)

// valid currency format
vrule_currency(elm, customMessage)

// valid postcode
vrule_postcode(elm, customMessage)