Aktivieren und Deaktivieren von Array von TextBoxes durch Kontrollkästchen

Question

Ich habe an diesem Code gearbeitet! und ich konnte es nicht richtig gemacht.

Was ich will, ist das Textfeld aktiviert werden, wenn das entsprechende Kontrollkästchen aktiviert ist. aber wenn die Funktion nichts gelten passiert :(

in meinem Code, den Text und Kontrollkästchen werden aus der Datenbank mit PHP dynamisch generiert hier ist mein Code:.

<div><div class="ac-container"> 

<div id="accordion"> 

<?php 

$qry="SELECT * FROM catalog"; 
$result= mysql_query($qry); 
if($result){ 
while($info = mysql_fetch_array($result)) 
{ 

print "<h3><a href=\"\#\"> cat:".$info['name']."</a></h3><div>"; 

$qryitem="SELECT * FROM item WHERE Id=". $info['Cid']; 
$resultitem=mysql_query($qryitem); 
if($resultitem){ 

?> 

<form name="form1" id="form" method="post" action="manage_item_action.php" > 
<?php 
while($info=mysql_fetch_array($resultitem)) 
{ 
?> 
<input type="checkbox" id="checkB" name="op[]" value="<?php echo $info['Id'];?>" /> <?php echo $info['name'];?> 
<label> Quantity <input disabled="disabled" id="textB" type="text" 
name="Quantit[]" value="<?php echo $info['Quantity'];?>"/> 
</label> 
<script> 



checkBoxes=document.form1.elements['op[]']; 
textBoxes=document.form1.elements['Quantit[]']; 
for(var i=0 ; i<checkBoxes.length;i++){ 
checkBoxes[i].onchange = function() { 
textBoxes[i].disabled =!(this.checked);}; 


} 

</script> 



<br/> 

     <?php 
     } 
    } 


else echo "There are no items."; 

print "</div>"; 



} 
} 


?> 

</div> 

<input type="submit" value="update" name="submit"/> 
<input type=reset value="clear"></td></tr> </form> 

Answer 1

Das Problem, das Sie haben, ist, dass . in Ihren Event-Handler wird die Variable i nicht definiert dieses Problem zu überwinden, könnten Sie eine Eigenschaft auf jedes Kontrollkästchen hinzufügen zu speichern, welchen Index sie sich beziehen:

checkBoxes=document.form1.elements['op[]']; 
textBoxes=document.form1.elements['Quantit[]']; 
for(var i=0 ; i<checkBoxes.length;i++) 
{ 
    checkBoxes[i].myIndex = i; 
    checkBoxes[i].onchange = function() { 
     textBoxes[this.myIndex].disabled =!(this.checked); 
    }; 
} 

Andere Methoden löse dieses Problem: http://www.howtocreate.co.uk/referencedvariables.html

Dein Code ist immer noch ziemlich durcheinander. Zum Beispiel generieren Sie zu viele schließen <div/> -Tags mit Ihrer ersten print-Anweisung. Ich würde vorschlagen, dass Sie nur den PHP-Code von Ihrer Frage entfernen, da die Frage nur auf HTML und Javascript bezogen wird.

Ich würde auch vorschlagen, eine Bibliothek für die Manipulation von DOM-Elementen wie jQuery zu verwenden.

Beim Schreiben und Debuggen von JavaScript sollten Sie immer sicherstellen, dass Sie Fehlermeldungen erhalten. "Nichts passiert" ist ein Zeichen, dass Sie Fehler einfach ignorieren. Für Firefox laden Sie das Addon Firebug herunter. Safari verfügt auch über Entwickler-Tools, die Sie in den Einstellungen aktivieren können. Mit diesen Tools können Probleme wie diese einfach erkannt und behoben werden.