jquery 체크 박스 제어 - checkbox dynamic disabled

위에 체크박스 선택시 

아래쪽 input text  disabled 시킨다

다중 체크 박스 적용

<script type="text/javascript">

jQuery( document ).ready( function(){

$("input[name=bond_type]").click(function(){ // 채권 종류 클릭 하면

$(".organize").attr("disabled",true);

/* 하나씩 선택 할때

$('input:checkbox[name="bond_type"]').each(function(){  //  해당 이름 체크 박스 모두 

console.log( $(this).val() );

if($('input:checkbox[name="bond_type"]:checked').val() == 1){ // 체크 값에 따라  

$(".organize").eq(0).attr("disabled",false);

$(".organize").eq(1).attr("disabled",false);

}else if($('input:checkbox[name="bond_type"]:checked').val()  == 2){

$(".organize").eq(2).attr("disabled",false);

$(".organize").eq(3).attr("disabled",false);

}else if($('input:checkbox[name="bond_type"]:checked').val()  == 3){

$(".organize").eq(4).attr("disabled",false);

$(".organize").eq(5).attr("disabled",false);

}else if($('input:checkbox[name="bond_type"]:checked').val()  == 4){

$(".organize").eq(6).attr("disabled",false);

$(".organize").eq(7).attr("disabled",false);

}else if($('input:checkbox[name="bond_type"]:checked').val()  == 5){

$(".organize").eq(8).attr("disabled",false);

$(".organize").eq(9).attr("disabled",false);

}else if($('input:checkbox[name="bond_type"]:checked').val()  == 6){

$(".organize").eq(10).attr("disabled",false);

$(".organize").eq(11).attr("disabled",false);

}else{ // 체크 된게 없으면 모두 disabled

$(".organize").attr("disabled",true);

}

});

});

*/

/*다중 체크 */

$('input:checkbox[name="bond_type"]:checked').each(function(){  //  체크된 박스만 비교 

console.log( $(this).val() );

if($(this).val()  == 1){ // 체크 값에 따라  

$(".organize").eq(0).attr("disabled",false);

$(".organize").eq(1).attr("disabled",false);

} 

if($(this).val()   == 2){

$(".organize").eq(2).attr("disabled",false);

$(".organize").eq(3).attr("disabled",false);

} 

if($(this).val()   == 3){

$(".organize").eq(4).attr("disabled",false);

$(".organize").eq(5).attr("disabled",false);

} 

if($(this).val()   == 4){

$(".organize").eq(6).attr("disabled",false);

$(".organize").eq(7).attr("disabled",false);

} 

if($(this).val()   == 5){

$(".organize").eq(8).attr("disabled",false);

$(".organize").eq(9).attr("disabled",false);

} 

if($(this).val()   == 6){

$(".organize").eq(10).attr("disabled",false);

$(".organize").eq(11).attr("disabled",false);

} 

if($(this).val()  == 0){ // 체크 된게 없으면 모두 disabled

$(".organize").attr("disabled",true);

}

});

});

</script>

<div>

<h4 class="tit-border">1. 종류를 선택하세요.</h4>

<ul class="wrap-pd">

<li style="width:160px"><input type="checkbox"  name="bond_type" value="1"  > 1</li>

<li style="width:160px"><input type="checkbox"  name="bond_type" value="2"  > 2</li>

<li style="width:160px"><input type="checkbox"  name="bond_type" value="3"  > 3</li>

<li style="width:160px"><input type="checkbox"  name="bond_type" value="4"  > 4</li>

<li style="width:160px"><input type="checkbox"  name="bond_type" value="5"  > 5</li>

<li><input type="checkbox"  name="bond_type" value="6"   >기타</li>

</ul>

</div>

<div>

<h4 class="tit-border">2. 입력.</h4>

<div class="ovr-hdn">

<div class="f-r">

<table cellspacing="0" cellpadding="0" class="tbl-line">

<caption class="tit-caption">&nbsp;</caption>

<colgroup>

<col width="127">

<col width="177">

<col width="182">

</colgroup>

<thead>

<tr class="hr">

<th scope="col">종류</th>

<th scope="col" class="txt-c">건수</th>

<th scope="col" class="txt-c">money</th>

</tr>

</thead>

<tbody id="tbody_test">

<tr>

<th scope="row">1</th>

<td class="txt-r"><input type="text"  name="organize_quantity_1" value="0"   class="organize" style="width:90px;"> 건</td>

<td class="txt-r"><input type="text"   name="organize_amount_1" value="0"  class="organize" style="width:110px;"> 원</td>

</tr>

<tr>

<th scope="row">2</th>

<td class="txt-r"><input type="text" name="organize_quantity_2" value="0"  class="organize" style="width:90px;"> 건</td>

<td class="txt-r"><input type="text"  name="organize_amount_2" value="0"  class="organize" style="width:110px;"> 원</td>

</tr>

<tr>

<th scope="row">3</th>

<td class="txt-r"><input type="text" name="organize_quantity_3" value="0" class="organize" style="width:90px;"> 건</td>

<td class="txt-r"><input type="text"  name="organize_amount_3" value="0" class="organize" style="width:110px;"> 원</td>

</tr>

<tr>

<th scope="row">4</th>

<td class="txt-r"><input type="text" name="organize_quantity_4" value="0" class="organize" style="width:90px;"> 건</td>

<td class="txt-r"><input type="text"  name="organize_amount_4" value="0" class="organize" style="width:110px;"> 원</td>

</tr>

<tr>

<th scope="row">5</th>

<td class="txt-r"><input type="text" name="organize_quantity_5" value="0" class="organize" style="width:90px;"> 건</td>

<td class="txt-r"><input type="text"  name="organize_amount_5" value="0" class="organize" style="width:110px;"> 원</td>

</tr>

<tr class="hr">

<td>기타</td>

<td class="txt-r"><input type="text" name="organize_quantity_6" value="0"  class="organize" style="width:90px;"> 건</td>

<td class="txt-r"><input type="text"  name="organize_amount_6" value="0"  class="organize" style="width:110px;"> 원</td>

</tr>

</tbody>

<tfoot>

<tr class="last-border">

<td>합계</td>

<td class="txt-r"><input type="text"  id="organize_quantity_sum" name="organize_quantity_sum" value="0"  class="input-text txt-r" style="width:90px;"  readonly> 건</td>

<td class="txt-r"><input type="text"  id="organize_amount_sum" name="organize_amount_sum" value="0"  class="input-text txt-r" style="width:110px;" readonly> 원</td>

</tr>

</tfoot>

</table>

</div>

</div>

</div>

checkbox-disabled.jsp