Reg Exp
Web Design
Notes Client
Providing field help inside the field
We saw this technique on a web site and thought it was kinda cool. In "non-code" terms, you put help as a default value of a field in a light gray color. Then, when the user clicks into the field, you clear out the help and change the color to black. If they leave the field without typing a value, you put the help back in. It's kinda neat. Here's some HTML to get the job done (IE only):

<input type="text" onfocus="if (this.value=='enter your name') { this.value=''; this.style.color='#000000'; }" onblur="if (this.value=='') { this.value='enter your name'; this.style.color='#999999'; }" name="Name" size="20" value="enter your name" style="color='#999999';">

In the original version of the code (where we got the idea), the code changed the style when a key was pressed (onkeydown="this.style.color='#000000'"). But that meant that if you typed something in, then cleared it out and left the field, the field help would be in black instead of gray. The way above means the field help is always in gray.

It's a pretty good technique to provide field help. Remember to check for the default value:

var field = document.forms[0].Name;
if (field.value == field.defaultValue) { alert("Please enter your name"); }

Here's a sample that shows the technique (if you're using IE):
Your Name:  

Your City: