Link to home
Start Free TrialLog in
Avatar of jm_jackson
jm_jackson

asked on

changing font color of a text box

How do you change the font color of a text box depending on what the text box contains. eg. if it contains "yes" i would like the font to be green but if the text is "no" i want it red. I obviously want this change to occur with out a the page having to be reloaded. Thanks
Avatar of MatrixDud
MatrixDud

the best way to do that would be using CSS. Simple use:

style="color: green" in your input tag.
Do you want this when a user clicks the button? Or when they change the text of the texbox? Anyhow here's a function:

function colour() {
if(document.form.textbox.value=='yes')
{document.form.textbox.style.color='green'}
if(document.form.textbox.value=='no')
{document.form.textbox.style.color='red'}
}
Sorry MatrixDud, didn't see your last post.

jm_jackson,
Or you could implement it right into the onChange of your textbox:

<input type='text' name='textbox' onChange="if(this.value=='yes'){this.style.color='green'}if(this.value=='no'){this.style.color='red'}">

or in a button:

<input type='button' onClick="if(document.form.textbox.value=='yes'){document.form.textbox.color='green'}if(document.form.textbox.value=='no'){document.form.textbox.style.color='red'}">

You may also want to use toLowerCase(), since the user might type in 'Yes' or 'YES' instead of'yes':

if(document.form.textbox.value.toLowerCase=='yes')
oops...I didn't read the whole question: this will work

<input name="textBox" type="text" onChange="if( this.value == 'yes') this.style.color = 'green'; else if( this.value == 'no') this.style.color = 'red';">
oops...sorry lil_puffball
:D
MatrixDud,
Funny how we keep missing each other! :)
Avatar of jm_jackson

ASKER

hi, thanks for the help guys. I'm still havin a bit of trouble. I know it should be simple! I'm using a drop down select box and want the text in the text box to change colour when a different selection is made in the drop down select box. Got any ideas?
hi, thanks for the help guys. I'm still havin a bit of trouble. I know it should be simple! I'm using a drop down select box and want the text in the text box to change colour when a different selection is made in the drop down select box. Got any ideas?
ASKER CERTIFIED SOLUTION
Avatar of lil_puffball
lil_puffball
Flag of Canada image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Thanks. I've managed to sort it now.
Your welcome. Is there any reason for the B?