JavaScript Forms

A highly customizable javascript spinner. Some features: * Change value by using mouse wheel * Change value by "nudging" the label. * Change value by using the arrow keys * Automatic validation of key input * Support for decimals * Support for max-, and min values * Support for custom increment values * Support for "shift" key increment values. JS Unit tests are also available....
(show more)
(show less)

Smart Forms has more than 20 validation types and extra features that make using forms a better experience. The best practice of form validation involves two stages: 1) JavaScript validation since it is fast and it takes the load off the server; 2) Server-side validation since it does not depend on user's software and therefore it can not be bypassed. Smart Forms includes PHP script that performs exactly the same validation as JavaScript, so you can easily implement this scheme. Validation is based on data types (number, word, alphanumeric, date, e-mail, etc) and comparisons (including numeric, text length, and selected items count comparisons). Also, you can add extra features to the form, including character counters for textarea & input tags (this way, when you set length limitation you can let the user know how many character he/she has left), groups of fixed size fields such as year-month-day (when you enter 4-digit year the focus automatically shifts to the month field), etc...
(show more)
(show less)

This function allows you to read form variables from static HTML. Combined with the document.write() method, you can actually add dynamic content to regular HTML. Given a choice, server side processing of form variables is preferable.

This script adds auto-complete/type-ahead/ tracing/find-as-you-type effect to dropdown menus in Internet Explorer. In IE, when user press "MA" in a dropdown menu, IE will first select the first option starting with "M", then select the first option starting with "A", giving user "AK" while user actually wanted "MA" for Massachusetts. Using this script, user will get “MA” if “M” and “A” are consecutively typed (if user type “M”, then after a while “A”, user will still be taken to “AK” as an intended behavior). Comments in script is provided so that one can customize to determine how fast user has to type to get “MA” not “M”, “A”. Currently all printable characters on keyboard and keypad are supported (except for those needing the "shift" key). Both IE and Gecko-based browsers (firefox, mozilla, netscape, K-meleon etc.) are supported. Version 1.0 supports your using user-typed value to populate other menus....
(show more)
(show less)

Add accessibility to your text field, password field and textarea form elements with this handy javascript virtual keyboard. Simply include the javascript and CSS files in your pages, and apply a special class to the elements you want to be "keyboard enabled". An icon will appear beside all enabled form elements which, when clicked, will make a virtual keyboard appear *within* the page - NOT a popup window. Users can then type characters into your forms using the mouse only. Add your own keyboard layouts to make choosing the appropriate special characters a snap! Comes with 20+ keyboard layouts pre-configured. Users can switch between available keyboard layouts without reloading pages. Useful for letting users type special characters on computers which have unfamiliar keyboard layouts, avoiding keyloggers by bypassing the physical keyboard, or to allow text input from computers where keyboard input is impossible or has been disabled....
(show more)
(show less)

Form Validator gives designers and programmers working with Adobe Dreamweaver a very powerful form validator. This tool supports validation for required fields, integer/float numbers, positive numbers, ranges, string lengths, zip codes, email, checked boxes, compare fields (example for password confirmation), credit card syntax, and more. This validator also accepts regular expressions, useful for custom field validations. There are not programming or hand coding skills required, you can create the validation rules from a visual interface accessible from the Dreamweaver commands menu. The Javascript generated code is compatible with all actual browsers. You can validate multiple forms on the same page by using this form validator....
(show more)
(show less)

jsVal is a JavaScript program used for validating HTML Forms on the client side. This allows HTML forms to be validated in the browser without having to send a request to a sever (PHP, ASP, Perl...). jsVals saves you from having to write complicated validations on server side as well as helping you avoid having to rebuild and repopulate the form when validation fails. The advantage versus other client side HTML form validators is the ease of use and flexibility you'll gain. jsVal fits the needs for most HTML Forms, and can be also easily be integrated with existing HTML Forms....
(show more)
(show less)

The flooble color picker works using DHTML. Unlike other color pickers that pop up a new window and can get blocked by a zealous popup blocker, ours uses a dynamic DIV making it lightning fast! There is also an indicator square that lets your visitor see what color they picked. This free cross browser script has a number of easy integration options: Editable field, Uneditable field and Hidden field - for total control!...
(show more)
(show less)

Allows the user to comfortably specify some proportions in a form using a slidebar. The main improvement to other slidebar-implementations is that neighbouring sliders may move each other when touching.

Foul is a JavaScript based, form validation language. If you hate all the rigamarole you have to go through just to check a simple web form, then this script is what you need. Foul contains a full language parsing engine which compiles advanced conditions and tests for the fields of a form. The language makes building tests as easy as saying what you want. The tests include, blank fields, numbers, phone numbers, credit cards, urls, zip codes, states, emails, social security numbers, ranges, lengths, dates, file types and much more. Foul also contains an auto-formatting feature which fixes the data before it's sent....
(show more)
(show less)

CheckBox.XML is an unobtrusive and almost codeless way to give the ordinary checkboxes cool looks and appeal and yet keep their native functionality, for example - keyboard support, client events, etc. All you have to do is to register the runtime scripts, give a checkbox list placeholder(s) ID, set a skin and add checkbox items in a simple XML file....
(show more)
(show less)

A very simple and powerfull Search Listbox Items javascript !!!! This script search listbox items by entering first letters... usefull for long listbox.

Use this JavaScript to ensure that e-mail addresses provided in a form submission contain a prefix, the '@' sign, and an appropriate suffix (.com, .net, etc.).

Multi File Fields is an extension developed for Adobe Dreamweaver, which allows to dynamically generate file fields on a webpage. If you use Multi File Fields, you won't have to worry about the number of file fields to place in your forms; these will be generated dynamically when needed. This helps your website to be focused on your customers' needs....
(show more)
(show less)

Auto Complete is a tool that allows to create editable select/drop-down lists. The drop-down list is filtered on real time based on the user's input. This way the users are not restricted to the values already in the list and does not need to make the selection from a very long list since the number of items on the list decrease based on the users' input. This tool is a Dreamweaver plugin (extension), to create an "Auto Complete" list all you need is to create a normal select/drop-down list and then apply the "Auto Complete" tools with a click from the Dreamweaver menu to convert it. This tools does not require server side scripts, it is based 100% on standard browser-side JavaScript....
(show more)
(show less)

nioColorfind uses a super smooth interface to allow your users to pick HEX colors quickly and easily. It utilizes a overlay Javascript layer which is displayed when the users presses the "pick color" button next to the form and it is almost guaranteed to work perfectly on your site. Unlike some Javascript colorpickers nioColorfind allows access to way more than 1,000,000 colors quickly and without straining your webserver bandwidth. nioColorfind released as 1.0 BETA and any problems or bugs that are reported will be fixed relatively quickly. It is developed by the professional web designers from nioDesign.com. It is coded and tested to work in IE6+, Firefox 1.5+ and Opera 9+. Support for Safari and Konqueror are planned - please report any problems you experience in these browsers....
(show more)
(show less)

This script retrieves the title from option tags included in a form and display the title inside a div box at the bottom of the multiple combo. It uses the getElementById() function.

dhtmlxTreeGrid is a full-featured Ajax/JavaScript component that combines editable table and tree view. It represents both hierarchical and tabular data and allows client-side data entry and editing. Ajax support and rich JavaScript API brings great flexibility to the treegrid allowing you to create customizable dynamic tables with expandable rows. dhtmlxTreeGrid supports data sorting, column resizing, drag-and-drop and different cell types (multiline text, image, combo box, list box, checkbox, radio buttons, etc.). It also provides drag-and-drop feature that allows you to easily rearrange tree items with corresponding rows....
(show more)
(show less)

There are 2 examples showing how to filter out unwanted characters from an input box using one function and the onkeyup event. Live demo.

If you'd like to know where visitors to your site live, add this script to your feedback forms. Users just choose a region, and the second menu changes appropriately, allowing them to choose their country. (If they choose USA, it allows them to select their state)...
(show more)
(show less)