Clear username and Password boxes

[TheScarecrow]

I have a username and password box that I want to clear onFocus or onClick... I have that set. Here is my question. How do I do it if they click off of it and have not entered a username and password to have the box use the default value.

<script type="text/javascript">
function clearUsernameFunction(ff, ffvalue) {
if (ffvalue == "username") {
ff.value = "";
}
}
function clearPasswordFunction(ff, ffvalue) {
if (ffvalue == "password") {
ff.value = "";
}
}
</script>

<TD>
<CFINPUT TYPE="text"
NAME="LoginID"
REQUIRED="Yes"
MAXLENGTH="10"
class="loginTextBoxBold"
value="username"
size="12px"
onClick="clearUsernameFunction(this, this.value)"
onFocus="clearUsernameFunction(this, this.value)"> </TD>
</TR>
<TR>
<TD ALIGN="right">
<span class="loginTextBold">Password: </span> </TD>
<TD>
<CFINPUT TYPE="password"
NAME="LoginPassword"
MESSAGE="Password is required!"
REQUIRED="Yes"
MAXLENGTH="10"
class="loginTextBoxBold"
value="password"
size="12px"
onClick="clearPasswordFunction(this, this.value)"
onFocus="clearPasswordFunction(this, this.value)"> </TD>
</TR>

[Dan_Bracuk]

a reset button would be a lot simpler.

[fober1]

hi,

What you need is the onblur event (leaving the field). And I have also made the javascript functions generic so they can be used with any field.

I'm not sure what you mean with the default value here.
"... not entered a username and password to have the box use the default value..."
But I expect you are not talking about the username and password of the customer (you should not include that un-encoded in the raw HTML of the page)

Cheers,
fober

===============================================

<script type="text/javascript">
function focusfield(object, field) {
if (object.value == field)
object.value='';
}

function clearfield(object, field) {
if (object.value == '')
object.value=field;
}
</script>

Username: <INPUT TYPE="text"
NAME="LoginID"
REQUIRED="Yes"
MAXLENGTH="10"
class="loginTextBoxBold"
value="username"
size="12px"
onClick= "focusfield(this, 'username')"
onFocus= "focusfield(this, 'username')"
onBlur= "clearfield(this, 'username')"
><br>

Password: <INPUT TYPE="text"
NAME="LoginPassword"
MESSAGE="Password is required!"
REQUIRED="Yes"
MAXLENGTH="10"
class="loginTextBoxBold"
value="password"
size="12px"
onClick= "focusfield(this, 'password')"
onFocus= "focusfield(this, 'password')"
onBlur= "clearfield(this, 'password')"
>