Subscribe to
the Possibilities Ezine

Subscription Terms of Service
Privacy Policy

RSS feed links

Blog Article Categories

Automation

CGI

Content Protection

CSS

Debugging

HTML

JavaScript

Perl

PHP

Recommendations

Related Sites

Statistics

Web Development

Web Site Maintenance

Misc

Form Field Prompts

By Will Bontrager

Form text fields may themselves contain the prompt indicating what information is expected. This can be in addition to or instead of form field labels.

When the field is clicked on, the prompt disappears.

The JavaScript must know when to make the text in the form field disappear and when not to. We don't want the text to disappear if the user comes back to edit something previously typed in.

Here is an example.

Date:

Here is example code.

<form> Date: <input type="text" name="newdate" value="mm-dd-yy" onclick="WipePrompt('mm-dd-yy',this)"> <br /> <input type="submit" value="Click me"> </form> <script type="text/javascript"> function WipePrompt(s,f) { if(f.value == s) { f.value = ''; } } </script>

The value of the value attribute in the form field is the text of the prompt.

The first parameter of the onclick attribute's WipePrompt() JavaScript function is identical to the text in the value attribute. (The second parameter points to the form field itself so the JavaScript can remove the value.)

When the user clicks on the form field, WipePrompt() deletes the entire field content if, and only if, the content is equal to the text of the prompt. If the form user has typed something into the field, it is not deleted (unless the user types exactly what the prompt text was in the first place).

April 9, 2008

Please note: Articles on this website are presented "as is". However -

If you have a question about a CGI script, HTML, CSS, PHP, or JavaScript
Ask one of our Experts and you'll have your answer!
Click here for details.

© 1998-2001 William and Mari Bontrager
© 2001-2008 Bontrager Connection, LLC