kilcdn
v1.0.60
Published
KilValidate Cdn
Readme
KilValidate Cdn
This JavaScript package provides input field validation for web forms. It includes methods for validating various types of form fields, such as text fields, email, phone numbers, and custom patterns.
Installation Kilvish Validation Attributes
This README describes the custom validation attributes (data-kilvish-*) used in your project for various input field types. These attributes are used to enforce constraints on the data entered into form fields.
Overview: These data-kilvish-* attributes are designed to ensure that the input provided in form fields adheres to specific validation rules, such as numbers only, alphanumeric characters, or specific special characters. Below is a breakdown of the available attributes.
Validation Attributes:
For Numbers Only Attribute: data-kilvish-num='yes'
This attribute ensures that the input is a numeric value only.
Example:
For Numbers Only with Limits (Character Length) Attribute: data-kilvish-num='_7_20'
This attribute restricts the input to numeric values only, and the length of the number must be between 7 and 20 characters.
Example:
For Alphanumeric Characters Only Attribute: data-kilvish-char='mix'
This attribute allows only alphanumeric characters (letters and numbers).
Example:
For Alphanumeric Characters with Special Characters Attribute: data-kilvish-char='mix_%_$'
This attribute allows alphanumeric characters along with specific special characters (%, _, and $).
Example:
or data-kilvish-char='mix_ ,-_' // ideal for address contain space , dash, comma
For Alphabets Only (Letters Only) Attribute: data-kilvish-char='Yes'
This attribute restricts the input to alphabets (letters only, no numbers or special characters).
Example:
For Alphabets Only with Special Characters Allowed Attribute: data-kilvish-char='Yes_%_$'
This attribute allows alphabets and special characters (%, _, and $).
Example:
File Input Validation with data-kilvish-file 7.1 -> use data-kilvish-file="image" or no use for simple Image
7.2 data-kilvish-file="image_min_max"
Example: data-kilvish-file="image_1_3" restricts the selection to between 1 and 3 image files. 7.3 data-kilvish-file="doc" for pdf , word , excel
7.4 data-kilvish-file="doc_min_max" Example: data-kilvish-file="doc_1_4" restricts the selection to between 1 and 4 document files.
7.5 data-kilvish-file="pdf" only allow pdf
7.6 data-kilvish-file="pdf_min_max"
Example: data-kilvish-file="pdf_1_4" restricts the selection to between 1 and 4 PDF files. 7.7 data-kilvish-file="mix" // for allow both image or doc
7.8 data-kilvish-file="only_pdf_image" → Only PDF and image files will be accepted.
7.9 data-kilvish-file="only_doc_image" → Only DOC-related and image files will be accepted.
Example: // limits to 1–4 files
data-kilvish-password="8_20" for min and max pass Usage: To use these validation attributes, simply add the appropriate data-kilvish-* attribute to the tag in your HTML form. The validation will be applied automatically based on the specified rules.
Example:
Phone Number (7-20 digits): Username (letters and numbers):
Password (letters, numbers, and special chars):
data-kilvish-amount // for setting amount or Price related validation Case 1: data-kilvish-amount="USD" Input: 2 → Auto-formats to 2.00 with cursor at 2|.00. Input: 25. → Allows further typing for decimal values, e.g., 25.5 or 25.55. Input: 25.555 → Automatically truncates to 25.55.
Case 2: data-kilvish-amount="USD_200_1000" Input: 150 → Shows error: Amount must be at least 200.00 USD. Input: 250.333 → Automatically truncates to 250.33. Input: 1100 → Shows error: Amount must not exceed 1000.00 USD.
data-kilvish-date // Date Validations with # Date Validations with data-kilvish-date Example: Ensures the user is between 18 and 60 years old.
10.1 Future Date Restrictions data-kilvish-date="future" Ensures the date must be in the future.
Example:
The selected date must be after today. Example:
The selected date can be today or in the future. Example:
The selected date must be within the next 30 days.
Example:
The date must be within the next 2 years.
Example:
The date must be after 2 years from today
10.2 Past Date Restrictions data-kilvish-date="2_years_past" Ensures the date must be in the past.
Usage: data-kilvish-date="past"
Example:
The date must be within the past 2 years. Example:
The date must be within the past 10 years.
Example:
The date must be before 2 years ago. 10.3 Date Range (Custom) data-kilvish-date="Between_2024_2025" Ensures the date falls within a specific range of years.
Usage: data-kilvish-date="Between_startYear_endYear" Example: Ensures the date is between 2000 and 2010. Example: Ensures the date is between 1920 and 1985. 10.4 Relative Date Validation data-kilvish-date="from_2023" OR "till_2025" Allows validation based on specific starting or ending years.
Usage: data-kilvish-date="from_year" or data-kilvish-date="till_year" Example: The date must be from 2023 onwards. Example: The date must be till 2025 (including 2025 but not beyond). 10.5 Date Should Not Be Today - data-kilvish-date="not_today" Prevents users from selecting today's date.
Usage: data-kilvish-date="not_today" Example: Today's date is not allowed. 10.6 Weekday or Weekend Restrictions data-kilvish-date="weekend" OR "weekday" Restricts the date to either a weekday or a weekend.
Usage: data-kilvish-date="weekday" or data-kilvish-date="weekend" Example: The selected date must be a Monday to Friday. Example: The selected date must be a Saturday or Sunday. 10.7 Exact Age Validation data-kilvish-date="exact_21" Ensures the user is a specific age.
Usage: data-kilvish-date="exact_age" Example: The user must be exactly 21 years old. 10.8 Specific Days Validation data-kilvish-date="first_of_month" OR "last_of_month" Restricts the date to the first or last day of the month.
Usage: data-kilvish-date="first_of_month" or data-kilvish-date="last_of_month" Example: The selected date must be the first day of any month. Example: The selected date must be the last day of any month. 10.9 Leap Year Validation ( NOt Developed Yet - Do NOt Use ) Ensures the date falls in a leap year.
Usage: data-kilvish-date="leap_year" Example: The selected date must be in a leap year. 10.10 Combining Multiple Conditions ( NOt Developed Yet - Do NOt Use ) You can combine multiple conditions using _.
Example: The selected date must be a future date and a weekday. Example: The selected date must be in the past, but within the last 30 days. 10.10 IF Age should be not pass perticular years in the Past or Future ( Old technique) user in input name='kildate' and put data-kilvish-date='_18_100' and type='date' You can combine multiple conditions using _.
Example: Birthday cannot be less than 18 years ago or more than 100 years in the future.**. 10.11 Date Group Validation — Start and End Dates (data-kilvish-dategroup) This attribute links two related date or month inputs (such as employment start and end dates) to enforce a logical sequence — for example, the "From" date should not be after the "To" date.
Format: data-kilvish-dategroup="X_Y" Y will be 1 or 2 ...so on
data-kilvish-date_name is optional if you want validaion of (fromDate to Todate )
data-kilvish-dategroup="GROUP_1" & data-kilvish-date_name data-kilvish-dategroup="GROUP_2" & data-kilvish-date_name
X is any unique group identifier (e.g., A, EMP, SCHOOL)
Y is 1 or 2
1 should be used for the earlier date field (e.g., start date)
2 should be used for the later date field (e.g., end date)
Or with data-kilvish-date_name
Use data-kilvish-date_name to show user-friendly error messages instead of raw identifiers like EMP_1.
Age Validation Using data-kilvish-age Use this attribute to validate age from a plain or field.
Attribute: data-kilvish-age="value" or data-kilvish-age="min_max"
Usage Patterns: data-kilvish-age="18" → Requires the user to be exactly 18 years old.
data-kilvish-age="18_60" → Accepts only ages between 18 and 60 (inclusive).
If the attribute is omitted, it defaults to exactly 18.
Validation Behavior: Input must be a valid number.
Field is cleared and error message shown if:
Non-numeric value is entered.
Age is below or above the defined limits.
Notes:
The attributes should be added to input elements where validation is required. These validation rules are handled client-side, so users will be notified immediately if they input invalid data. Customize the validation behavior further as needed (e.g., setting up custom error messages). Author: Vasu Birla [email protected]
You can include this script in your project via CDN:
