Help with Form Field, OnFocus, OnBlur

[SharkPunch]

I have some form fields with values of Name, Company, Email etc with OnFocus. So there a text input box says Company, and I want the user to put their Company Name in. Once they click on the box, the word Company disappears from the text box and then they need to put their Company name in.

But if they click on an text input box, and do not enter the information, I want the default value to return. Right now if I click on all the text input boxes and don't enter anything, they will all just be blank. So if someone clicks on the company name box, and doesn't enter the company name, and clicks on another form field, I want the word Company to reappear. How do I do this? I think its with OnBlur, but I don't know how to get it to work.

[edited by: tedster at 1:24 pm (utc) on Apr 28, 2010]
[edit reason] no personal URLs, please [/edit]

[dreamcatcher]

<input type="text" name="company" onclick="this.value=''" onblur="this.value='Company'" value="Company" />

dc

[SharkPunch]

Ok I tried that out, and yes after you click on something else, company is put in the field. However if I do type some text in the form field, and move on, its still replaced with the word Company...

I only want the value to reappear in that form field if nothing is typed in the form field after clicking on it, if that makes sense.

[Fotiman]

function getFocus(inputEl) {
  if (inputEl.value === inputEl.defaultValue) {
    inputEl.value = "";
  }
}
function loseFocus(inputEl) {
  if (inputEl.value === "") {
    inputEl.value = inputEl.defaultValue;
  }
}

And then in each input element:

<input type="text" name="company" value="Company" onfocus="getFocus(this);" onblur="loseFocus(this);" />

Note, the loseFocus method checks to see if the value of the input field is an empty string. A good way to enhance this script would be to have it trim off any left and right whitespace before doing the check. For example, if the user clicks on the field and hits the space bar, that would cause the value not to be changed back to the default. I'll leave that as an exercise for you. :)