How to clear a textbox on GotFocus in a web-page ?

A

Alex

Hi.

I have... well.... not very many computer-literate users to my web-
site.

For the textbox which expects an email address, for instance, I had to
enter a default text like
"Email..." because if not, they phoned me asking questions like "What
does the message 'Your email address is required' ?" :)))

Now the problem is that many users don't erase this default text, and
enter their email address AFTER the default text, so that the contents
of the textbox is now
"(e-mail address removed)"

On this textbox,I have, of course, a RequiredFieldValidator, another
RequiredFieldValidator (with InitialValue="Email...") and a
RegularExpressionValidator (with the regex
ValidationExpression="^([0-9a-zA-Z]([-.\w]*[0-9a-zA-Z])*@([0-9a-zA-Z][-
\w]*[0-9a-zA-Z]\.)+[a-zA-Z]{2,9})$"

But this does not filter out the "Email... " text.

I *could* alter the ValidationExpression, of course, but I would want
a more elegant solution, one which would clear the default text out on
a textbox on GOTFOCUS, and conversely, put the default text back on
LOSTFOCUS, if, of course, the text in that text-box has not been
changed from the default - if the text HAS been changed, then,
obviously, it has to be left there.

So, for example, say that txtEmail has the default contents
"Email...". You click in it, the text disappears. You click away, it
becomes "Email..." again. You click in it again, it becomes null
again. You type "(e-mail address removed)" and you click away, the text stays
"(e-mail address removed)".

I'm sure that this requires some JavaScript, but.... I don't know
enough JavaScript for this, unfortunately. Could you please direct me
to such a piece of code ?

Thank you very much.
Alex.
 
B

Benjamin Sattler

Hi!

Well, I just have my social minutes :)

<input type="text" name="useremail" value="Email..." size="20"
onfocus="if ( this.value == this.defaultValue ) this.value = ''"
onblur="if ( this.value == '' ) this.value = this.defaultValue" />

I assume you are using xhtml in that example. If you use html
instead then you should drop the / at the end. If you plan to
change the value which is written in the field by default you just
need to change the "value" attribute; the javascript will adapt
automatically.

Also, feel free to modify the size of the textbox by adjusting the
"size" attribute (which holds the number of visible characters in
the field)

This example does not filter its input in any way, so you need to
make that sure. But your regexp will do that :)

bye
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Threads
473,744
Messages
2,569,484
Members
44,904
Latest member
HealthyVisionsCBDPrice

Latest Threads

Top