The Smield

An unobtrusive javascript UI Helping Smart Field using the Prototype library

Try it with: Yui, Prototype, MsAjax, None [minified]

The 'smield' is a useful little user interface widget written in javascript. It combines the values of other fields on the page to allow for easier input of repeated content. Based on some javascript configuration (yep, it's manual configuration), the smield will insert an unordered list of label and radio button pairs under the target input field (of the smield).

A few common examples might be:

The smield allows the user to easily select the value for the new field based on the information already entered in the form. Don't want to decide on a new username? Click the "Use Email" option below the username field.

To check it out, view page source, view the javascript source for the smield (or minified source), it's css, and the example configuration for this page: setup.js

Click here to reveal the field of the smield! or show what the smield added.

Example Smield Form of a 'Customer'
Company
   
First Name
Last Name
   
Known As
   
Email
   
Username
   
User Prefix

Features

* individual results may vary

More Information

You can read more about the smield (like configuration and how it plays nice with other javascript libraries) at the following blog post: