[jQuery] select input in td not wokring, and disabled textbox centered
Hi,
I have this problem. check the code below
when first checkbox unchecked will disable 2nd checkbox and textbox;
when 2nd checkbox unchecked will disable textbox.
now 2nd checkbox works just fine, but I have problem to make 1st one
work.
I use
$(this).parent().nextAll().attr('disabled', !$
(this).is(':checked'));
which will disable 2nd checkbox and textbox, but I still can enter
in textbox, I knew it will disable TD instead of the INPUT inside.
I also try
$(this).parent().find('input').attr('disabled', !$
(this).is(':checked'));
$(this).parent().nextAll('input').attr('disabled', !$
(this).is(':checked'));
none of them works.
How I can make this work?
Thank you,
Wes
<!-- Code Start-->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>New Document </title>
<meta name="Generator" content="EditPlus"/>
<meta name="Author" content=""/>
<meta name="Keywords" content=""/>
<meta name="Description" content=""/>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
// On/Off check box event
$("#tblACR td:first-child input").click(function() {
$(this).parent().nextAll().attr('disabled', !$
(this).is(':checked'));
});
// Zone associate check box Event
$("#tblACR td:nth-child(3) input:checkbox").click(function() {
$(this).next().attr("disabled", !$(this).is(":checked"));
});
$("#acrzt1").val("R1 R2 R3");
});
</script>
</head>
<body>
<table id="tblACR">
<tr>
<td>
<input id="acr1" type="checkbox" />
</td>
<td class="desc">
The siting of identical front elevation side by side
is prohibited
</td>
<td class="ArchZoneChk">
<input id="acrz1" type="checkbox" />Zone associated
<input type="text" class="ArchZoneTxt" id="acrzt1" /></
td>
</tr>
</table>
</body>
</html>
<!-- Code End-->