homepage Welcome to WebmasterWorld Guest from 54.204.94.228
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member

Visit PubCon.com
Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
Forum Library, Charter, Moderator: open

JavaScript and AJAX Forum

    
Format form input fields
formatting form input fields with javascript
Tourex




msg:4066243
 10:56 am on Jan 23, 2010 (gmt 0)

I have a form that applies a descriptive legend to blank form fields and changes them to blank when the user starts to make an entry in the field.

Is there any way that I can format (or preferably apply a CSS class) to this legend? My aim is for the form to show the legend in uncompleted fields in light grey, with entered fields showing in standard black.

The code I am using is:

<input type="text" name="FirstName" onfocus="if (this.value=='first name') this.value = ''" onblur="if (this.value=='') this.value = 'first name'" value="first name" />

Is this possible and, if so, how? Thanks in anticipation of any help.

 

daveVk




msg:4066604
 1:55 am on Jan 24, 2010 (gmt 0)

<input type="text" name="FirstName" onfocus="if (this.value=='first name') this.value = '';this.className='noPrompt';" onblur="if (this.value=='') this.value = 'first name';this.className='prompt';" value="first name" class="prompt"/>

Tourex




msg:4067406
 5:50 pm on Jan 25, 2010 (gmt 0)

Thanks daveVk - works a treat!

Fotiman




msg:4067413
 6:02 pm on Jan 25, 2010 (gmt 0)

Not quite. That will change the class back to prompt regardless of whether the value was '' or not. Easily fixed by adding the missing {}. :)

Try this instead:
<input type="text" name="FirstName" onfocus="if (this.value=='first name') {this.value = '';this.className='noPrompt'};" onblur="if (this.value=='') {this.value = 'first name';this.className='prompt';}" value="first name" class="prompt"/>

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved