View Full Version : making text appear in text-area before input

09-24-2004, 08:34 PM

I've seen this before, and it might be simple, but I have no idea what to do. I want to make the text area (where you type for a forum reply like I am doing right now) have a line of text warning people to read the rules before they post. I want this sentence to vanish when they click within the text area to type.

Any idea how? here's the code:

<td class="pformright" valign='top'><textarea cols='70' rows='15' name='Post' tabindex='3' class='textinput'>$data</textarea></td>


09-24-2004, 08:56 PM

<textarea cols='70' rows='15' name='Post' tabindex='3' class='textinput'>Please read the rules before posting!</textarea>

Do it, if that's what you're talking about, just like i have a little bit of text in my contact textarea:

09-24-2004, 09:01 PM
In order to make that text vanish, you'd need some javascript running, probably onfocus, that would compare the value of the textarea to your default text, if it is the same then clear the text. I've used this on standard text inputs before, I'm sure it would work on textarea too.

onfocus="if(this.value=='Please read the rules before posting!') this.value=''"
What might be nicer though (no js required) would be big bold red text just above the textarea or above the submit button that says that same thing. Doing this you can make use of color and font changes to attract attention to the important text.

09-24-2004, 09:07 PM
Another thing that might be fun would be to have a secondary text entry (just input, not textarea) that requires a certain word from the rules page. The visitor has to at least look at the rules to find the required word before the post is accepted. With a bit of server-side work you could even make this semi-random so someone can't get away with just using the same word.

If this is for a forum, you might just require this "Rules Read" verification while the person has posted fewer than 10 messages. This way veteran users don't get upset at having to hunt through the rules every time they want to say something.

09-24-2004, 09:09 PM
Good one kansel :thumbsup:

09-25-2004, 04:15 AM
Hmm.. in this code:

<td class="pformright" valign='top' ><textarea cols='70' rows='15' name='Post' tabindex='3' class='textinput'>$data</textarea></td>

onfocus="if(this.value=='Please read the etiquette (click the link to it above) before posting!') this.value=''"

doesn't seem to work :( I put it nearly everywhere in that text to see if it was just me.

Any ideas?

P.S. Kasal..that is a great idea, but they might get confused..but I might do it anyway..what a great idea!

09-25-2004, 02:08 PM
I'd advise against such things as forcing them to read the rules... Most people don't need to, as they are typically equipped with common sense. The best way to do it would be to state that "by submitting this form you agree to the <a>forum rules</a>" and link them to the rules. If they choose not to read them, you can choose to take whatever action is necessary.

As for the other thing: His script assumes you've given the textarea a default value of 'Please read the rules before posting!'. You haven't. Your textarea's initial value is '$data', or whatever that PHP variable equals. Replace that with 'Please read the rules before posting!' (sans quotes) and it'll work.

09-25-2004, 03:32 PM
If you're going to do your form validation and error checking clientside, I'd recommend something along the following lines:

<script type="text/javascript">

function chkFrm(){

var doc = document['formName'];
if (doc['tos'].checked){
alert("Form Error: You must agree to the\n Terms Of Service before posting!");
return false;


<form name="formName">
<input name="tos" type="checkbox" />
<textarea cols="70" rows="15" name="Post" tabindex="3" class="textinput">$data</textarea>
<input name="oBtn" type="button" value="Submit" onclick="javascript:chkFrm();" />