FormFields is a very handy resource which makes it easier to produce more usable form entry fields with ASP.NET.
Rather than writing markup over and over for things like validation, regular expressions, dropdownlist databinding, etc., FormFields handles all the hassle for you.

Here is an example date input with a date picker & validation:
<formField:textBox ID="tb_SchoolDate" runat="server" Type="Date" Required="True" Title="School Date" />
Yes, that easy & with a clean markup (the look & feel can be customized via CSS).
FormFields requires .Net Framework 3.5 & AjaxControlToolkit to run.
Requirements: .Net Framework 3.5 & AjaxControlToolkit
pForm is a web-based & free HTML form builder application for creating good looking forms easily.
It offers various color schemes to get started & enables you to design your form with an Ajaxed interface.

Any type of form objects (text fields, checkboxes, dropdowns, file upload fields, etc.) can be added & every field can be customized (field label, type, size..).
Once the form design is completed, it can be previewed & ready-to-use HTML/CSS files can be downloaded as a .zip file.
To get amazing features like saving entries to database, input validation & much more, you can check the commercial product of the service: MachForm.
Requirements: No Requirements
Position Absolute is sharing an easy to use form validation engine built with jQuery.
It offers a flexible way of displaying errors that will possibly match any type of form design. When the script detects an error, it creates a div, positions it at the right-top corner of the input & displays it like a tooltip with the error message inside.

Validation rules are created inside the classes of every input field like:
<input class="validate[required,custom[onlyLetter],length[0,100]]" name="first" type="text" />
It currently support rules like:
- required
- length
- telephone
- email
- onlyNumber
- onlyLetter
- & more
Also, you can define custom rules via RegEx & error messages can be localised with custom language files.
Requirements: jQuery
Compatibility: All Major Browsers
FancyUpload, the popular Ajaxed file uploader, now has new version with more features.
To remember, FancyUpload is an unobtrusive file-input replacement with multiple-file selection & queued upload with an animated progress bar.

It uses MooTools, works with the help of Swiff (a MooTools class) & as a SWF file is used for uploads, it is server-independent.
Other great features of FancyUpload:
- the look & feel can be totally customized via CSS/XHTML
- uploads can be limited with file count, file type or size
- upload speed can be displayed
- browse-button can be an invisible overlay or an interactive image sprite
- useful file information before the upload starts can be collected & many more.
The API is very flexible, offers lots of options & very well-documented.
Requirements: MooTools
Compatibility: All Major Browsers
For membership-oriented websites, registration forms are one of the most important parts. A problematic experience, even if the sign-up is completed, will place a "question mark" to the visitor or vice-versa.
And, it is also the first step where you can show that you care about the security of the website & all the data collected.
Although you can control/improve the security of the website, it is sometimes the weak passwords used that may have unwanted consequences.
Guiding users to have a strong password with the help of password strength meters, besides being an easy process, will help improving the security of the whole & show that the website pays attention to it.
Here are 10 password strength meter scripts for a better registration interface:

PasswordMeter is a JavaScript function that checks the strengths of passwords with a well-defined algorithm.
And, the website of the resource nicely displays how the strength is calculated.

This password strength meter is an improved version of this script. It that has a graphical interface (uses Prototype & Script.aculo.us) that shows the strength of the input.
Read the rest of this entry »
It is possible to create stylish textboxes with auto-complete feature, just like Facebook has, using plugins for jQuery & MooTools.
For jQuery:

Autobox is a jQuery plugin that makes creating textboxes with auto-complete support easier.
Values expected can be mentioned staticly or called dynamically via Ajax requests. Documentation for the plugin can be found here.
For MooTools:

TextboxList, a MooTools plugin, for creating auto-complete enabled Facebook-like inputs has a new version (see WRD post for the old version).
It can be feeded with data from any data-source easily, makes a binary search for a better performance & offers various options for maximum flexibility.
jQuery Keypad is a plugin for creating more secure input entry by providing a keyboard like interface.
The values to be displayed can be easily set which makes it possible to show only numbers, foreign letters, etc.

The keypad can be displayed with various animations like "fade in" or "slide down".
It can display the letters/numbers randomized which is a very effective security solution against key loggers.
Besides these, there are many options provided like:
isRTL: the text will be displayed from left-to-right or rightto-left
clearText: for clearing the input field
keypadClass: the stylesheet for the keybad for a better customization
- & many more..
Requirements: jQuery
Compatibility: All Major Browsers
This is a jQuery plugin for creating a file-upload functionality quickly & easily.
It inserts a Flash browse button (that can be customized) in to the webpage where users can select a single file or multiple files and view the upload progress.

The plugin comes with a PHP file for uploading the files. But that can be converted to any language of your preference.
There are various customization options provided like:
- Paths of the files used & the folder where files will be uploaded
- Enable/disable multiple uploads
- Browse & cancel buttons used
- Extensions & size limit allowed
- Enable/disable auto-upload after selection
- Callback functions at every step
It comes with the FLA file too & a demo can be found here.
Requirements: jQuery, Flash Player 8+, PHP
Compatibility: All Major Browsers
MachForm, an easy to use & quality HTML form builder application, is giving away 3 licenses to WebResourcesDepot readers ($39/license).
You can find the details on winning the licenses at the bottom of the post.

What is MachForm?
It is a browser-based, installable HTML form builder that comes with full PHP source code (& uses MySQL for storing data).
Whether you’re a developer & can create your own forms or not, MachForms offers more than a standard form:
Front-end:
- It supports any types of elements:
- text
- paragraph
- multiple choice
- dropdown
- address & more..
- File uploads (users can upload files!)
- Secure: reCaptcha support.
- Form validation (required-duplicates allowed? or not? – with chic tooltips)
- Password protected forms
- Limiting to 1 entry per user
- Easy styling: each form has its own CSS
- Custom redirection after a form is filled

Back-end
- You can create new forms instantly
- Forms can be designed from an Ajaxed admin interface with drag’n drops
- Collected data can be exported to Excel & CVS
- Get notified when a form is filled (multiple e-mails supported)
- 1 click installation & more..
To sum up, MachForm is a complete form creator & manager for a website that can be used by anyone with ease.
There is a demo for the application, give it a try..
How to win the free licenses?
Commenting to this post is enough to join this giveaway.
Winners will be selected randomly via the query below on 20 January 2009 (1 week later).
SELECT * FROM wp_comments WHERE comment_post_id=740 AND comment_approved=1 AND comment_type='' GROUP BY comment_author_email ORDER BY RAND() LIMIT 3
Good luck to all : ).
Requirements: PHP, MySQL
Compatibility: All Major Browsers
JSValidate is a free library for validating forms that requires Prototype & Script.aculo.us to run.
Some rules it supports are:
- Required field
- Only numbers
- Only letters
- E-mail
- Credit card number format
- US zip code, phone number & state code formats

It works by simply updating class tags of forms with the related rule information.
It lets you define in which tag & class the errors will be displayed & some more.
There is also a jQuery port on the way, named JValidate, which is not out yet but will be sharing at WRD for sure when it is published.
Requirements: Prototype & Script.aculo.us
Compatibility: All Major Browsers (Safari not tested)