Payment Info is a one-line, mobile friendly credit card input tool. The idea behind this plugin is to create a more streamlined credit card entry process.

The plugin was inspired by Luke Wroblewski’s thoughts on streamlining the collection of payment information by using input masks:

“Input masks constrain text entries to help people avoid mistakes. For example, a phone number input mask could only accept numeric entries and ignore any alphabetic characters or punctuation. Acceptable numbers could be limited to just a range, a specific pattern, or a combination. Input masks don’t just prevent errors, they can also guide people by presenting and maintaining input hints like specific formatting requirements. And last but not least, input masks can integrate multiple questions into logical sequences, keeping people from having to move between multiple input fields in a form.”

This is the concept employed by this simple plugin. The tool helps to seamlessly guide the user through the needed inputs to complete a transaction, but without having to navigate through multiple fields to accomplish this task.

Payment Info results in an easy tool that contributes to usability for your website.

Hate when users submit a form with an email address that just does not work? This little tool — addClassWhenEmail — solves that problem.

The plugin hides the submit button for email forms by default and shows it only when the user enters a valid email address. It works in that the Javascript sets a “trap” on the input field to check with a little help from RegExp if the typed text has “symptoms” of an actual email address. The check is performed with each symbol typed. In case of success, a custom class name is added; if not, it’s removed. The rest is be handled using CSS.

The tool works in a loop so that you can have multiple newsletter subscription forms on the page and each one will be served using this tool. If you need different configurations for each form, you can do that as well.

This tool can be installed in the form of a plugin or with the code. Both options are available in the documentation. The tool is also super-small and lightweight, so you won’t have to worry about it bogging down your website.

A tiny jquery plugin to validate your forms.

Check your data against regular expressions or known keywords – such as ’email’, ‘phone’, etc.

A library for building credit card forms, validating inputs & formatting numbers.

Powerful, UX Aware & Dead Simple javaScript Forms Validation Library

Detects and validates credit card numbers.

A jQuery credit card validation plugin, that makes credit card format validation a simple task

Suggests the right domain when your users misspell it in an email address.

jQuery.validVal is a plugin designed to simplify form validation.

Valid8 solves both simple and complex validation scenarios.

jQuery.validity is a jQuery plugin for powerful, accurate client-side form validation.

Javascript control plugin that allows you to limit what characters a user can enter on textboxes or textareas

Simple cross browser detection of text changes for input and textarea elements.