This a jQuery based Form validation toolkit. Following are documentations examples on on usage and reference.
Features
- → Attach it to an entire form or selected form elements
- → Supply validation requirements as HTML5 input attributes in plain HTML
- → On change validation
- → On submit validation
- → Option to display error messages in a bubble
- → Option to display instruction messages (not errors) in a bubble
- → Detailed error report as form's jQuery data at form submission
- → Validate required fields
- → Validate data type (required or no-required)
- → Validate data formats (required or no-required)
- → Force data types (required or no-required)
- → Conditionally make a control required or not-required
- → Display required flag, and validation status flags
- → Attach and detach custom errors not defined at form level - i.e. for AJAX based validation result
Installation
Include the following files in order of listing. CSS Files should be in the head section. JS files can be either in head or at the bottom of page (recommended), except Modernizr.- → validation.css - Required. Customize look & feel elements as needed
- → Modernizr - Optional. Can be used for HTML5 feature detection
- → jQuery (1.6 or 1.7) - Required
- → utils.js - Required. Extends JavaScript and jQuery's libraries' API set
- → class.bubble.js - Required. This is a jQuery plug-in for the input message bubble
- → validation.js - Required.
Include the images files in the following folders in your website:
- → /images/forms/* - Required. Change some of the images for your needs. Make sure to update CSS if needed after such changes.
- → /images/bubble/* - Required. Change some of the images for your needs. Make sure to update CSS if needed after such changes.
Implementation References
- → Setup a Sample Form
- → Types of validation
- → HTML 5 Attributes of Controls
- → Public methods
- → Result Data for the Form
Examples and Tests
- → Sample Form: Various Error Handling Example
- → Data Type Tests
- → Delayed Initiation Example
- → Conditional Initiation Example
- → Custom Error Attachment Example
- → Enable/Disable Submit Buttons Example
- → Custom Validation Call Example
- → Force Data Type Example
The Bubble
- → Example