Dynamically assigning CSS Style 1

Annelies · May 20, 2003

Hi

I want to be able to change the CSS Style of a textbox based on an event (in this case, the user clicking a checkbox).

Can I do this? I'm using a javascript function (but am not a javascript guru, so don't know if I'm missing the obvious!).

Thanks for your help!!

Annelies =)

greedyzebra · May 20, 2003

Assuming that your textbox looks like this:

<input type="text" id="txtBox">

You can change the style like this:

<script language="javaScript">
function changeStyle()
{
document.getElementById('txtBox').style.color = "red";
}
</script>

For your checkbox, just call changeStyle() with the event "onclick": onclick="changeStyle()"

Hope that helps.

Annelies · May 20, 2003

Hmmm

I can't seem to get that to work...

I get an error message "Object doesn't support this property or method"

Any other ideas gratefully appreciated!!!

Thanks

Annelies

greedyzebra · May 20, 2003

There aren't a ton of things you can do with the style of a textbox, but here's one of the most obvious. This calls the JavaScript function based on the cursor's leaving the textbox. But its behaviour would be the same if triggered by the "onclick" event of the checkbox.

<html>
<body>
<script language="javaScript">
function changeStyle()
{
document.getElementById('txtBox').style.backgroundColor = "red";
}
</script>
<input type="text" name="T1" id="txtBox" size="20" onblur="changeStyle()">
</body>
</html>

Annelies · May 20, 2003

Awesome!!!

Thank you!!!

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Dynamically assigning CSS Style 1

Annelies

Programmer

greedyzebra

Technical User

Annelies

Programmer

greedyzebra

Technical User

Annelies

Programmer

Similar threads

Part and Inventory Search

Sponsor