JavascriptToolbox.com Now Available!

Almost all of my javascript code has been moved over to its new home at The Javascript Toolbox. Please go there to find the latest scripts, information, etc. These pages will remain here for a while for historical purposes in case anyone needs a production copy of old code.

OptionTransfer

[Javascript Toolbox] [Example] [Source]

Description:
This widget is used to easily and quickly create an interface where the user can transfer choices from one select box to another. For example, when selecting which columns to show or hide in search results. This object adds value by automatically storing the values that were added or removed from each list, as well as the state of the final list.

Example:

(In newer browsers, you can double-click the options!)

These options are configurable in the source:
Delimiter:
AutoSort:
Options that Match this regular expression cannot be moved:

The fields below show the status of the list boxes as items are passed back and forth. Normally these would be hidden fields which you would then use to process the changes on the server-side. Your form doesn't have to include all the fields below - you can choose to store only the items added to the right list, for example.

Removed from Left:
Removed from Right:
Added to Left:
Added to Right:
Left list contents:
Right list contents: