Question

I have something like this:

<table>

<tr><td><input type="checkbox" id="checkbox1"></input></td><td><input type="text" disabled="disabled" id="textInput1"></input></td></tr>
<tr><td><input type="checkbox" id="checkbox2"></input></td><td><input type="text" id="textInput2" disabled="disabled"></input></td></tr>
<tr><td><input type="checkbox" id="checkbox3"></input></td><td><input type="text" id="textInput3" disabled="disabled"></input></td></tr>
<tr><td><input type="checkbox" id="checkbox4"></input></td><td><input type="text" id="textInput4" disabled="disabled"></input></td></tr>

</table>

I’m trying to enable the text inputs of the row where the checkbox being clicked is. Also more than one row must be selected upon checkbox selection. I tried using some basic jquery but it lacks by only enabling/disabling all the text inputs of all rows despite which checkbox being clicked. Thanks in advance.

EDIT:

$("checkbox").click(function(){

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

Answer 1

Try this

$(":checkbox").click(function(){
   $(this).closest("tr").find("input:text]").attr("disabled", !this.checked);
});

Working demo