2016-04-15 18 views
0

Wenn das Kontrollkästchen aktiviert ist, möchte ich den Eingabetyp aktivieren. Ich habe das Kontrollkästchen aktiviert, aber Eingabe-Typ immer noch deaktivieren. bitte helfen ..Eingabeart kann nicht aktiviert werden, wenn das Kontrollkästchen aktiviert ist (Jquery)

das ist mein jquery

$('#haha').change(
    function(id) { 
    if (this.checked) { 
     $("#nama_" + id).prop('disabled', false); 
     $("#ket_" + id).prop('disabled', false); 
    } else { 
     $("#nama_" + id).prop('disabled', true); 
     $("#ket_" + id).prop('disabled', true); 
    } 
    $(document).ready(function() { 
     $("input").focus(function() { 
     $(this).css("background-color", "yellow"); 
     }); 
     $("input").blur(function() { 
     $(this).css("background-color", "#lightblue"); 
     }); 
    }); 
    }); 

und hier ist meine Checkbox und input type

<td> <input type ="checkbox" id="haha" class=checkbox1 name="checklist" value=<?php echo $agenda->id; ?>> <?php echo $agenda->id; ?> </td> 
<td> <input type="text" name="dnama" id="nama_<?php echo $agenda->id; ?>" class="yes" value="<?php echo $agenda->nama; ?>" disabled /> </td> 
<td> <input type="text" name="dketer" id="ket_<?php echo $agenda->id; ?>" value="<?php echo $agenda->keterangan; ?>" disabled> </td> 
+0

Sie sollten zu "entfernen" versuchen Attribut über prop zum Entfernen von DISABLED-Attribut entfernen verwenden, um die Eigenschaft "disabled", nicht auf "false" setzen ... – Random

+1

Warum dom ready-Ereignis im Änderungsereignis definiert ist. es sollte das Gegenteil von dem sein, was Sie tun –

+0

ich änderte es, aber immer noch gleich. . Ich denke, das Problem ist hier $ ("# nama_" + id). Wenn der Name meines Eingabetyps nur "nama_" und $ ("# nama_" + id) lautet, wird in $ ("# nama_") geändert. aber ich brauche + ID, um anderen Wert zu erhalten –

Antwort

0

Zu allererst klicken Ereignis verwenden, statt Änderung Ereignis für Checkbox .

Auch warum haben Sie document.ready Anweisung innerhalb der Funktion gehalten. Was ich vorschlage, ist, diese Aussage herauszubringen und alle Ereignisse in diesem Fall zu binden.

Das Problem ist, dass die Variable id, die Sie verwenden, nicht den Wert haben, den Sie denken. Es enthält das Ereignisobjekt. Um die Textelemente zu erhalten, können Sie den [type = text] Selektor verwenden. ** Verwenden Sie den [type = text] Selektor nur, wenn Sie nur diese Eingänge und das Kontrollkästchen haben. Wenn Sie auch andere Elemente haben, verwenden Sie den entsprechenden Selektor. Der Code folgt wie folgt.

$(document).ready(function() { 
    $("input[type=text]").focus(function() { 
     $(this).css("background-color", "yellow"); 
    }).blur(function() { 
     $(this).css("background-color", "#lightblue"); 
    }); 

    $('#haha').click(function() { 
     if ($(this).is(":checked")) { 
      $("input[type=text]").prop('disabled', false); 
     } else { 
      $("input[type=text]").prop('disabled', true); 
     } 
    }); 
}); 

Ordnung für die spezifischen ID-Selektoren, kann ich von Ihrem html sehen, die die ID des Wertes der Option umfasst. So können Sie das auch verwenden.

$(document).ready(function() { 
    $("input[type=text]").focus(function() { 
     $(this).css("background-color", "yellow"); 
    }).blur(function() { 
     $(this).css("background-color", "#lightblue"); 
    }); 

    $('#haha').click(function() { 
     var id_suffix = $(this).val(); 
     if ($(this).is(":checked")) { 
      $("input#name_"+id_suffix).prop('disabled', false); 
      $("input#ket_"+id_suffix).prop('disabled', false); 
     } else { 
      $("input#name_"+id_suffix).prop('disabled', false); 
      $("input#ket_"+id_suffix).prop('disabled', false); 
     } 
    }); 
}); 
+0

danke für Ihre Antwort, aber wenn ich Kontrollkästchen anklickte, werden alle Eingabe-Typ aktiviert sein. Ich möchte aktivieren, dass ich gerade geklickt habe –

+0

es funktioniert, aber Eingabetyp aktiviert ist nur die erste Zeile. .wenn ich das Kontrollkästchen deaktiviert und die nächste Zeile markiert habe, ist der Eingabetyp weiterhin deaktiviert. Ich denke, das Problem kommt von $ ('# haha'). Diese ID kann nicht gleich sein. was soll ich machen? –

+0

Ja, Sie haben Recht. Die ID zweier Elemente sollte nicht identisch sein. Überprüfen Sie, ob Sie diesen Fehler begangen haben. Dazu können Sie Selektoren spezifisch machen oder innerhalb der Eltern suchen, damit die Eingänge deaktiviert/aktiviert werden. – Aditya

0
function enable(id) { 
if(document.getElementById('haha').checked) { 
document.getElementById("nama_"+id).disabled= false; 
document.getElementById("ket_"+id).disabled= false; 

}else { 
    document.getElementById("nama_"+id).disabled= true; 
    document.getElementById("ket_"+id).disabled= true; 
} 

}

0

Dies sollte funktionieren, müssen Sie

$('#haha').change(function(event) { 
    var id = event.target.id; 
    if (this.checked) { 
     $("#nama_" + id).removeAttr('disabled');   $("#ket_" + id).removeAttr('disabled'); 
} else { 
    $("#nama_" + id).attr('disabled', true); 
    $("#ket_" + id).attr('disabled', true); 
} 
$(document).ready(function() { $("input").focus(function() { $(this).css("background-color", "yellow"); }); $("input").blur(function() { $(this).css("background-color", "#lightblue"); }); }); }); 
+0

wenn Kontrollkästchen aktiviert ist, möchte ich den Typ von deaktiviert in aktiviert eingeben. –

+0

Ich habe die Antwort aktualisiert, jetzt sollte es das Problem lösen –

Verwandte Themen