A simple JavaScript library for form validation.
Download the file formly.js and import the functions using the route where you put this file.
The function validAnyFormat(anyInput, REGEX) verify any format you want. This is the default function.
Input
It receives an input element and a regular expression.
For example:
import validAnyFormat from "./formly.js";
let form = document.getElementsByTagName("input")[0];
console.log(validAnyFormat(form, /[a-z]/));
Output
It returns true if the format is correct or false if it is not.
The function validDate(dateInput, format) verify the date.
Input
It receives an input element and a string which represents the date format. The last one can take 1 of 3 values: DMY for the DD/MM/YYYY format, MDY for the MM/DD/YYYY format or YMD for the YYYY/MM/DD format.
For example:
import { validDate } from "./formly.js";
let dateForm = document.getElementsByTagName("input")[0];
console.log(validDate(dateForm, "DMY"));
Output
It returns true if the date is valid or false if it is not.
The function validEmailFormat(emailInput) verify the email format.
Input
It receives an input element.
For example:
import { validEmailFormat } from "./formly.js";
let emailForm = document.getElementsByTagName("input")[0];
console.log(validEmailFormat(emailForm));
Output
It returns true if the format is correct or false if it is not.
The function validImei(imeiInput) verify the imei number.
Input
It receives an input element.
For example:
import { validImei } from "./formly.js";
let imeiForm = document.getElementsByTagName("input")[0];
console.log(validImei(imeiForm));
Output
It returns true if the imei number is valid or false if it is not.
The function validIpv4Format(IpInput) verify the IPv4 format.
Input
It receives an input element.
For example:
import { validIpv4Format } from "./formly.js";
let ipForm = document.getElementsByTagName("input")[0];
console.log(validIpv4Format(ipForm));
Output
It returns true if the format is correct or false if it is not.
The function validMacFormat(macInput) verify the MAC address format.
Input
It receives an input element.
For example:
import { validMacFormat } from "./formly.js";
let macForm = document.getElementsByTagName("input")[0];
console.log(validMacFormat(macForm));
Output
It returns true if the format is correct or false if it is not.
The function validMaxAge(anyInput, max) verify the maximum age that the form accepts.
Input
It receives an input element and an integer which represents the maximum age that the form accepts.
For example:
import { validMaxAge } from "./formly.js";
let ageForm = document.getElementsByTagName("input")[0];
console.log(validMaxAge(ageForm, 65));
Output
It returns true if the age in the form is lower o equal than the age that the form accepts or false if it is not.
The function validMinAge(anyInput, min) verify the minimum age that the form accepts.
Input
It receives an input element and an integer which represents the minimum age that the form accepts.
For example:
import { validMinAge } from "./formly.js";
let ageForm = document.getElementsByTagName("input")[0];
console.log(validMinAge(ageForm, 18));
Output
It returns true if the age in the form is higher or equal than the age that the form accepts or false if it is not.
The function validRangeAge(anyInput, min, max) verify the minimum and maximum age that the form accepts.
Input
It receives an input element and two integers which represent the minimum and maximum age that the form accepts.
For example:
import { validRangeAge } from "./formly.js";
let ageForm = document.getElementsByTagName("input")[0];
console.log(validRangeAge(ageForm, 18, 65));
Output
It returns true if the age in the form is within the range of ages that the form accepts or false if it is not.
The function validNumberFormat(numberInput, format) verify the number format.
Input
It receives an input element and a string which represents the number format. The last one can take 1 of 4 values: BIN for binary, OCT for octal, DEC for decimal or HEX for hexadecimal.
For example:
import { validNumberFormat } from "./formly.js";
let numberForm = document.getElementsByTagName("input")[0];
console.log(validNumberFormat(numberForm, "HEX"));
Output
It returns true if the format is correct or false if it is not.
The function validPasswordFormat(passwordInput, lowercase, uppercase, numeric, special, characters) verify the password format.
Input
It receives an input element and 5 integers which represent the minimun ammount of lowercase characters, uppercase characters, numeric characters, special characters and characters in general that the password must have.
For example:
import { validPasswordFormat } from "./formly.js";
let passwordForm = document.getElementsByTagName("input")[0];
console.log(validPasswordFormat(passwordForm, 1, 1, 1, 1, 8));
Output
It returns true if the format is correct or false if it is not.
The function validMaskFormat(maskInput) verify the subnet mask format.
Input
It receives an input element.
For example:
import { validMaskFormat } from "./formly.js";
let maskForm = document.getElementsByTagName("input")[0];
console.log(validMaskFormat(maskForm));
Output
It returns true if the format is correct or false if it is not.
The function validTime(timeInput, format) verify the time.
Input
It receives an input element and a string which represents the time format. The last one can take 1 of 2 values: 12h for the HH:MM AM/PM format or 24h for the HH:MM format.
For example:
import { validTime } from "./formly.js";
let timeForm = document.getElementsByTagName("input")[0];
console.log(validTime(timeForm, "24h"));
Output
It returns true if the time is valid or false if it is not.
The function validWebsiteFormat(websiteInput) verify the URL format.
Input
It receives an input element.
For example:
import { validWebsiteFormat } from "./formly.js";
let urlForm = document.getElementsByTagName("input")[0];
console.log(validWebsiteFormat(urlForm));
Output
It returns true if the format is correct or false if it is not.
The function validUsername(usernameInput, sm) verify the username format of Twitter or GitHub.
Input
It receives an input element and a string which represents the platform. The last one can take 1 of 2 values: TW for Twitter or GH for GitHub.
For example:
import { validUsername } from "./formly.js";
let usernameForm = document.getElementsByTagName("input")[0];
console.log(validUsername(usernameForm, "TW"));
Output
It returns true if the format is correct or false if it is not.
The function validExactCheckbox(nameAttr, exact) verify the exact amount of selected options that a group of checkbox accepts.
Input
It receives a string which represents the value of the name attribute in the checkboxes group and an integer which represents the exact amount of selected options that a group of checkbox accepts.
For example:
import { validExactCheckbox } from "./formly.js";
console.log(validExactCheckbox("music", 4));
Output
It returns true if the amount of selected options is equal than the exact amount that a group of checkbox accepts or false if it is not.
The function validMaxCheckbox(nameAttr, max) verify the maximum amount of selected options that a group of checkbox accepts.
Input
It receives a string which represents the value of the name attribute in the checkboxes group and an integer which represents the maximum amount of selected options that a group of checkbox accepts.
For example:
import { validMaxCheckbox } from "./formly.js";
console.log(validMaxCheckbox("movies", 3));
Output
It returns true if the amount of selected options is lower or equal than the maximum amount that a group of checkbox accepts or false if it is not.
The function validMinCheckbox(nameAttr, min) verify the minimum amount of selected options that a group of checkbox accepts.
Input
It receives a string which represents the value of the name attribute in the checkboxes group and an integer which represents the minimum amount of selected options that a group of checkbox accepts.
For example:
import { validMinCheckbox } from "./formly.js";
console.log(validMinCheckbox("videos", 2));
Output
It returns true if the amount of selected options is higher or equal than the minimum amount that a group of checkbox accepts or false if it is not.
The function validRangeCheckbox(nameAttr, min, max) verify the minimum and maximum amount of selected options that a group of checkbox accepts.
Input
It receives a string which represents the value of the name attribute in the checkboxes group and two integers which represent the minimum and maximum amount of selected options that a group of checkbox accepts.
For example:
import { validRangeCheckbox } from "./formly.js";
console.log(validRangeCheckbox("options", 2, 5));
Output
It returns true if the amount of selected options is within the range that a group of checkbox accepts or false if it is not.
The function validExactInput(anyInput, exactValue) verify if an input has an exact value.
Input
It receives an input element and a string which represents the exact value.
For example:
import { validExactInput } from "./formly.js";
let input = document.getElementsByTagName("input")[0];
console.log(validExactInput(input, "Daniel Castillo"));
Output
It returns true if the input has the exact value or false if it is not.
The function isInputEmpty(anyInput) verify if an input is empty.
Input
It receives an input element.
For example:
import { isInputEmpty } from "./formly.js";
let form = document.getElementsByTagName("input")[0];
console.log(isInputEmpty(form));
Output
It returns true if the input is empty or false if it is not.
The function validMaxChar(anyInput, max) verify the maximum amount of characters that the form accepts.
Input
It receives an input element and an integer which represents the maximum amount of characters that the form accepts.
For example:
import { validMaxChar } from "./formly.js";
let form = document.getElementsByTagName("input")[0];
console.log(validMaxChar(form, 10));
Output
It returns true if the amount of characters in the form is lower o equal than the maximum amount of characters that the form accepts or false if it is not.
The function validMinChar(anyInput, min) verify the minimum amount of characters that the form accepts.
Input
It receives an input element and an integer which represents the minimum amount of characters that the form accepts.
For example:
import { validMinChar } from "./formly.js";
let form = document.getElementsByTagName("input")[0];
console.log(validMinChar(form, 10));
Output
It returns true if the amount of characters in the form is higher o equal than the minimum amount of characters that the form accepts or false if it is not.
The function validRangeChar(anyInput, min, max) verify the minimum and maximum amount of characters that the form accepts.
Input
It receives an input element and two integers which represent the minimum and maximum amount of characters that the form accepts.
For example:
import { validRangeChar } from "./formly.js";
let form = document.getElementsByTagName("input")[0];
console.log(validRangeChar(form, 50, 100));
Output
It returns true if the amount of characters in the form is within the range of characters that the form accepts or False if it is not.
The function radioButtonSelected(nameAttr) verify if an option in a group of radio button is selected.
Input
It receives a string which represents the value of the name attribute in the radio buttons group.
For example:
import { radioButtonSelected } from "./formly.js";
console.log(radioButtonSelected("color"));
Output
It returns true if an option is selected or false if it is not.