How to disable a table row

JavaScript
1

Hey all.

I’m looking to disable/enable table rows on events but what I’m using is not working.

The table row ID is “row1”, so I use document.getElementById(“row1”).disabled = true;

That doesn’t work. I’m using FF, tested it in IE and the fields are “grayed” out but you can still enter text inside them.

Any ideas?

2

You can’t really disable a table row, since it’s not an input element. (not sure why IE chooses to do it for some reason). What you need to do is to make the row grey by using a css class, or alternatively document.getElementById(“row1”).style.backgroundColor = ‘#ccc’.

3

So that means I’d have to disable each element “manually”, right?

4

If by that you mean give it the appearance of being disabled, then yes. You just need to change the style.

5

IE also allows you to set the disabled attribute on other elements than form elements. You will automatically get this grayed out effect on tables etc. They seem to have implemented this half way though, since a disabled link can still be clicked on etc. The disabled attribute can be handy in a IE only intranet, but use jimbo_dk’s solution instead (CSS solution) for a cross-browser solution.