ansaurus

Question

Problem disabling/enabling multiple form elements using javascript

Answer 1

A:

It is difficult to guess the true cause of your problem because it depends on the content of HTML this Javascript is supposed to work on and you have not included that.

But I do have a suggestion: avoid getElementsByName(). According to the specification of HTML, multiple elements can have the same name and if you are dealing with unique elements, using the id="uniqeintentifier" attribute along with getElementById() is a better idea and it requires less code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Form disabling sample</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<body>
<script  type="text/javascript">
 function toggle() {
  var prefix = 'a', phaseNumber = 1, objectNumber = 1;
  var theBox = document.getElementById('theBox');
  document.getElementById(prefix + "fase" + phaseNumber + "_" + objectNumber + "_quantity").disabled = !theBox.checked;
  document.getElementById(prefix + "fase" + phaseNumber + "_" + objectNumber + "_description").disabled = !theBox.checked;
  document.getElementById(prefix + "fase" + phaseNumber + "_" + objectNumber + "_price").disabled = !theBox.checked;
  document.getElementById(prefix + "fase" + phaseNumber + "_" + objectNumber + "_language").disabled = !theBox.checked;
 }
</script>
<form action="#">
 <input id="theBox" type="checkbox" checked="checked" onclick="toggle();" />
 <input id="afase1_1_quantity" type="text" />
 <input id="afase1_1_description" type="text" />
 <input id="afase1_1_price" type="text" />
 <input id="afase1_1_language" type="text" />
</form>
</body>
</html>

Saul 2010-09-18 11:18:09

Thank you for your time and your advice. I noticed this problem already, as the project grew bigger and bigger, but I was too lazy to change it ^^ anyway, now I corrected the code, using IDs in the HTML source and getElementById(), but the problem remains.

Valerio 2010-09-18 12:28:58

Answer 2

A:

Why don't you try with jQuery? it's much easier interact with multiple elements using jQuery than classic javascript. take a look here: http://it-things.com/index.php/2010/09/using-jquery-to-interact-with-multiple-items/

Joao Pinto 2010-09-18 12:31:11

Altough this problem was just a mistake of mine, I'll definitely take it into consideration for my next project... thank you.

Valerio 2010-09-18 12:43:12

Answer 3

A:

I just made it work and, as I thought, it was a very bad mistake.

The problem was, not every form row in the HTML has all of those 4 fields. So, basically, I was trying to access a property of a null object.

I solved it by putting:

if( document.getElementById(id) != null )

before trying to manipulate the element.

Sometimes when you're in a hurry, you end up neglecting some very basic stuff...

Thank you for your time.

Valerio 2010-09-18 12:41:41

When asking questions like this, it is usually a good idea to include HTML. Looking only at the Javascript there is no way to know for certain where the bug is.

Saul 2010-09-18 13:42:32

You're right. Next time I'll post HTML, too. I hope there isn't a next time, though ;)

Valerio 2010-09-18 14:00:34

ansaurus

tags:

views:

answers:

Problem disabling/enabling multiple form elements using javascript

related questions