New Revised CSS Library Forums Web Tools
FAQs Awards Usage Terms Contact
Categories
Other Sections
Sweet Ads
Compatibility
Bookmark online:


FF1+ IE5+

Recall Form Values script

Author: Dynamic Drive

Description: This script remembers the value entered into any form textbox (<input type='text") by the visitor, and upon his/her return, preloads the textbox with that value. It's very useful for forms that get used repeatedly by the same visitors and contain the same values each time, such as the "name" or "email" field of a "Recommend Site" form or blog comments form. Just as useful is this script's ease of installation- specify a form textbox value to be retained just by giving it a class="memorize" attribute!

Demo: In the below form, the script will remember the values entered into "Name" and "Email" fields below:

1) Name:*

2) Email address:*

3) Comments:

 

*Field value will be remembered upon revisit.


Directions: Developer's View

Step 1: Add the below script to the HEAD section of your page containing the form:

Select All

The above script references an external .js file. Download "formretain.js" (by right clicking and selecting "Save As"), and upload to the directory where your webpage resides.

Step 2: Now inside any form, for the textboxes you wish the values to be remembered, just give it a class="memorize" attribute. For example:

<form>
Name:<input type="text" class="memorize">
Email: <input type="text" class="memorize">
Comments: <textarea rows="5" cols="20"></textarea>
Phone: <input type="text" class="myclass memorize">
</form>

Notice how in the "Phone" textbox, "memorize" is inserted as a secondary class in addition to any class you may already have (ie: "myclass"). In other words, this script supports multiple class names.

Currently this script only retains textbox values, so you should ONLY add class="memorize" to <input type="text"> elements.