Javascript DOM CSS help required :)

[ypkumar]

ok this is like this..

 

I have a form in the body as something like this..

<tr>
     <td>
          Login
     </td>
     <td>
          <input type="text" name="userid" id ="usertext" onChange="validateUser(this.value);" />
     </td>
</tr>

 

and in the head I refer to an external js file which has the functions to run...

 

now that particular function validateUser() gets the username from textbox, queries at the db using AJAX and when that query returns a value validateUser changes the color of the textbox (or color of text) based on the validation result.

 

i.e., if validation is successful then the color of plain white text box turns to #CCFF99 and if it was unsuccessful it changes the text box color to #FF6666 and the code (for changing color of font) goes something like this.

if(true)
{
	document.getElementById("usertext").style.color = "#CCFF99";
}
else if(false)
{
	document.getElementById("usertext").style.color = "#FF6666";
}

 

now lets assume that I have typed in something wrong deliberately in the text box, and I press "TAB" to get to the next text box (control) and to execute the validateUser js function, and as a result of that I get the text box's font color changed to red.

 

now I want to do something that when I click the text box after validateUser has executed once and color of the text box font changes.. the color turn back to normal until I type and press TAB again to execute the function...

 

is there anyway to do that? I have a theory of adding a onFocus or something to change the color.. but i havent tried it out yet..

 

any suggestions?