Select Text Area

Love* · 05-09-2006, 05:26 AM

Good day everyone.
I am trying to find some help regarding this code:

( http://codebelly.com/javascript/selecttextarea.html )

PHP Code:


			
 ==========================================

 HIGHLIGHTING FORM TEXTAREAS ON MOUSE CLICK

 ==========================================

  

 Copyright 2001 by www.CodeBelly.com

 Do *not* remove this notice.







 =============

 INSTRUCTIONS:

 =============



 Insert the scripts below in the page as noted. No changes

 are needed. Read through the General Rules for an under-

 standing of the requirements.

 

 For multiple instances, change the function name, the 

 form name, and the textarea name for each case.



 General Rules:



 1.

 The FORM must have a NAME="something" as shown in the

 HTML for the form (below, see NAME="TheForm").  



 2.

 The TEXTAREA must have a NAME="something" as shown in the

 HTML for the form (below, see NAME="TheText").



 3.

 The names used in the form must agree with those used in

 the JavaScript script.  See:

   

     document.TheForm.TheText.focus();

     document.TheForm.TheText.select();



 4.

 You can set the text to wrap by setting wrap="on" (or set

 it not to wrap with wrap="off") in the textarea tag.







 ============

 THE SCRIPTS:

 ============







 Step One - The JavaScript Header Script

 ---------------------------------------



 Put the following script in the head of the page.  The 

 form name and textarea name in the document reference

 in the script must conform to the names used in the 

 form in the body of the page.



 <script>

 // Copyright 2001 by www.CodeBelly.com

 // Do *not* remove this notice.

 function selectText(){

 document.TheForm.TheText.focus();

 document.TheForm.TheText.select();

 }

 </script> 







 Step Two - The Link That Selects The Text

 -----------------------------------------



 Use the following code for a link which, when clicked,

 will select the text in the textarea.



 <a href="javascript:selectText()">Click to Select</a>







 Step Three - The Form and Its Textarea

 --------------------------------------



 Put the following form in the <body> of the page where

 you wish the textarea to appear.  Alter the text as

 needed.  Remember that the form name and textarea name

 must agree in the form and in the script.



 <form NAME="TheForm">

 <textarea rows="12" cols="62" NAME="TheText" wrap="off">

 This is the text in the textarea.  Change it to suit.

 </textarea>

 </form>

I want to use it on my sites, the problem is, the script only works if there is one textarea on that page.

And since the name of the form and textarea is already on the header, I am having trouble finding a way on how to make it work with a lot of textareas on the same page, without compromising any of the other textareas.
I want the script to work on all textareas, but I'm not sure what to do.

Thank you very much for taking the time to read this. If any of you would be kind enough to modify the script as to make what I'm hoping to get possible, then I would greatly appreciate it. Thank you very much.

If anyone could do this for me, I would be happy to link/credit you on my new site where I'm going to use the script.
myspacebrat.com / myspacebrat.net (still working on the site but this is what I got so far.)

mensa_dropout · 05-09-2006, 02:51 PM

try this.

Code:

<html>
<head>
<script type="text/javascript">
 function selectText(strTxtArea){
 document.getElementById(strTxtArea).focus();
 document.getElementById(strTxtArea).select();
 }
</script>
</head>
<body>

<form NAME="TheForm">
<table style="width:100%">
<tr>
 <td>
  <a href="javascript:selectText('txtArea1')">Click to Select Text Area 1</a> 
 </td>
</tr>
<tr>
 <td>
  <textarea rows="4" cols="40" id="txtArea1" wrap="off">
  Text in the Text Area 1.  
  Change it to suit.
  </textarea>
 </td>
<tr>
<tr>
 <td>
  <a href="javascript:selectText('txtArea2')">Click to Select Text Area 2</a> 
 </td>
</tr>
<tr>
 <td>
  <textarea rows="4" cols="40" id="txtArea2" wrap="off">
  Text in the Text Area 2.  
  Change it to suit.
  </textarea>
 </td>
</tr>
</table>
</form> 
</body>
</html>