|
|
Click on a heading below to select a JavaScript. To
view the source code for the JavaScript Right Click
the mouse button over the JavaScript window and then
select "View Source" from the pop-up window
Copy and paste the code. If any graphics are used in
the script. Right Click the mouse button over each graphic
and then select "Save Picture As" from the
pop-up menu. All the graphics should be put in the same
directory as the JavaScript. To go back to the Index
just close the JavaScript window.
|
|
| Accept
Terms |
This Script allows your visitors or customers to accept
your terms and conditions before proceeding by ticking a Check
Box. If they don't agree, an exit box on the form takes them
back to the home page.
|
| Agree
Before Entry |
JavaScript will only let you enter your name in this form
if you indicate you agree to the terms by first clicking the
I Agree radio button. If you agree, you can enter your name.
But, if you disagree, you will not be able to enter or edit
your name. When you disagree, the box is 'locked.' Useful
if you require your visitors to accept a disclaimer before
downloading software or visiting a section of your members-only
site.
|
| Aim
Message |
Send messages to anyone using AOL Instant Messenger.
|
| All
Lower Case |
Converts a textbox entry to all lowercase letters as soon
as they move to the next item in the form (or click the submit
button).
|
| All
Upper Case |
Converts a textbox entry to all capital letters as soon
as they move to the next item in the form (or click the submit
button).
|
| Anywhere
Mail |
Use this script to allow visitors to mail anyone, at any
time.
|
| Auto
Currency |
Inserts the proper separators to automatically format any
currency field.
|
| Auto
Drop Down |
Automatically adjusts the values in the selection box depending
on the item selected in the drop down menu.
|
| Auto
Month |
This pulldown menu will automatically adjust the range of
months so that the current month is at the top. The remaining
months are placed in order after the current month.
|
| Auto
Tab |
Automatically sets focus to the next form element when the
current form element's maxlength has been reached. This way,
the user does not have to manually click in or tab to the
next field. This script is perfectly suited for constant-length
strings such as a phone number or social security numbers.
|
| Auto
Year |
This pulldown menu will automatically adjust the range of
years depending on the current year. As an added bonus, the
range is easily modified.
|
| Basic
Validation |
The simplest way to require visitors to fill out certain
fields is to us this script - just add the word "required"
to each required field's name and your visitor must fill it
out to submit the form!
|
| Block
Key Press |
(Internet Explorer Only) Using the OnKeypress event, you
can trap and prevent certain characters (repesented by ASCII
decimal codes) from being entered in a form field. Just look
up the ASCII code for any other characters you wish to block
and add it to the script. Unfortunately, Netscape does not
support this same functionality.
|
| Check
Form |
This form validation script will place a check in the checkbox
next to a textbox in a form if the enty is valid. Includes
basic form validation.
|
| Check
Entry |
Prevents the user from selecting a filename with a space
(known to cause problems with some CGI-scripts). The visitor
are informed that the field can not have spaces. Of course,
you could change the character it checks for as well as the
invalid alert message to something else to suit your needs.
|
| Checkbox
Counter |
Easily count the number of checkboxes that have been selected.
|
| Checkbox
Text |
(Internet Explorer Only) The user no longer needs to click
precisely on the checkbox to check and uncheck it. Clicking
the text after a checkbox can do this just like windows programs.
|
| Checkbox
Changer |
Takes a series of known named checkboxes and checks or uncheck
them all at once. It can even change each checkbox to the
opposite checked or not checked value.
|
| Commas |
Quickly add commas to any numerical form input. Great for
displaying large numbers!
|
| Confirm
Order |
JavaScript can take the contents of an HTML order form,
process them, and display the order for verification even
including the grand total! When the user confirms the order
by clicking the button, the order is emailed to you by using
freedback.com's free form processor cgi script. This script
does take a bit of modification, but surely is worth it if
you sell anything online.
|
| Confirm
Order 2 |
Part 2 of the Confirm Order script.
|
| Confirm
Order 3 |
Part 3 of the Confirm Order script.
|
| Controlled
Boxes |
This script allows checkboxes to check and uncheck based
on the selection in another checkbox. If the ALL box is checked,
all the other choices go unchecked. If another choice is checked,
then the ALL box goes unchecked. Useful when constructing
search forms, surveys, and more!
|
| Copy
Fields |
Allows the user to click a checkbox on a form to duplicate
information. For example, they can copy their billing information
into the shipping information fields (assuming they are the
same) with one click!
|
| Copy
Name |
Allows the user to enter their name in the first field and
have copies it to the second field for use as the User ID.
It occurs instantly when they click the next field or the
submit button. And, if the user tries to modify the second
field, it is changed back to the value of the name field.
Definitely a good example of the onChange() event handler
in use.
|
| Country |
If you'd like to know where visitors to your site live,
add this to your feedback forms. They 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)
|
| Currency
Format |
This script accepts a number or string and formats it like
U.S. currency. Adds the dollar sign, rounds to two places
past the decimal, adds place holding zeros, and commas where
appropriate. Occurs when the user clicks the button or when
they finish entering the money amount (and click into the
next field).
|
| Day
Menu |
Do you need your visitors to select a day from this month?
Here's an excellent way to do so - they get a pulldown menu
containing the entire month and the current day is already
selected!
|
| Decimals
Allowed |
Allows the user to enter a number with up to 2 decimal places
in a text box. In other words, 99 is ok, 99.9 is ok, 99.99
is ok, but 99.999 is rejected. You can easily change the number
of decimal places that are permitted. (i.e. 1, 2, 3, etc.)
For the example, enter a number with up to 2 decimal places
then try entering one with more than 2 decimal places.
|
| Disable
Submit |
(Internet Explorer only) When the form is submitted, any
submit and reset buttons are disabled. This prevents the user
from submitting the form repeatedly, whether by accident or
on purpose. The form will just act normally for Netscape users.
|
| Dynamic
Table |
(Internet Explorer 5+ and Netscape 6+ Only) Enter information
into this dynamic table and see the power of W3C-DOM compatible
browsers.
|
| Dynamic
Input |
(Internet Explorer Only) Offer a form with as many input
boxes that the user selects. After entering the number of
boxes, the form is dynamically updated while the rest of the
form remains untouched.
|
| Email
Domain |
Takes an email address and returns just the domain - the
stuff after the "@" sign. We've put it together
with a simple WHOIS query.
|
| Email
Validation Basic |
This is a simple e-mail address validation script. While
it is not too sophisticated, it does provide the basic validation
function.
|
| Email
Address Validation |
This is an e-mail address validation function. It allows
the usual user@domain syntax, but in addition allows user@[ip]
format as well as "User with Spaces"@domain or [ip],
all of which are legal syntax, according to W3C. It also checks
that the user hasn't done anything silly like having multiple
@'s or continuous .'s in the address (e.g. jim@b@c.com and
jim@c..b.co.uk).
|
| Encode
Special Characters |
When submitting the form "GET" method, JavaScript
can encode special characters with the escape() function.
Great! (Enter a nickname or password with some special variables
then click 'submit' to see the web address which contains
the encoded (%xx) characters.)
|
| Expanding
Textbox |
Automatically expands the size of a textbox to fit all of
the entered text. Internet Explorer Only.
|
| Extended
Characters |
Having trouble remembering the extended character codes?
It's now as easy as a press of a button.
|
| Extract
Email |
Visitors sometimes include their email address inside the
message field when they fill out forms. To deal with this,
this script parses through the string and uses a Regular Expression
to find then return a comma-separated list of the valid email
addresses it finds.
|
| Field
Explanation |
Opens an explanation window to explain the various fields
used in a form on your site when the help link is clicked.
You can easily explain various form fields will be used on
your site, what type of input is required, or any other information
you wish to share. They may also type their entry in the popup
window and it will be copied into the form.
|
| File
Open |
This script allows someone to choose a file on their hard
drive and open it. Now cross-browser compatible.
|
| First
Form Field |
This script places the cursor in the first field of a form
when the page loads and when the form is reset or cleared.
The script works with input types: text, textarea, radio,
checkbox, password and Select drop-down boxes.
|
| Form
Focus |
Places the focus on the first editable field in a form on
any web page.
|
| Form
Swapper 2 |
Move selected items from one list box to another using "<<"
and ">>" direction buttons. It works like
database field selection, supports selecting multiple items,
and even can sort the moved item into the new list. Newly
modified, more efficient algorithm!
|
| Form
Totals |
Presents an order form with checkboxes and upates the total
price as the user checks and unchecks boxes. The visitor also
cannot change the total field. Currently only supports selecting
one of each item.
|
| Form
Target Formatting |
Allows you to format the target window of a form from the
form's target property. This allows for the use of window
properties, variables, and other data manipulation to effect
these options.
|
| Format
Input |
Format the text case inside a form, reverse the text, or
see the ASCII code behind the input.
|
| Format
Date |
Automatically formats date fields as the user enters the
information. Also validates the date when complete date has
been entered. Cross browser compatible, including Netscape
6+.
|
| Htm
Preview |
Preview HTML in a new window by entering it into the form.
This script allows you to pass anything to a new window.
|
| Ignore
Spaces |
Removes spaces from a string variable within a script or
from user input into a text box. Several different uses are
shown on the script example page.
|
| Initial
Caps |
Converts the first letter of each word in a string that
the user enters to uppercase. The remaining letters of each
word are also changed to lowercase. Very useful when a form
requires a title to be submitted in Initial Caps.
|
| Items
Popup List |
If you have several items for the user to pick from, you
may notice that your page can quickly becomes cluttered. This
script helps solve that problem by opening a new window when
the user wants to add items to the list. The new window displays
the items and passes the selected item information back to
the list in the main window.
|
| Items
List |
Javascript can remember a list of several items you enter.
Just enter an item and click 'Add to List'. When you are finished,
click 'Show List' to see the entries.
|
| Limit
Textarea |
This script controls a maximum textarea input amount and
updates a small counter with how many characters are left
with each keystroke. Dynamic fix now allows you to use this
script in multiple textboxes on a page.
|
| Limit
Boxes |
Limits the number of checkboxes that the user is able to
check on your site. Ideal for situations when more than one
selection is allowed up to a certain number overall. If they
select too many, they are notified of the maximum allowed
and their last entry becomes unchecked.
|
| Line
Wrapper |
Wraps entries in a textarea box to whatever number of characters
per line you want. For example, The script can automatically
insert a return after each 50 spaces, so that the form contents
you receive are more readable. (The script does indifferently
break lines in mid-word, a possible fix for the next version?)
|
| List
Chooser |
The user can immediately locate what he has been searching
for in the long options list just by typing. With each character
the user types in the text field, the available items listed
are narrowed down (similar to a help file's index feature).
(Start by entering an 'a' to narrow the list)
|
| List
Organizer |
Easily organize a list of values to place them in any order.
Allows you to add and delete from the list!
|
| Locked
Textbox |
Prevent your visitors from modifying the value stored in
a textbox (without using input type=hidden) Just try to change
the text in the box! Amazingly, it's a short less than one
line script!
|
| Mail
Pick Subject |
Use Javascript to help organize your visitor e-mail. Visitors
pick from several predetermined subjects the most appropriate
subject for their e-mail. Visitor are also prompted to reenter
information for incomplete or invalid entries. A cookie also
records the visitor's name for future e-mails.
|
| Mailing
List |
Use Javascript to sign up visitors for your mailing list.
Once again, Javascript ensures that the visitors have filled
out the form completely and correctly. Visitors area also
prompted to reenter any incomplete or invalid entries.
|
| Max
Entry |
Make sure your visitor doesn't exceed the maximum number
of characters that you want to accept in a form. Short too!
|
| Memory
Cells |
Need to save values from a text field off to the side to
free up a form for another calculation? This JavaScript lets
you do just that!
|
| Money
Filter |
Removes the dollar sign ($) and commas (,) from a a text
box. Useful if you require input of only numbers. You may
also modify the script to filter out whatever characters you
want.
|
| Multiple
Mailer |
JavaScript can help you send an e-mail to anyone on your
"list". Just use the pulldown menu to select a recipient,
compose your message, and hit 'Send Message' to send it.
|
| No
Duplicates |
Prevents you from selecting the same choice when choosing
from two different pulldown menus.
|
| No
Entry |
Use Javascript to ensure that visitors do not leave a form
entry blank
|
| No
HTML |
Use Javascript to ensure that visitors do not type in HTML
entries.
|
| Only
One Field |
The visitor must fill in either one of two fields, their
name or email address. If they click in either box the other
box's value is erased. Ensures that when the form is submitted
only one field contains a value. Also contains validation
that makes sure both fields are not empty.
|
| Open
Window |
Use Javascript to allow visitors to open a customized window.
|
| Option
Search |
Allows you to jump to any value in a drop down list. In
our example, search for a value between 'a1' and 'a15'. Saves
time when it comes to navigating within long pull down menus.
|
| Pass
Menu Frames |
After the user selects an option in the pulldown menu in
the left frame, JavaScript can pass that option's value into
a text box in the right frame when the button is clicked.
|
| Pass
Textbox Frames |
Copies the text in a box in the left frame into a box in
the right frame when the button is clicked. A clever way to
pass values in frames.
|
| Password
Verifier |
Keep your visitors from submitting their form until their
"password" and "re-enter password" fields
match, for verification purposes. They get an error message
telling them to re-enter the passwords if they do not match.
|
| Quantity
Totals |
: (Best with Internet Explorer) Update to our Form Totals
Script. Allows you to enter a quantity of each item selected
and finds the total automatically.
|
| Radio
Totals |
(Best with Internet Explorer) Select items in this totals
form using checkboxes and radio buttons.
|
| Remove
Returns |
Converts carriage returns in a string to the tag so that
the input can be properly displayed in HTML. Without the script,
returns in an input field are not preserved when submitting
in a form. Useful for guestbooks or other times when a user's
input must be preserved.
|
| Replace
Characters |
Replaces a character or multiple characters in a textbox
when the visitor goes to the next field (or in this example,
clicks the submit button).
|
| Required
Fields |
Checks form fields to verify that each specified field is
not left empty. Displays a warning message if any empty fields
are present.
|
| Search
Box |
This JavaScript search form opens a seperate window where
you can select from search engines such as Yahoo!, Excite,
and more.
|
| Selection
Box |
Copy items from one selection box to a second selection
box. Selected item values are stored as a string for further
manipulation, such as submitted through a form, an alert box,
etc.
|
| Selection
Order |
Adjust the order of the items in a selection box and submit
them in that order.
|
| Select
One |
Limits the number of checkboxes a user may click by deselecting
the others upon selection.
|
| Select
All |
Select the text from any form with the click of a button,
just as used on the JavaScript Source.
|
| Sentence
Caps |
Use Javascript to convert entries to sentence caps. Also,
this script prevents jokers from typing in all caps.
|
| Smart
Pulldown Menu |
Uses cookies to let a dropdown list remember which option
was chosen when a user returns to the page. It comes in very
handy if you have a page that is frequently accessed and users
tend to repeatedly chose the same option from a list.
|
| Smut
Engine |
Use Javascript to ensure that forms submissions to do not
contain words you don't want. It can eliminate dirty words
or competitors' names.
|
| Spaces
To Plus |
Replaces single or multiple spaces in a text box entry with
plus (+) symbols. Handy if your server's form processing or
database management program requires this type of encrypted
format.
|
| Strip
Characters |
Strips the characters from an input string. You can change
the characters you want removed from the string by changing
one line of code.
|
| Submit
Link |
Now you can easily use text or an image as a submit button!
|
| Submit
Once |
Do you ever receive multiple copies of a single form submission?
Do your visitors click the submit button over and over, hoping
it will hurry up the process? Well, JavaScript can solve your
problems! The script will prevent the visitor from submitting
the form after the first submission. Basic field validation
also included!
|
| Submit
Changer |
Changes the caption of the form's submit button while the
form is being submitted. This helps eliminate the confusion
that can sometimes occur when a form takes quite a while to
be processed by the server.
|
| Suggestions |
Use Javascript to allow visitors to send your feedback.
|
| Tab
Key Emulation |
The tab key is no longer required to tab between fields.
The user can go to the next form field just by pressing the
enter key instead of the tab key. Useful with 10-key form
input.
|
| Text
Cycler |
Use the Up and Down arrows while in the text box to cycle
through your choices. InternetExplorer users can go up and
down through the list, Netscape users can only go down through
the list.
|
| Text
Reverser |
JavaScript will take the contents of a box and reverse it!
If you entered 'hello' it will change the box to say 'olleh'.
This might be useful on your site in a form or just for fun.
|
| Time
Out |
Limit the time allowed for form input with this short script.
|
| Trim
Leading Spaces |
A super-easy script which eliminates any extra leading spaces
entered inside a textbox. To check it out in action, try entering
a few spaces before the text in the box.
|
| Trim
Trailing Spaces |
A super-easy script which eliminates any extra trailing
spaces entered inside a textbox. To check it out in action,
try entering a few spaces after the text in the box.
|
| True
Date Selector |
This script helps to insure the integrity of the date entered
in drop-down menus. Dates, such as Feb 31st can't be selected.
Today's date is automatically selected.
|
| Upload
Filter |
Allowing visitors to upload files through web forms on your
site is useful, but how do you limit the types of files they
can upload? This script only allows visitors to upload files
that end with the file extensions you want, such as .gif and
.jpg, etc.
|
| Val
Char |
Automatically removes specified characters from input box.
Good for fields that require only text/number inputs. Easily
modified to accept only text or only numerals.
|
| Val
Cookie |
Use Javascript to ensure that all elements of a form are
properly filled out before mailing.
|
| Val
Credit Card |
Determines if a credit card number is valid before the form
is submitted by utilizing the LUHN formula. Very simple, and
does not require knowledge of the credit card type. Does not
check if the date is valid. Ver useful for online order form
validation.
|
| Val
Date |
Dates are validated and formatted in your form. Supports
over a dozen different date formats, and formats the date
properly in United States or European date formatting styles
depending on how the script is configured. A dateCheck function
also is included if you wish to compare two dates.
|
| Val
External Js |
Using an external JavaScript file, simply define the rules
for how each field should be validated and you're set. Piece
of cake! And since it is it's own .js file, it's easy to use
the code on every page of your site. Currently only validates
text, numbers and e-mail addresses.
|
| Val
Guestbook |
Use Javascript to ensure that all elements of a form are
properly filled out before mailing.
|
| Val
Info |
Test the powers of Javascript. Watch as Javascript tells
you if information about you is valid or not.
|
| Val
Ip |
Verify the value of an IP address. Check for special cases
such as "0.0.0.0" and "255.255.255.255".
|
| Val
Num Or Char |
Validates an input field to make sure that only a number
or character is entered. If you enter a number or a letter
everything you can continue on. But, try entering another
value like an exclamation point (!), an ampersand (&),
or a dollar sign ($) and see what happens. It even highlights
the incorrect entry field for you.
|
| Val
Pass |
This script works like our Password Verifier, however, it
also checks for a minimum length and invalid characters.
|
| Val
Selection |
Use Javascript to ensure that visitors choose both a radio
button and a checkbox. Invalid submissions are cancelled.
|
| Val
Ssn |
Input the Social Security Number using either the 9 digit
or NNN-NN-NNNN format. The number ranges can be easily changed
by the S.S.A, so this is not checked.
|
| Val
Time |
This function verifies that a string is a valid time, in
the form hh:mm:ss am/pm, where seconds are optional. It accepts
military time (hour between 0 and 23) as long as am/pm isn't
specified. It requires am/pm when the hour is less than or
equal to 12.
|
| Val
Zip Code |
Ensure that your visitors enter a properly formatted 5 digit,
or 5 digit+4 zip code. The visitor is alerted if any information
is invalid and asked to try again.
|
| Validation
Universal Date |
Validate dates in your form using this universal script.
Will work with any date format and the code is fully commented
for easy modification.
|
| Validation |
Let Javascript help you receive feedback from your visitors.
The script also requires that all fields must be completed
before the form is submitted.
|
| Word
Counter |
This is a handy script that counts the words (or characters)
entered into a textarea and limits it to 100 words or less
(this can be changed).
|
| Word
Count |
Finally, an easy way to count the number of words that are
entered into a form!
|
| Zip
To State |
Enter your five digit zip code and press tab to have the
script display your state automatically
|
