Enable and disable form fields

[kavionly]

I would like to enable/disabled a 'shift','qty assigned', 'qty produceds' fields if the presence is yes/no.

here is my code. pls help me to sort out this problem
Thanks in advance

<script type="text/javascript">


function enableStates(to_enable)
{
var statesSelectObj = document.getElementById('shift[]');
var statesSelectObj1 = document.getElementById('qtyassigned[]');
var statesSelectObj2 = document.getElementById('qtyproduced[]');
if (statesSelectObj && statesSelectObj1 && statesSelectObj2)
{
if (to_enable)
{
statesSelectObj.removeAttribute('disabled');
statesSelectObj1.removeAttribute('disabled');
statesSelectObj2.removeAttribute('disabled');

}
else
{
statesSelectObj.setAttribute('disabled', 'disabled');
statesSelectObj1.setAttribute('disabled', 'disabled');
statesSelectObj2.setAttribute('disabled', 'disabled');

}



}
}
</script>

<form method ="post" action-"test.php" name="form1" >

<?php
$i=0;
while($i<5)
{
$i++;


?>
<table width="100%">
<td>Present.
<select name="present[]" id="present[]" class="textfield" onChange="enableStates(this.options[this.selectedIndex].value == 'Yes');">
<option value="">Select </option>
<option value="Yes">Yes</option>
<option value="No">No</option>
</select></td>


<td><strong>Shift</strong> <select name="shift[]" id="shift[]" class="textfield">
<option value="">Select Shift</option>
<option value="MS">Morning Shift</option>
<option value="GS">General Shift</option>
<option value="SS">Second Shift</option>
<option value="NS">Night Shift</option>
</select></td>
<td> Qty Assigned.
<input type="text" name="qtyassigned[]" id="qtyassigned[]" />
</td>

<td> Qty Produced.
<input type="text" name="qtyproduced[]" id="qtyproduced[]" />
</td>
</tr>

<?php
}
?>
</table>
</form>

[Kor]

The code should work. What is that php code there for? Do you have more than a single table? In this case you have more that a single id like "shift[]" and so on, which is illegal. The id must be unique on document/session.

[kavionly]

yes i have more than one table and i am using while loop. then how do i pass the ids?

[kavionly]

sorry, i have used php code to get multi row form.so how do i enable/disables text fields based on selection. any suggestions pls?

[criterion9]

Append your counter variable to your id declaration. You have to have unique IDs.

[kavionly]

I have assigned the counter ids to text field ids. Its working only for the first row.
How to pass these counter ids in javascript pls.

here is the code


<script type="text/javascript">


function enableStates(to_enable)
{
var statesSelectObj = document.getElementById('shift[]');
var statesSelectObj1 = document.getElementById('qtyassigned[]');
var statesSelectObj2 = document.getElementById('qtyproduced[]');
if (statesSelectObj && statesSelectObj1 && statesSelectObj2)
{
if (to_enable)
{
statesSelectObj.removeAttribute('disabled');
statesSelectObj1.removeAttribute('disabled');
statesSelectObj2.removeAttribute('disabled');

}
else
{
statesSelectObj.setAttribute('disabled', 'disabled');
statesSelectObj1.setAttribute('disabled', 'disabled');
statesSelectObj2.setAttribute('disabled', 'disabled');

}



}
}
</script>

<form method ="post" action-"test.php" name="form1" >

<?php
$i=0;
while($i<5)
{
$i++;


?>
<table width="100&#37;">
<td>Present.
<select name="present[]" id="present[]" class="textfield" onChange="enableStates(this.options[this.selectedIndex].value == 'Yes');">
<option value="">Select </option>
<option value="Yes">Yes</option>
<option value="No">No</option>
</select></td>


<td><strong>Shift</strong> <select name="shift[]" id="shift[]<?php echo $i;?>" class="textfield">
<option value="">Select Shift</option>
<option value="MS">Morning Shift</option>
<option value="GS">General Shift</option>
<option value="SS">Second Shift</option>
<option value="NS">Night Shift</option>
</select></td>
<td> Qty Assigned.
<input type="text" name="qtyassigned[]" id="qtyassigned[]<?php echo $i;?>" />
</td>

<td> Qty Produced.
<input type="text" name="qtyproduced[]" id="qtyproduced[]<?php echo $i;?>" />
</td>
</tr>
</table>
<?php
}
?>

</form>