help, text area on forms

theonemanyuri · 27-02-2011, 02:18:10 PM

I'm using the following to set up the input fields in my form:

<input class="form2" onfocus="this.select()" onblur="this.value=!this.value?'Mobile'

his.value ;" onclick="this.value='';"/ type="text" name="mobile" size="24" style="color:#888;"
value="Mobile" />

This displays what to enter in the field (eg. name, mobile), which then disappears on click and comes back if nothing is entered and the user clicks outside of the box. The 'value=""' attribute is needed otherwise no text appears in the input fields from page load, only once a user has clicked in and out of the field.

I have a text area at the bottom of my form which I want to behave in the same manner. I can get it to display the default text I want when the user has clicked in and out of the box, but not from page load. I've added the value attribute but it doesn't make any difference..

Can anyone help? The code I'm using for the text area is as follows:

<textarea class="form2" onfocus="this.select()" onblur="this.value=!this.value?'Description (50 words max)'

his.value;" onclick="this.value='';"/ rows="9" style="color:#888" name="message" cols="30" value="Description (50 words max)"></textarea>

theonemanyuri · 27-02-2011, 02:20:52 PM

Replace the thanks icons with ': t h' (no spaces).. bloody emoticons

Ashton · 27-02-2011, 04:40:08 PM

Its because textarea works differently - The contents are originally declared by whats inbetween <textarea> and </textarea>

Code:

<textarea class="form2" onfocus="this.select()" onblur="this.value='Description (50 words max)'" onclick="this.value=''"/ rows="9"  cols="30" value="">Description (50 words max)</textarea>

However this isn't a very efficient way of clearing a form to be honest, what you should do is check if they have entered anything within the form and not clear it if they have:

Code:

<textarea class="form2" onfocus="this.value=''" onblur="if(this.value=='')this.value='Description (50 words max)';" rows="9"  cols="30" value="">Description (50 words max)</textarea>

I also moved the value clearing to onfocus - If a user uses there keyboard to navigate to the field (pressing tab) then it will now clear.

theonemanyuri · 27-02-2011, 06:30:03 PM

Cheers mate works a charm

Ashton · 27-02-2011, 06:59:49 PM

No worries

27-02-2011, 02:18:10 PM	#1 (permalink)
theonemanyuri Join Date: Jun 2010 Posts: 481 No Classified Ratings Domain Trader Rating: (100% / 2)	help, text area on forms I'm using the following to set up the input fields in my form: <input class="form2" onfocus="this.select()" onblur="this.value=!this.value?'Mobile'his.value ;" onclick="this.value='';"/ type="text" name="mobile" size="24" style="color:#888;" value="Mobile" /> This displays what to enter in the field (eg. name, mobile), which then disappears on click and comes back if nothing is entered and the user clicks outside of the box. The 'value=""' attribute is needed otherwise no text appears in the input fields from page load, only once a user has clicked in and out of the field. I have a text area at the bottom of my form which I want to behave in the same manner. I can get it to display the default text I want when the user has clicked in and out of the box, but not from page load. I've added the value attribute but it doesn't make any difference.. Can anyone help? The code I'm using for the text area is as follows: <textarea class="form2" onfocus="this.select()" onblur="this.value=!this.value?'Description (50 words max)'his.value;" onclick="this.value='';"/ rows="9" style="color:#888" name="message" cols="30" value="Description (50 words max)"></textarea>

27-02-2011, 04:40:08 PM	#3 (permalink)
Ashton Join Date: Feb 2010 Location: South Coast Posts: 1,518 No Classified Ratings Domain Trader Rating: (100% / 21)	Its because textarea works differently - The contents are originally declared by whats inbetween <textarea> and </textarea> Code: <textarea class="form2" onfocus="this.select()" onblur="this.value='Description (50 words max)'" onclick="this.value=''"/ rows="9" cols="30" value="">Description (50 words max)</textarea> However this isn't a very efficient way of clearing a form to be honest, what you should do is check if they have entered anything within the form and not clear it if they have: Code: <textarea class="form2" onfocus="this.value=''" onblur="if(this.value=='')this.value='Description (50 words max)';" rows="9" cols="30" value="">Description (50 words max)</textarea> I also moved the value clearing to onfocus - If a user uses there keyboard to navigate to the field (pressing tab) then it will now clear. Last edited by Ashton; 27-02-2011 at 04:50:58 PM.

Thread Tools
Show Printable Version Email this Page
Display Modes
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode

Similar Threads
Thread	Thread Starter	Domain Name Community	Replies	Last Post
My free online web forms builder	immediate	Website Reviews	0	24-05-2010 10:19:22 AM
missing text problem	Reg Wharf	Scripts and Coding	2	17-03-2010 11:15:44 PM
White text on homepage	Frenchiexno1	Search Engine Optimisation	10	10-04-2009 07:26:13 PM
Update MySQL from a text file	admin	Scripts and Coding	10	15-06-2008 10:09:21 PM

27-02-2011, 02:20:52 PM	#2 (permalink)
theonemanyuri Join Date: Jun 2010 Posts: 481 No Classified Ratings Domain Trader Rating: (100% / 2)	Replace the thanks icons with ': t h' (no spaces).. bloody emoticons

27-02-2011, 06:30:03 PM	#4 (permalink)
theonemanyuri Join Date: Jun 2010 Posts: 481 No Classified Ratings Domain Trader Rating: (100% / 2)	Cheers mate works a charm

27-02-2011, 06:59:49 PM	#5 (permalink)
Ashton Join Date: Feb 2010 Location: South Coast Posts: 1,518 No Classified Ratings Domain Trader Rating: (100% / 21)	No worries