Hide Text onClick

oysterking · 10-20-2009, 11:30 AM

Hello everyone, the new guy here. Thought I would see if you all could help.
I am trying to add an onClick event to hide the default text value of my text field. Here is my code without an onClick.

<form method='post' action='{SITE_ROOT}index.php' style='margin:0px'>
<input class="ibox_search" type='text' name='search' value='Search All' style='width:300'> <input class="ibox_search_submit" type='submit' value='{WORD_SEARCH}'>
</form>

Any help would be appreciated.

Thanks

**jamiemac2005** · 10-20-2009, 01:15 PM

Oh right, just to clarify you want it to hide "Search All" when the input box is clicked? If i'm right in assuming that:

Code:

<input class="ibox_search" type='text' name='search' value='Search All' style='width:300' onfocus="this.value=='Search All'?this.value='':this.value=this.value;" onblur="this.value==''?this.value='Search All':this.value=this.value;">

It makes sence to use onfocus rather than onclick because a user can tab to the input box aswell... And the onblur code simply checks to see if the text box is empty and replaces that with "Search All" if it is.

Cheers,
Jamey

p.s. Welcome to tsf =]

oysterking · 10-20-2009, 02:36 PM

Yes that was a correct assumption, works perfect.
Thanks Jamey, your the bomb !!!

**jamiemac2005** · 10-20-2009, 02:58 PM

That's cool, glad i got it right =]

Cheers,
Jamey

10-20-2009, 11:30 AM	#1 (permalink)
oysterking Registered User Join Date: Oct 2009 Posts: 2 OS: win98 sp2	Hide Text onClick Hello everyone, the new guy here. Thought I would see if you all could help. I am trying to add an onClick event to hide the default text value of my text field. Here is my code without an onClick. <form method='post' action='{SITE_ROOT}index.php' style='margin:0px'> <input class="ibox_search" type='text' name='search' value='Search All' style='width:300'> <input class="ibox_search_submit" type='submit' value='{WORD_SEARCH}'> </form> Any help would be appreciated. Thanks

10-20-2009, 01:15 PM	#2 (permalink)
jamiemac2005 Design Team Member Join Date: Jul 2007 Location: Coventry, UK Posts: 1,884 OS: Vista, various linux distros	Re: Hide Text onClick Oh right, just to clarify you want it to hide "Search All" when the input box is clicked? If i'm right in assuming that: Code: <input class="ibox_search" type='text' name='search' value='Search All' style='width:300' onfocus="this.value=='Search All'?this.value='':this.value=this.value;" onblur="this.value==''?this.value='Search All':this.value=this.value;"> It makes sence to use onfocus rather than onclick because a user can tab to the input box aswell... And the onblur code simply checks to see if the text box is empty and replaces that with "Search All" if it is. Cheers, Jamey p.s. Welcome to tsf =] __________________ Myspace

10-20-2009, 02:36 PM	#3 (permalink)
oysterking Registered User Join Date: Oct 2009 Posts: 2 OS: win98 sp2	Re: Hide Text onClick Yes that was a correct assumption, works perfect. Thanks Jamey, your the bomb !!!

10-20-2009, 02:58 PM	#4 (permalink)
jamiemac2005 Design Team Member Join Date: Jul 2007 Location: Coventry, UK Posts: 1,884 OS: Vista, various linux distros	Re: Hide Text onClick That's cool, glad i got it right =] Cheers, Jamey __________________ Myspace