JSColor is a simple and very easy-to-implement JavaScript library that transforms any given input into a color picker.

The picker is a hidden layer, doesn't use any pop-ups and can be positioned on any side of the input field.

It has 2 modes; HSV (hue saturation, value) or HVS, can be set to display a default color on initial load and its look can be customized.

There are functions provided for showing/hiding the color picker and it can generate RGB or HSV values from a HEX input.

Building good-looking HTML forms which work well in every browser and applying client+server-side validation usually takes a serious development time.

Zebra_Form, a free PHP library, handles this process very well and enables us to create secure and chic forms with a few lines of PHP code.

The output can be generated either with the ready-to-use styles (with valid HTML) or with any new/custom ones.

An integrated cross-site scripting prevention mechanism removes any possible malicious code submitted. It also helps preventing automated spam submissions.

The client-side validation is handled with jQuery, alerts are displayed inside tooltips and many validation types can be used (like "required, e-mail, length, etc.").

Besides standard input types, Zebra_Form supports Ajax-like file uploads, date-time pickers and captchas.

Ajax Form Pro, a professional PHP script for creating Ajaxed forms easily, is giving away 5 Extended Licenses ($47/each) to WRD readers.

There is also a special discount offered where all the details can be found at the end of this post.

What is Ajax Form Pro?

It is an advanced yet easy-to-use PHP script for quickly building Ajaxed and real-time validated forms of any type (like contact forms, employment forms, etc.).

Using Ajax Form Pro, it is possible to use every input type within the forms (textboxes, textareas, single/multiple selects, checkboxes, radios) and style them completely with CSS. Also, file upload feature is on the way.

The script can be used to create multiple forms on the same page or different pages

Every field is validated as-the-user-types where notifications are shown/hidden instantly. Like many other features, this is also optional.

For a minimized number of spam messages and a secure form, there is a flexible and built-in CAPTCHA.

Once a form is submitted, e-mails can be sent either with the mail() function or through SMTP. They can also be sent to the appropriate contacts depending on the category selected (or to multiple recipients without disclosing all the addresses to each one) and a copy can be e-mailed to the end-user.

It has ready-to-go creative uses like Lightbox integration and forms inside sliding interfaces (from top or left-side).

Ajax Form Pro is unobtrusive, will convert to a standard form if JavaScript is disabled and still function properly.

It is well-documented, comes with all the source code and has a full list of demos.

Simply, a handy resource that simplifies a time-consuming process and makes creating an unlimited number of forms for yourself and your customers a breeze.

The special discount

Update: The discount code is expired.

Ajax Form Pro is offering a 30% discount to WRD readers when the discount code "wrd" is used.

The code is valid by now and will be active only for few weeks.

How to win the licenses?

In order to win one of the 5 Extended licenses given away, simply comment to this post and winners will be selected randomly with the query below on 18 April 2011 (1 week later):

SELECT * FROM wp_comments WHERE comment_post_id=2188 AND comment_approved=1 AND comment_type='' GROUP BY comment_author_email ORDER BY RAND() LIMIT 5

Good luck to all.

jQuery File Upload is a plugin for the popular JavaScript framework that helps handling file uploads.

The plugin is based on open standards like HTML5-JavaScript and doesn't use Flash. For legacy browsers it falls back to an Ajaxed-like iframe-PHP solution.

Multiple files can be selected, they can even be drag 'n' dropped from the desktop and the upload process can start automatically or with an event (like clicking the "upload" button).

A progress bar can display the status and uploads can be canceled anytime.

It is possible to use multiple instances of the plugin in the same page and jQuery File Upload is compatible with any server-side application platform.

Creating a well-functioning form, how simple or complicated it is, requires a serious effort as it has various ingredients including (cross-browser) design, validation, and usability.

jFormer, a form framework built on top of jQuery brings a complete, easy-to-use and solid solution to handling them.

It enables us to build forms which are validated on client-side and server-side (PHP solution is included) with Ajax requests where users are notified in a very chic way with tooltips and CSS-styling on every level.

The framework has advanced features like cloning forms and/or form fields, dividing a form into pages, creating dependencies and much more.

Default styles for every part of a form is already included and they can be customized/improved further quickly with CSS.

Naked Password is a jQuery plugin which helps encouraging web users to enter stronger passwords, in a fun way.

With a single-line-function, it adds a notification to any password field where a pixelated-lady gets naked according to the password entered.

A very good thing about how the plugin functions is that it doesn't require that much of an extra space to notify users. So, it can fit to many live forms without breaking anything.

Also, the images displayed can be changed with any others if you prefer to keep the site not-naked : ).

HTMLform.com is a free web application which enables anyone to design forms online and get the source files (HTML/CSS/JS/PHP).

Without the need of a registration process, you can instantly start setting up a form with:

• any form field (including file uploads)
• tooltips for every item
• validation rules (with regex support)

Besides standard form items, captcha (re-captcha) can also be added for minimizing spam.

Every data submitted is kept in a PHP flatfile database engine and with a password login you'll be able to (the script is provided with the download of the designed form):

• browse the records entered
• exporting them into a CSV or Excel file

Also, optionally, you can get notified via e-mail every time a new entry is submitted.

HTMLform.com has built-in support for multilanguage forms and there are many features offered for more flexible outputs.

jQuery.validVal is plugin for the popular JS framework which aims to simplify form validation.

It can be used for validating any kind of HTML form (including Ajaxed ones) and works by defining the rules within class names.

There are 3 default validations included ("required", "numeric" and "email-format") and new ones can be included by defining new regular expressions.

A very nice built-in invalid handler helps calling-to-action on invalid fields and its behaviours can be quickly changed or improved.

Sometimes, a static form is not enough as we may want to make it possible for user to define a flexible number of addresses, phones, e-mails, etc.

This is where SheepIt!, a jQuery plugin comes in. It allows cloning form fields dynamically where end-users can easily decide to insert a new field (or remove a manually inserted one).

Multiple form elements can be added at the same time and there are callbacks provided for each events (before/after the insertion of elements).

Signature Pad is a jQuery plugin which transforms an HTML form into a canvas where users can draw their signatures.

It has 2 modes:

• TypeIt mode where the user’s signature is automatically generated as HTML text and styled with @font-face from the input field where the name is typed.
• DrawIt mode where the users can draw their signatures on the canvas element.

The signature submitted is stored as a JSON array which makes re-generating it possible.

And, the plugin doesn't need to be used as its name suggests, you can ask users to draw anything and store it easily.