javascript events/behaviors in text boxes 1

[tperri]

I have an ASP.Net page that has two text box controls on it. One if to collect an email address, and the other to collect a home airport code.

When the page loads, in the text boxes, I want to have appear "Enter e-mail address" and "Enter Airport Code", respectively. I've set the Text property of the text boxes to show this, of course. However some javascript I'm using is creating behaviors that isn't quite right.

In the textbox's onfocus event, I have "this.value=''" which works properly, but I do not want it to fire off on page load because it is clearing out the first of the two text boxes I have. The only other control I have on this page is a submit button, and in my code I placed btnSignup.Focus(), but that button is not receiving focus on Page Load. So this method isn't quite right.

The behavior I am after is, after page load and the text boxes display their initial values, if the user types something other than the default value in either of the text boxes, I dont want the text to be cleared if the textbox gains focus again; otherwise, if a text box gains focus and the text in the box equals the initial values, I want them cleared.

Any help and direction to some web sources would be great. I've searched Google but I don't think I'm searching the proper term because I'm not finding anything useful. As always, thank you for the help in advance!

 

[monksnake]

Do you want the top textbox to gain focus on the onload of the page?


<.

 

[tperri]

Not really, but it doesnt matter. If it does/has to be that way, I don't want it to clear out on the initial load of the page.

 

[monksnake]

Then create a function that is called on the onfocus event of each textbox.

It'd go something like this:

Function Call

<input type="text" id="emailText" onfocus="clearTextbox(this)"  value="Enter e-mail address" />
<input type="text" id="airportCodeText" onfocus="clearTextbox(this)"  value="Enter Airport Code" />

Function

<script type="text/javascript">
function clearTextbox(textObj) {
   var textValue = textObj.value;
   var textID = textObj.id;   
   if (textValue == "Enter e-mail address" && textID == "emailText") {
      textObj.value = "";
   }
   else if (textValue == "Enter Airport Code" && textID == "airportCodeText") {
      textObj.value = "";
   }
}
</script>

This should get you what you want as long as you have no other code that can interfere with this code.

As for the submit button, I don't have enough information to know exactly what is going on. I would make sure that the button exists at the time in which you do the focus.


I believe that .focus() will only work lowercase.





<.

 

[tperri]

Thank you so very much!

Now, for the 2nd part of this, I can use the onblur event and check if the field is bank, and if so then enter the default text, correct?

Thanks again

 

[monksnake]

Yes you can.

Thank you for the purple symbol of satisfaction!

<.