New Revised CSS Library Forums Web Tools
FAQs Awards Usage Terms Contact
Categories
Other Sections
Sweet Ads
Compatibility
  • IE5+: IE 5 and above
  • FF1+: Firefox 1.0+. NS6+ and FF beta are assumed as well.
  • Opr7+: Opera 7 and above.
Bookmark online:
FF1+ IE5+ Opr7+

Select (and copy) Form Element Script

Author: Dynamic Drive

Description: Allow your surfers to easily select the contents of your form elements- as we have done with our script containers throughout Dynamic Drive- with this script. And just to outdo ourselves, we've also embedded in this script the ability to concurrently copy the content to clipboard (memory) as well (applicable only in IE 4+). Enjoy!

Demo: Clicking on "Select All "will highlight the form's contents, and in IE 4+, copy them to clipboard as well.

Select All

Directions: Developer's View

Step 1: Insert the following script into the <head> of your page:

Select All

Step 2: Add the below sample form to the <BODY>:

Select All

That's a wrap.

More info on configuring the script

The key to adding the "Highlight" feature to your form elements, as illustrated in the code of Step 2, are:

1) Giving your form a name (ie: <form name="test">)
2) Giving the form element in question a name (ie: <textarea name="select1">)
3) Adding the <a> code:

<a class="highlighttext" href="javascript:selectcopy('test.select1')">Select All</a>

directly above the form element, where the part in red references the form, then the element to highlight's name (note the quotation marks around it). Or if your form element contains an ID attribute, such as <textarea id="select1">, you can simply enter that ID into selectcopy() instead, such as selectcopy('select1').